Color Attribute Image NOT showing on Layered Navigation Block

[Vank]

Hi, I have a color attribute (multicolor) set up. It is working fine, shows on the Back Office, and on the products, but the little icon corresponding to the image I uploaded (as a texture) is not showing on the layered navigation block. 

 

Searching I realized the URL to this tiny image is wrongly generated. 

 

In the blocklayered.tpl I found this line: 

 

<input class="color-option {if isset($value.checked) && $value.checked}on{/if} {if !$value.nbr}disable{/if}" type="button" name="layered_{$filter.type_lite}_{$id_value}" rel="{$id_value}_{$filter.id_key}" id="layered_id_attribute_group_{$id_value}" {if !$value.nbr}disabled="disabled"{/if} style="background: {if isset($value.color)}{if file_exists($smarty.const._PS_ROOT_DIR_|cat:"/img/co/$id_value.jpg")}url(img/co/{$id_value}.jpg){else}{$value.color}{/if}{else}#CCC{/if};" />

Above is how it is on the Layered Navigation, error image. 

 

 

that takes me to this URL: 

 http://xxxxxxxx/vankirsch/en/img/co/48.jpg

  - Where EN is my language selection of course. The actual URL should be: 

http://xxxxxxxx/vankirsch/img/co/48.jpg

  -> then works fine. 

On the product-list-colors.tpl, I found this line that generates the URL to the tiny image correctly on the product lists, featured products, etc.. 

<img src="{$img_col_dir}{$color.id_attribute|intval}.jpg" alt="{$color.name|escape:'html':'UTF-8'}" title="{$color.name|escape:'html':'UTF-8'}" width="20" height="20" />

Above, the multicolor image looks perfect. 
 

How can I change the first code to actually generate the right URL for the image on my Color Attribute?

Thank you!

 

Settings:
Prestashop 1.6.0.14 - default-bootstrap version 1.0 (heavily modified, but these 2 files mentioned above are untouched)

Working on Localhost environment, sorry no url to show the live site.

Edited April 22, 2015 by Vank (see edit history)

[joaoteq]

Hi!

 

Have you ever solved your problem? I have the exact same problem too...

 

Thanks

[Vank]

nope, after several years trying to optimize the shop to my needs, I decided to discard Prestashop.. it is a shame because I liked it.. but well.. I'll take a look at the newer versions to see how they're doing.. and if you're right now asking about this issue, my guess is that they have not yet fixed small basic things as this one.. 

[joaoteq]

It's a shame really. My site is basically done. The one thing that was missing was getting it to work with friendly url, and I got that working. And then this...

Well... I leave here a shout out to see if someone has solved this problem. Maybe start a new thread will work?

[joaoteq]

Hey!

 

I've worked around the problem. I know it's a stupid solution, but in an urgency it allowed me to get my site online.

 

The friendly url link to the texture (jpg with the color/texture for the attribute) links to www.site.com/langcode/img/co/xx.jpg. It should link to www.site.com/img/co/xx.jpg. I've tried with the help of what you found out in the layered block to change the url, to no avail. So, as we say in my country: If Mohamed doesn't go to the mountain, the mountain goes to mohamed!

I've copied all the jpegs from the "co" folder to a newly created folder in: root/langcode/img/co. I'm perfectaly aware this isn't really a solution, and that if I add a new color attribute, I have to copy it to the new folder. But for now, it allowed me to get my site online.

 

Still looking for a real solution though.

[Vank]

hehe in my country we also have that saying. I also thought about changing the folder, but then I thought about updates... good luck finding that solution! I had months without coming to PS site, the newest update looks good, and I just found out they rolled as a native module the European e-commerce regulations (finally!) so I'll give it a second try, don't want to lose all the work I had on the template I was working so carefully and for so long (re-shaped almost completely a free template that I almost feel like if it is my own template haha).. 

 

thanks for "waking up" again my interest on PS.. and good luck with your shop!

 

V

[joaoteq]

Bad news...

The "solution" is crap... The index for the language points to www.site.com/langcode/ so if there's a folder with the langcode name, the home page obviously gets broken. So not solved yet... Its frustrating because we know that when someone with true knowledge of the ps will solve this quickly...

 

I'll keep trying... And I've changed default bootstrap so much also...

[rodgrolop]

I don´t know if anybody is still interested in this issue, but after a long day of research i´ve been able to solve this huge problem.

Here is the solution that has worked for me:

in your theme blocklayered.tpl file, in modules folder, look for this line:

{if isset($value.color)}{if file_exists($smarty.const._PS_ROOT_DIR_|cat:"/img/co/$id_value.jpg")}url(img/co/{$id_value}.jpg){else}{$value.color}{/if}{else}#CCC{/if}

and replace it with:

{if isset($value.color)}{if file_exists($col_img_dir|cat:$id_value|cat:'.jpg')}url({$img_col_dir}{$id_value}.jpg){else}{$value.color}{/if}{else}#CCC{/if}

[LauraPresta]

it didnt worked for me :/

[rocky]

I can confirm the best answer above fixes the issue, though you'll only see the upper-left of the texture. You can add background-size:100% if you want to resize the texture to fit inside the box. For example:

{if isset($value.color)}{if file_exists($col_img_dir|cat:$id_value|cat:'.jpg')}url({$img_col_dir}{$id_value}.jpg){else}{$value.color}{/if}{else}#CCC{/if};background-size:100%

[LauraPresta]

i see.. i checked again the problem today and mine is maybe different because i have color #CCC, and i tested the answer here :

 

{if isset($value.color)}{if file_exists($col_img_dir|cat:$id_value|cat:'.jpg')}url({$img_col_dir}{$id_value}.jpg){else}{$value.color}{/if}{else}#CCC{/if}

 

That means that my problem come from {if isset($value.color)} but i still cant figure it out, for exemple here : https://www.jeveuxmescheveux.fr/fr/34-perruque-hairpower (the roblem was already here when layeredblock was on left column)

[hakeryk2]

Well, the solution is not working for me either and I think that LauraPresta is right that the problem is if statement.

 

I checked {$value.color|@print_r} and it is always showing 1 which is correct but the rest of the script is not finding the images. 

Edit: Fck Yeah, I found the solution. The problem was {if isset($value.color)} because it was almost always not set when there was a texture image.

Just change it to {if isset($value)} and everything works now again. 

Edited March 3, 2017 by hakeryk2 (see edit history)

[ofal]

I don´t know if anybody is still interested in this issue, but after a long day of research i´ve been able to solve this huge problem.

Here is the solution that has worked for me:

in your theme blocklayered.tpl file, in modules folder, look for this line:

{if isset($value.color)}{if file_exists($smarty.const._PS_ROOT_DIR_|cat:"/img/co/$id_value.jpg")}url(img/co/{$id_value}.jpg){else}{$value.color}{/if}{else}#CCC{/if}

and replace it with:

{if isset($value.color)}{if file_exists($col_img_dir|cat:$id_value|cat:'.jpg')}url({$img_col_dir}{$id_value}.jpg){else}{$value.color}{/if}{else}#CCC{/if}

Indeed, it is the best answer!

The colors appear just as I have set (texture, multicolor, silver, gold, snake...)

Thank you!

[rodgrolop]

You´re welcome everybody. It´s funny how i´ve broken everything after an update of the site where this was implemented and now can´t figure how to set it. It seem routes have changed in updates or something like that, I´m working right now in solving this, I´ll come back with solution for people that lost this solution with upgrades.

 

Edit: Fck Yeah, I found the solution. The problem was {if isset($value.color)} because it was almost always not set when there was a texture image.

Just change it to {if isset($value)} and everything works now again. 

I´ve tried this too because seemed like a good aproach having the issue while checking if there is such attribute but had no luck. I´ll keep you all updated.

[rodgrolop]

Cool, everything working again, I must say that hakeryk2 was correct, my issue was that I was changing codes in wrong place.

I dont know if it is something that Prestashop does or the tempate itself, but I had a copy of blocklayered.tppl in my template files and is there where hakeryk2 solution has worked.

[hakeryk2]

Well, I was wondering how the other solutions was working but finally I am glad that my solution helped not only me Happy prestashoping @rodgrolop

[fgl]

Regarding first issue ticket of @Vank  which bothered lang path (as later subject went to a different problem), the solution seems to be missing "/" in the part url(img/co/{$id_value}.jpg).

So piece of code from blocklayered.tpl (theme/modules/blocklayered):

{if file_exists($smarty.const._PS_ROOT_DIR_|cat:"/img/co/$id_value.jpg")}url(img/co/{$id_value}.jpg){else}{$value.color}

change to:

{if file_exists($smarty.const._PS_ROOT_DIR_|cat:"/img/co/$id_value.jpg")}url(/img/co/{$id_value}.jpg){else}{$value.color}

works on 1.6.1.17-23, custom theme.