Path to image within PHP

[Peter Knight]

I have this crazy long php script and the 8th line down references an image.

I'm trying to call an image which is not associated with the page or any pages. It's just sitting on a folder.

If this wasn't called within PHP code, Im supposed to do something like this:

<img src="<?php echo $config->urls->site; ?>assets/images/IcoMoon/Icons/SVG/globe.svg" class="logo">

But that doesn't work and am wondering what best practice is in this scenario?

 <?php
 
 $updates = $pages->find("template=blog-post, blog_tags=Studio Watch, ");//Get blog posts tagged Studio Watch
 
 echo"<section id=\"cd-timeline\" class=\"cd-container\">";
 
 foreach ($updates as $update){
 $customdate= date("F Y", $update->getUnformatted("blog_date"));
 
 echo"
 <div class=\"cd-timeline-block\">
 
 <div class=\"cd-timeline-img\">
 <img src=\"/assets/images/IcoMoon/Icons/SVG/globe.svg\" alt=\"Picture\">
 </div>
 
 
 <div class=\"cd-timeline-content\">
 <p>{$update->title}</p>
 
 <div class=\"mini-tag\">";
 {
 // Tags for client location
 echo "<i class=\"fa fa-globe\"></i>";
 foreach ($update->client_location as $geo) 
 {echo "{$geo->title}";}
 } 
 
 echo"</div>";
 
 
 // Tags for general tags
 echo"<div class=\"mini-tag\">";
 {
 
 echo "<i class=\"fa fa-tags\"></i>";
 foreach ($update->blog_tags as $tags) 
 {echo "{$tags->title},";}
 echo"</div>"; 
 }
 
 echo"<span class=\"cd-date\">{$customdate}</span>
 </div>
 
 </div>";} 
 
 
 echo"</section>";
 ?>

[owzim]

<img src="<?php echo $config->urls->site; ?>assets/images/IcoMoon/Icons/SVG/globe.svg" class="logo">

This should work if the file is really there. Try to inspect the html output and check if the path is generated correctly. If so, copy the url into the address bar and check if the image is really loadable. Perhaps something with SVG having the wrong mime type from the apache?

Other than that I'd just create a new config setting:

$config->urls->icons = $config->urls->site . 'assets/images/IcoMoon/Icons/SVG/';

And include the icons like so:

<img src="<?php echo $config->urls->icons; ?>globe.svg" class="logo">

Your code is very unreadable, try to organize it better. Don't mix the output methodologies too much. EITHER you echo out php in your html OR you echo out HTML in you PHP, don't use both methods at the same time, or at least avoid it at all costs.

I would not want to be maintaining this, and neither should you

Just advice.

[adrian]

Because it is within a php echo statement already, this will work:

<img src="{$config->urls->site}assets/images/IcoMoon/Icons/SVG/globe.svg" class="logo">

To expand on owzim's comments, I try to avoid escaping double quotes. Use a mix of single/double quotes to make it cleaner.

So you could have:

echo '<img src="'.$config->urls->site.'assets/images/IcoMoon/Icons/SVG/globe.svg" class="logo">';

or:

echo "<img src='{$config->urls->site}assets/images/IcoMoon/Icons/SVG/globe.svg' class='logo'>";

[Soma]

The path is the same inside as outside of PHP. Fun time.

Good suggestions by the young entrepreneurs.

You can also use

echo "{$config->urls->assets}/images/IcoMoon/Icons/SVG/globe.svg";

I thought more it was about loading a file within PHP on server using path

$file = $config->paths->assets . "/images/..";

[Peter Knight]

Thanks guys. Appreciate the advice. Will try these tomorrow. #WorkingAtWeekend

[Peter Knight]

Your code is very unreadable, try to organize it better. Don't mix the output methodologies too much. EITHER you echo out php in your html OR you echo out HTML in you PHP, don't use both methods at the same time, or at least avoid it at all costs.

I would not want to be maintaining this, and neither should you

Just advice.

That's my general lack of PHP experience shining through.

Out of interest, what way would you improve this? It's as simple / manageble as possible but I'd be very keen to see another interpretation and see how I am over complicating this.

Before I started to integrate the field content into this, this is the default code

<section>
	<div class="cd-timeline-block">
		<div class="cd-timeline-img">
			<img src="img/cd-icon-picture.svg" alt="Picture">
		</div> <!-- cd-timeline-img -->
 
		<div class="cd-timeline-content">
			<h2>Title of section 1</h2>
			<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto, optio, dolorum provident rerum aut hic quasi placeat iure tempora laudantium ipsa ad debitis unde? Iste voluptatibus minus veritatis qui ut.</p>
			<a href="#0" class="cd-read-more">Read more</a>
			<span class="cd-date">Jan 14</span>
		</div> <!-- cd-timeline-content -->
	</div> <!-- cd-timeline-block -->
 
	<div class="cd-timeline-block">
		<!-- ... -->
	</div>
</section>

Here's the tutorial I've taken from

http://codyhouse.co/gem/vertical-timeline/