Laravel Blade adds unwanted spaces in final HTML - laravel

I'm developing views in Laravel Blade and I always get unwanted spaces in the final HTML (checking with Dev tool) like this (ugly case):
You'll see a lot of unwanted spaces, where the code is simply:
<!-- Ugly -->
<div>
Lorem ipsum
<div>
Lorem ipsum
</div>
</div>
Obviously I've tabulation set as spaces in my IDE.
I tried to remove them in many ways where the only one that works is to put all inline:
<!-- Beautiful (but I can't do this for all!) -->
<div>Lorem ipsum<div>Lorem ipsum</div></div>
but very often I can't do that.
How can avoid all these spaces?
EDIT: this seems to happens in Chrome, not in Firefox

I am noticing this as well. There is interaction between the blade directives and the output formatting/whitespace.
I think what is going on is that the breakpoints in the rendered php occur at the line position of the blade directives. I think this is effectively the desired behaviour though as it is the same behaviour I notice if I use <?php ?> breaks in place of the blade directives.
The way I have worked around this pre-laravel was to zero-indent the <?php ?> breaks, which effectively re-zeros the indent for the contents generated within the <?php ?> braces. This works well and is the most logical way I have found to precisely control the output whitespace from a code readability perspective (though not perfect!).
The equivalent in blade-land appears to be to do the same with blade directives, ie. put them on a new line at position zero. This looks a bit irksome (as it does with regular <?php ?> breaks) but it is the only way I have found to control the output (and I still find regular php to be easier to read and faster to type out than the blade directives for the most part, where you don't need features like $loop).

Related

how to ignore iframe on blade Laravel

#Asking
Help me for my problem, when i built a website with Laravel
i am render my post with syntax like this :
<div>
<p>{!! $post->content !!}</p>
</div>
but i have problem, when i insert a i frame inside post, because the html has been removed with {!! !!}.
i have to try use {{ $post->content }}, but all content rendered with HTML
Any solution to this problem? ?
Thanks very much
With {!! you paste content "as is", in other words you become vulnerable to all types of issues like allowing <script> tags to be placed into your templates.
The {{ syntax will escape any HTML thus what you see is the actual html characters without actually parsing it (i.e. doing {{ '<b>bold</b>' }} will not result in a bold font but in the text <b>bold</b>).
Now with your problem: there are some cumbersome ways to filter out any html tags yourself and leave the <iframe>'s in there (something like {!! only_iframe($content) !!}), but it is quite difficult and will likely not result in a safe solution.
Your own answer which stated that you used {!!html_entity_decode($post->content)!!} simply means that your HTML was encoded to start with, which is not something I can deduct from your question. Note that you are now vulnerable to malicious code injection if you are not certain you can control the contents of $post->content.

CKEDITOR's source code mode scrambles custom template code

I'm trying to allow custom "template code" within the source code editor. My code snippets would always look like {* anything here *}. It mostly works, but if used inside an HTML tag things gets scrambled.
I'm already using allowedContent: true, when starting CKEDITOR.
Example:
<p style="{* some "short code" of mine... *}">Text</p>
turns into
<p style="{* some " short="" code"="" of="" mine...="" *}"="">Text</p>
And
<p {* tet_pos_is_inside *}>Fuss</p>
into
<p {*="" tet_pos_is_inside="" *}="">Fuss</p>
Any advise ?
Thanks,
Sebastian
My advise would be to never use them inside tags, it sounds like a nightmare to configure. What is the requirement you are trying to fill with those?
You could go around this issue with pre- and post processing using classes, data attributes and/or custom attributes. For example you could use something like his:
<p class="tet_pos_is_inside_val-12345 foo-val-12345">I love horses</p>
<p data-tet_pos_is_inside="12345" data-foo="">I love bunnies</p>
<p tet_pos_is_inside="12345" foo="">I love cats</p>
Well,
apparently there was a simple solution to solve my current problem:
<p style="{* some 'short code' of mine... *}">Text</p>
works ! Note the use of singe-quotes inside the double quotes.
IOW, as long as there is a <tag attr="val"> then val can be anything except containing more double quotes.
Thanks for the comments.

How to fetch() sub-parts of a Smarty template

Background Smarty is a templating engine that separates the presentation layer from the logic layer of web applications. It is well-suited for the Model-View-Control approach to developing web applications. The View can be represented by Smarty templates, which contain only HTML and Smarty tags. The Control can be implemented by PHP files that serve the appropriate views based on the logic contained within them via PHP code. The View is instantiated by displaying the templates via the display() command. Alternatively, a template can be read in as a variable without displaying it via the fetch() command. The file name of the template is the argument to both these commands.
Issue The fetch() command can read an entire template. In order to read parts/sub-parts of a template, each of these parts would normally needed to be stored in a separate file with its own name that can be the argument to the command. This creates needless files.
Question Is it possible to fetch only parts of a Smarty template by somehow marking sections of the template?
Case example Below I present a sample template file with Smarty and HTML tags, as well as the corresponding controller file with PHP code.
Template file (index.tpl)
<html>
<body>
<div id="sec1">
First section
</div>
<div id="sec2">
Second section
</div>
</body>
</html>
Controller file (index.php)
<?php
$smarty = new Smarty;
$template = $smarty->fetch("index.tpl");
?>
In the example above, the $template variable would contain the full output from the template page. Below is a dump of its contents from the example.
$template => string(255)
"<html><body>
<div id="sec1">First section</div>
<div id="sec2">Second section</div>
</body></html>"
However, suppose I wish to read in the code from each of the DIV containers separately, and store them into separate variables, how could I achieve this? For instance, suppose I have a magical function called fetch_sub(). Here's my expectations of using it.
<?php
$smarty = new Smarty;
$div1 = $smarty->fetch_sub("index.tpl", "sec1");
$div2 = $smarty->fetch_sub("index.tpl", "sec2");
?>
Then $div1, etc would contain only the relevant sub-part, instead of the whole template.
Other info I am not a beginner with Smarty and have a fairly good handle on basic concepts, as well as some of Smarty's advanced concepts. Following is my attempts so far at conceptualizing the problem and getting to a solution. My initial rough idea is to demarcate the template into sections using {capture}, and then somehow reference each of these sections. I present an outline example of the idea below.
{capture name=sec1}
<div id="sec1">
First section
</div>
{/capture}
. . .
Smarty (as of Smarty 3.1) has no built-in feature to allow you achieving your goal. I had proposed something similar in 2011, but we haven't come around to implementing it.
Maybe you can have the generated HTML parsed to DOM and help yourself with xpath, or something like that?
You can try this:
sec1.tpl
<div id="sec1">First section</div>
sec2.tpl
<div id="sec2">Second section</div>
index.tpl
<html><body>
{include file="sec1.tpl"}
{include file="sec2.tpl"}
</body></html>
And then You can fetch parts by invoking:
$smarty = new Smarty;
$div1 = $smarty->fetch("sec1.tpl");
$div2 = $smarty->fetch("sec2.tpl");

CKeditor adds a backslash on adding a content in <span> tag that results no formatting

ckeditor is behaving strange to me as it adds a backslash to span tag when the content is added.
For example:
<span style=\"color:#006400;\"><span>this is a comment......Must be green, but it is white</span></span>
But it should be like this:
<span style="color:#008000;">this is a comment......Must be green, but it is white</span></span>
Why is this happening so?
This problem occurs LIVE not on local machine(localhost).
This is a problem related with your hosting service. For security reasons, they add a backslash before every quote and doublequote. To solve it you can use the stripslashes function in PHP:
stripslashes($_POST['comment'])

PhpStorm short tags indentation (if/endif)

Here is the indentation that PhpStorm will generate for this code:
<?php if (count($foo) > 0) : ?>
<div>...</div>
<?php else : ?>
<p>...</p>
<?php endif; ?>
Is that supposed to be the wanted PHP indentation when mixing if/for/... blocks with HTML or is it a bug with the short tags?
I am talking about PhpStorm default formatting style. I am wondering if this behavior is intended by PhpStorm or a bug.
The final answer is that is a bug, if you expect (as anyone would I guess) the content of the if to be indented.
I filed a bug: http://youtrack.jetbrains.com/issue/WI-11118.
#Marc B is actually spot on with why PHPStorm is doing it this way by default. There is no standard and therefore the PHPStorm authors just chose whatever they wanted by default and gave you settings where you can configure it do be however you want.
To answer your specific question though, it's not a bug, because there's no correct way for it to be. It's all personal preference.
Neither option (braces versus if : else : endif;) is particularly readable. If that's a priority for you, try using a templating engine instead, and encapsulate most (if not all) logic out of the template files.
Some templating engines I've used are Smarty and Twig, but there are a bunch out there.

Resources