[Solved]header_right tel.gif image not displayed with localhost

[smr]

Hi,

My first post in prestashop forum!

Up to now, my site (version 1.5.4.1) is ok online but problem to test it for new features under localhost and Esayphp 13.1.

Everything is ok but one point: in upper right header, two images are not displayed because their url are not rewrited.

These are the two images in the header right div. This is html code for french version

<div id="header_right" class="grid_9 omega">				
 <img class="header_tel" src="/img/tel.gif">
 <img class="header_liv" src="/img/livraison.gif">
  ...
</div>

when I copy the link of the first image, I get 

http://localhost/img/tel.gif

where I would like to have

http://localhost/myshop/img/tel.gif

I looked in the htaccess files and noticed there is no url rewriting for /img/ directory 

I tried to add some test rules like

RewriteRule ^(.*)\.gif$ %{ENV:REWRITEBASE}img/tel.gif  [L]

or

RewriteRule ^/img/?([^/]+)\.(gif)$ %{ENV:REWRITEBASE}img/$1.$2 [L]

but it is not effective and some other tests are worst.

I'll be glad if somebody could help me with any idea or solution

Thanks

Edited January 5, 2014 by smr (see edit history)

[Sharak]

First of all revert any changes you made in .htaccess. Now remember this: never use in .tpl files something like this:

<img src="/img/tel.gif">

or in .css files something like this

background: url(/img/tel.gif)

If you want your shop to work properly in every circumstances you should use this in .tpl:

<img src="{$img_dir}tel.gif"> //this will load tel.gif from /themes/your_theme/img/ directory

and this in .css:

background: url(tel.gif) //this will load tel.gif from the same directory as .css file
background: url(img/tel.gif) //this will load tel.gif from /img folder that is in the same directory as .css file
background: url(../img/tel.gif) //this will load tel.gif from /img folder that is in a directory 1 level up from .css file

[smr]

Thanks for your reply.

I was just understanding the htaccess located in localhost/myshop directory can not intercept the call to localhost/img directory because to do so, my htaccess should be in locahost root directory.

So I agree with your recommandations, either use a background url in css or modify the .tpl file in my shop theme.

[Sharak]

Actually my recommendation was about the way of creating urls in presta files. Always use {$img_dir} in tpl files and in css files url should never start with /

[smr]

When I use {$img_dir}  the src link target is the img directory in my personal theme. But in this directory, there is only the tel.gif image not the "delivery" image. Sure I could load an image there but I found it is ok with this code (suppressing the leading / as you recommend) in themes/my_theme/header.tpl 

<img class="header_tel" src="img/tel.gif">
<img class="header_liv" src="img/livraison.gif">

then the link target is the root img directory where two images I want are present!

Thanks again for your help

[Sharak]

It may work well on current conditions, but if you try to enable friendly urls or smarty cache or use subdomain for your shop, your problems will return. Thus I really recommend to follow my advice

[smr]

OK, I'll follow your advice with subdomains. For the moment, I use friendly url and smarty cache on both localhost and online. I think there is no problem with local server because they were activated before I modify header.tpl.

[smr]

Need help again for block html code!

Sharak gave the solution how to use smarty variables in themes template file (*.tpl) but how to use these variables in a module html block code.

I'm using freeblock module where in admin panel we can write html code for a div that can be displayed in left column.

The .tpl code is so:

<div class="block_content">
   {$freeblock_content}
</div>

This $freeblock content is generated by the module configure page. I can't modify this .tpl file if I stille want to use admin configure.

 

So, raise a general question (with no answer on Google searches): how to insert smarty variable like {$img_dir} in "normal" html code or between php tags I could insert?

I wish to code the href of a link and the src of an img tag like <img src="{$img_ps_dir}img/Paiement-secu.jpg" />

Thanks in advance

Edited January 4, 2014 by smr (see edit history)

[Sharak]

I'm not sure, cause I haven't used html block for a long time, but this module should handle smarty variables. You just need to use it right. Try this:

<img src="{$img_ps_dir}Paiement-secu.jpg" />

{$img_ps_dir} means http://your_shop_url/img/ so you don't have to add another img/, unless this image is located in /img/img/ directory.

 

If that doesn't work you can always change module's .tpl like this:

<div class="block_content">
   {$freeblock_content}
   <img src="{$img_ps_dir}Paiement-secu.jpg" />
</div>

Edited January 4, 2014 by Sharak (see edit history)

[vekia]

modules like html block, free block, contentbox etc. you can't use smarty variables, only pure html, css, js etc. - languages interpreted on "browser" side. 

[smr]

Your .tpl modification is fine, but need some corrections

I tried your src syntax but smarty variables are not decoded in raw html block. The result in front page is this:

<div class="block_content">
 <a href="{$base_dir}content/5-paiement-securise"><img src="{$img_ps_dir}Paiement-secu.jpg" /></a>
</div>

So I modified the .tpl this way:

<!-- Free Block module -->
<div id="freeblock_left" class="block">
 <h4>
   {$title}
 </h4>
 <div class="block_content">
  {str_replace(array('{$img_ps_dir}','{$base_dir}'),array({$img_ps_dir},{$base_dir}),$freeblock_content)} 
 </div>
</div>
<!-- /Free block module -->

and it is ok!

I wonder now if I could escape the quote around  smarty variables in html code, so avoiding to replace strings by variable in .tpl?

many thanks again.

[smr]

I forgot to say I found a htaccess rewrite url online tester here:

 

http://htaccess.madewithlove.be/