Laravel blade regex image and output it? - laravel

Hi I have twitter api working to output details on the page however, this
field:
{{ $item['text'] }}
Gives me something like this:
RT #JacksSmokehouse: Don't forget #HappyHour tomorrow until 6pm - #loveJacks #live_oldham #OldhamHour #YouDontKnowJack https://twitter.com/shorturl, (with t.co)
So the image https:// I want to actually display it? is it possible to write in blade template a regex, something like this:
for each {{$item['text']}} take the url if there is any and output it below the text? can be a different variable.
Here's my full code:
<div>
#if(!empty($twitterItems))
#foreach($twitterItems as $key => $item)
{{ $item['text'] }}
#if(!empty($item['extended_entities']['media']))
#foreach($item['extended_entities']['media'] as $image)
<img src="{{ $image['media_url_https'] }}" style="width:100px;">
#endforeach
#endif
{{ $item['favorite_count'] }}
{{ $item['retweet_count'] }}
{{ $item['created_at'] }}
#endforeach
#else
There are no data.
#endif

Related

How to customize the emails sent by Laravel Breeze?

I wanted to customize the emails sent by Breeze from the default styles. Looks like the installation of Breeze does not publish the files for that but I found online that using php artisan vendor:publish --tag=laravel-notifications will publish the email files, and it did, although looks like it did not publish all the necessary files (it only published one file)
It only published /vendor/notifications/email.blade.php, with the following code, but looks like other things are missing like the components themselves such as the x-mail::button?
<x-mail::message>
{{-- Greeting --}}
#if (! empty($greeting))
# {{ $greeting }}
#else
#if ($level === 'error')
# #lang('Whoops!')
#else
# #lang('Hello!')
#endif
#endif
{{-- Intro Lines --}}
#foreach ($introLines as $line)
{{ $line }}
#endforeach
{{-- Action Button --}}
#isset($actionText)
<?php
$color = match ($level) {
'success', 'error' => $level,
default => 'primary',
};
?>
<x-mail::button :url="$actionUrl" :color="$color">
{{ $actionText }}
</x-mail::button>
#endisset
{{-- Outro Lines --}}
#foreach ($outroLines as $line)
{{ $line }}
#endforeach
{{-- Salutation --}}
#if (! empty($salutation))
{{ $salutation }}
#else
#lang('Regards'),<br>
{{ config('app.name') }}
#endif
{{-- Subcopy --}}
#isset($actionText)
<x-slot:subcopy>
#lang(
"If you're having trouble clicking the \":actionText\" button, copy and paste the URL below\n".
'into your web browser:',
[
'actionText' => $actionText,
]
) <span class="break-all">[{{ $displayableActionUrl }}]({{ $actionUrl }})</span>
</x-slot:subcopy>
#endisset
</x-mail::message>
How can I customize that? The buttons for example? Because looks like this template is working for all the types of emails (welcome, verification, password-reset), so I can't just replace the contents with my code but I somehow need only to change the styles

Hugo: How can I display an image in my post list

I am trying to display an image in my post list.
In order to achieve that I added some tags in my post.md:
---
title: "Hello"
header_image: /images/blog/2019/water.jpg
images: /images/blog/2019/water.jpg
resources:
src: /images/blog/2019/water.jpg
title: "The image I want"
---
Then I edited list.html and tried different things:
{{ define "main" }}
<div class="archive animated fadeInDown">
<ul class="list-with-title">
<div class="listing-title">{{.Title}}</div>
{{ range .Pages }}
<ul class="listing">
<div class="listing-item">
<div class="listing-post">{{ .Title }}
{{ with .Resources.ByType "image" }}
<div class="Image">
{{ range . }}
<img src="{{ .RelPermalink }}">
{{ end }}
</div>
{{ end }}
{{ $.Param "header_image" }}
-- {{ range .Page.Resources }}
THERE IS ONE ITEM => NOT WORKING
{{ end }} <<
<div class="post-time"><span class="date">{{.Date.Format "Jan 2" }}</span></div>
</div>
</div>
</ul>
{{ end }}
</div>
{{ end }}
But when I try to display Resources, I always get [] (nothing)
Any idea what I am doing wrong?
I don't think your {{ $.Param "header_image" }} is working, either.
The way to access your custom, non-standard variables on pages, as well as sites, is through the .Params object, e.g. .Params.header_image. Note the small letter at the beginning, as opposed to capital letters for built-in params.
Page-level params on the Hugo Docs
Custom page params
To access
---
header_image: /images/blog/2019/water.jpg
---
you can use this in your page template.
{{ .Params.header_image }}
Resources
Page resources on Hugo Docs
It seems that resources is actually an array of objects, and with yaml, you should actually have something like this (note the dash):
resources:
- src: /images/blog/2019/water.jpg
title: "The image I want"
Also mind that this feature seems to only be available only for page bundles
Debugging
You can use {{ printf "%#v" .Resources }} for debugging.

Hugo definition of non-site level variables/parameters query

I am using Hugo Universal Theme. I am new to static site generators. This question is for someone who is familiar with hugo templates.
In layouts/partials/features.html we can see where $element.name and $element.name.description are rendered:
{{ if isset .Site.Params "features" }}
{{ if .Site.Params.features.enable }}
{{ if gt (len .Site.Data.features) 0 }}
<section class="bar background-white">
<div class="container">
{{ range $index, $element := sort .Site.Data.features "weight" }}
{{ if eq (mod $index 3) 0 }}
<div class="col-md-12">
<div class="row">
{{ end }}
<div class="col-md-4">
<div class="box-simple">
<div class="icon">
<i class="{{ .icon }}"></i>
</div>
<h3>{{ $element.name }}</h3>
<p>{{ $element.description | markdownify }}</p>
</div>
</div>
{{ if or (eq (mod $index 3) 2) (eq $index (sub (len $.Site.Data.features) 1 )) }}
</div>
</div>
{{ end }}
{{ end }}
</div>
</section>
{{ end }}
{{ end }}
{{ end }}
The data to be rendered in this case are defined in data/features/consulting.yaml as follows:
weight: 4
name: "Consulting"
icon: "fa fa-lightbulb-o"
description: "Fifth abundantly made Give sixth hath..."
What should I do to add new variable to the yaml file that can later then be rendered through the html file when hugo is compiling the site. I tried to simply add another parameter param1 and then insert a corresponding line in the html file as <p>{{ $element.param1 | markdownify }}</p> just below description paragraph but got error
ERROR 2018/08/23 10:42:42 Error while rendering "home" in "":
template: index.html:22:11: executing "index.html" at <partial
"features.ht...>: error calling partial: template:
partials/features.html:18:56: executing "partials/features.html" at
: wrong number of args for markdownify: want 1 got 0
Clearly it seems I have not been able to define the variable properly, but where should I do that? I can add another site variable to config.toml, but I want to learn how to make page specific variables that can be defined in yaml/frontmatter type entries. I tried reading about hugo variables but got bogged down in what is a variable and what is a shortcode. Many thanks for your help with this example.
Well, I found a working answer, but I still do not fully understand how it fits with Hugo variable system, so a better answer and or comments are highly welcome.
It appears quite simple. I had to define url variable in the yaml file:
name: "History"
position: "Hx"
url: "/blog/2018/08/23/01-history/"
and then use in the html file like this:
{{ if .url }}
<a href="{{ .url }}">
<h5>{{ .name }}</h5>
</a>
{{ else }}
<h5>{{ .name }}</h5>
{{ end }}
What it does is puts the .name in link tag, if .url is defined in .yaml. This works also if an absolute URL is given. So it appears that a page variable is referred to as .myVariable. the template authors used $element.name in another place as above, which confused me.
I also can refer to the parameter defined in the frontmatter as .Params.name
I found pointers at https://github.com/devcows/hugo-universal-theme/pull/166 and tested in adjusting the template; it works well.

How do you extract view code to a Component in Volt

I’m trying to extract some repeated view stuff into a component, in a similar way to a rails partial.
I want this:
{{ activity.each do |activity| }}
<div class="{{ activity.style_class }}>
{{ activity.text }}
</div>
{{ end }}
To become this:
{{ activity.each do |activity| }}
<:activity>
{{ end }}
But whenever I try to move my view code to app/activity/views/main/index.html
I get errors about activity not existing.
The trick is to pass in model when calling the component:
// app/main/views/main/index.html
{{ activity.each do |activity| }}
<:activity model="{{ activity }}">
{{ end }}
Then in your component you scope it onto itself like this:
// app/activity/views/main/index.html
<div class="{{ style_class }}>
{{ text }}
</div>

Handling conditions in blade templates on laravel 4 in a form input

I would like to test the existence of value in blade on Laravel 4.
Like:
{{ Form::text('name', #if(isset($value)) {{$value}} #endif; }}
I tried this:
{{ Form::text('name', #if(isset($value)) $value #endif; }}
You can do it in one line.
I'd prefer a better approach, using condition?if:else , which also I use in my daily projects:
{{ Form::text('name',isset($value)?$value:'') }}
or even:
{{ Form::text('name',isset($value)?$value:null) }}
Anywhere before that, you can add the line <?php if(!isset($value)) { $value= ''; } ?>. Then you can proceed as usual {{ Form::text('name', $value) }}

Resources