background img url removed slashes from url

[sreeb]

Hi,

I have a very strange problem. I want to use a inline css background, so i made this code:

<?php foreach ($page->home_kennisbank as $block) 
		{
		echo "<div class='col-md-".$block->front_block_class."'>";
		echo "<a href='".$block->url."' style='background: url('".$block->front_block_img->url."') no-repeat bottom center; background-size: cover;'>";
		echo "<div class='vertical-middle dark center' style='position: absolute; top: 50%; width: 100%; padding-top: 0px; padding-bottom: 0px; margin-top: -34px;'>";	
		echo "<div class='heading-block nomargin noborder'>";
		echo "<h3 class='capitalize t500'>".$block->title."</h3>";
		echo "<span style='margin-top: 5px; font-size: 17px;'>".$block->front_block_subtitle."</span></div></div></a></div>";
		}
?>

For a strange reason the background url will be displayed like this: (chrome developers tool)

<a href="/daken/dak-lekkage/" style="background: url(" site="" assets="" files="" 1056="" 03-lekkage-dakkapel-02.jpg')="" no-repeat="" bottom="" center;="" background-size:="" cover;'="">

i looks like he didn't displayed the slashed. Another strange thing. When i look in the source it is displayed correct:

<a href='/daken/dak-lekkage/' style='background: url('/site/assets/files/1056/03-lekkage-dakkapel-02.jpg') no-repeat bottom center; background-size: cover;'>

Does anyone understand this why this is happening. The URL contains also "slashes". And this one is displayed correct. Why not the background image url??

Thanks in advance.

 

 

[szabesz]

Hi,

http://stackoverflow.com/questions/3446216/what-is-the-difference-between-single-quoted-and-double-quoted-strings-in-php

so this one, for example:

echo "<div class='col-md-".$block->front_block_class."'>";

should be:

echo "<div class=\"col-md-". $block->front_block_class . "\">";

or

echo '<div class="col-md-'. $block->front_block_class . '">';

So some of your variables are not interpreted, that is why the output looks like that.

Edited May 1, 2017 by szabesz
typo

[Robin S]

@szabesz, sreeb is concatenating not interpolating so either single or double quotes will work.

 

@sreeb, you are using single quotes around the background URL path inside the single quotes of the style attribute:

echo "<a href='".$block->url."' style='background: url('".$block->front_block_img->url."') no-repeat bottom center; background-size: cover;'>";

That effectively ends the style attribute prematurely.

Either use escaped quotes around the background URL path...

echo "<a href='".$block->url."' style='background: url(\"".$block->front_block_img->url."\") no-repeat bottom center; background-size: cover;'>";

...or just leave out the quotes around the background URL - you only need those if there is a space in the path and that will never happen for a PW Pageimage as files are renamed on upload.

echo "<a href='".$block->url."' style='background: url(".$block->front_block_img->url.") no-repeat bottom center; background-size: cover;'>";

 

[sreeb]

@Robin S Thanks a lot, this works for me. So i learned somthing on a mondayevening:) Thanks!!!