How to escape blade instructions in a blade template? - laravel-blade

I'm writing a tutorial on Sass in a blade template and want to discuss Sass' #include syntax. But '#include' is a reserved command in Blade. How can I escape this?
Sample html in my blade template:
<p>Use <code>#include</code> to include a Sass <code>#mixin</code>...</p>
Edit:
I can escape the # in HTML by using #, but am still interested if there is a way to escape the Blade instruction.

You can try to solve this situation by writing - {{ '#'.'include' }} instead of #include in your Blade template.
So your whole thing would look like:
<p>Use <code>{{ '#'.'include' }}</code> to include a Sass <code>#mixin</code>...</p>

Related

VS Code and Handlebars formatting unable to get partials on new lines

after a PC crash I was luckily able to recover data but not programs and settings. Now using VS Code + Prettier I'm not able to have multiple Handlebars partials to new lines. Eg:
{{> Partial_1}}
{{> Partial_2}}
on save it becomes:
{{> Partial_1}} {{> Partial_2}}
Can't find the solution (or maybe I'm not asking the right question to Google)...
There are some issues with Prettier & handlebar files. From your example, it seems that you are using HTML Language Features as the formatter.
Try setting this in your VS Code settings.json file
"html.format.indentHandlebars": true
You can however right-click the .hbs file and select the option Format Document With to choose Prettier. You can also set Prettier as the default formatter for handlebar files but currently, Prettier uses the Glimmer parser for handlebar files which does not support partials so your codes won't be formatted properly.
See the related issue on Github: https://github.com/prettier/prettier/issues/11834
Possible workaround: How to solve handlebar partials are not supported in VS Code?

CSS and JavaScript libraries are not working with Required Parameters in Laravel

In my Laravel application, all the CSS and JQ libraries are working fine.
But as soon as I use routes with parameters it breaks CSS, JQ, and fontawesome.
Then I managed to fix the CSS issue by using Assets URLs as below.
{{ asset('css/admin.min.css') }}
But Jquery is not working yet. How can I fix this issue?
Add '/' before path like this: {{ asset('/css/admin.min.css') }}
Add '/' before 'href="assets/css/animate.css" to href="/assets/css/animate.css"

Symfony template rendering syntax style

A question which I am asking myself since a while:
Can anyone tell me if there is a difference in rendering a template with #-annotation or in colon-style:
#Acme/AcmeBundle/Default/index.html.twig
Acme:AcmeBundle:Default:index.html.twig
and if there is a difference what is it,
if not which is the newer/proper one and should be used accordingly?
Both namespaced templates and traditional template will work as expected in views but it wont work in controllers. Please check here
// namespaced templates will no longer work in controllers
$this->render('#App/Default/index.html.twig');
// you must use the traditional template notation
$this->render('AppBundle:Default:index.html.twig');
{# inside a Twig template, namespaced templates work as expected #}
{{ include('#App/Default/index.html.twig') }}
{# traditional template notation will also work #}
{{ include('AppBundle:Default:index.html.twig') }}
The namespaced syntax is faster.
Please refer this for more info

Jekyll Syntax Highlighting Not Working - Classes Are Not Being Added

I cannot get syntax highlighting to work on my Jekyll-powered blog.
The development files can be found here: https://github.com/StevenXL/stevenxl.github.io.
As you can see, in my _config.yml file, I have the following:
markdown: kramdown
kramdown:
syntax_highlighter: rouge
In my css/custom.css file, I am importing the CSS file to highlight the syntax with an #import command.
The actual CSS file for highlighting lives in css/monokai.css.
I am not sure what I am doing wrong. This seems to work fine on my local preview when I run jekyll serve but not when I push the development files to GitHub.It doesn't seem to be adding the correct classes when built by GitHub.
I had the same issue using the monokai highlighting css from the jekyll-uno theme.
To solve the problem I had to update the CSS, using rouge itself is quite straightforward (taken from the docs):
rougify style monokai > css/monokai.css
There are other themes available, too.
For me this seemed to be a casing issue for my language hints.
Did not work:
``` SQL
Worked:
``` sql
You must use the Jekyll highlight tag
{% highlight ruby %}
def foo
puts 'foo'
end
{% endhighlight %}

Do I need to generate a css file from Pygments for my jekyll blog, to enable colorful code snippet?

This is my first time to use Jekyll and Pygments. But I don't know how to insert colorful code snippet.
I successfully installed Pygments, following the official steps, with the markdown like this:
{% highlight ruby %}
def foo
puts 'foo'
end
{% endhighlight %}
I see the html source code including the classes, however there is no color for the this snippet.
Do I need to generate some css files from Pygments and include them? And how?
Yes, you need to either install or create CSS classes to make the code highlighting work Pygments does visible. After installing Pygments, this can be done by running the following from the command line:
pygmentize -S default -f html > pygments.css
This will create a pygments.css file with the default in your current directory; pygments -L style will list all available styles.
You can either move this into your HTML tree and call it with a corresponding:
<link rel="stylesheet" type="text/css" href="/path/to/pygments.css">
Or, copy the contents of pygments.css and place it in an existing style sheet. That will get you started. You can edit the CSS from there to customize as appropriate.
Two notes:
You've probably already done this, but for the benefit of people who are new to Jekyll and Pygments, you'll probably also have to add pygments: true to your _config.yml file to get Pygments working. (Or, run jekyll with jekyll --pygments which has the same effect.)
The original Jekyll installation documentation wasn't very clear about how to get Pygments working when this question was asked. I added 'Pygments Usage' section since then to hopefully help clear things up there as well.
You need to include syntax.css
You can take the sample from my repo
https://github.com/madhur/madhur.github.com/blob/master/files/css/syntax.css
and then customize it according to your theme. Mine is customized for dark backgrounds.

Resources