Blurred Images

-- url of the page with the problem -- : optimizedpanama.com/starsupply/
-- HikaShop version -- :2.2.2
-- Joomla version -- :3.2.1
-- PHP version -- : 5.4
-- Browser(s) name and version -- : all
-- Error-message(debug-mod must be tuned on) -- : Error_message

Why are the images blurred on the module display on the home page?

Thanks,

Mike

Hi,
You' issue is coming from the CSS code of your "templates/newlifestyle/css/themes/redbrown/template.css" CSS file :

.hikashop_products .hikashop_product_image img {
max-width: 100%;
background: #fff !important;
margin: 0 0 0 0px;
width: 100%;
border: 8px solid #E8E4D8;
-webkit-transition: border 200ms ease-out;
-moz-transition: border 200ms ease-out;
-o-transition: border 200ms ease-out;
}

Hello Mohamed ,

Thank you for you reply. I had tried the different Hikashop->System->Configuration image options and have the correct sizes but cannot stop the blurring.

I am not a css expert so I chose this template because it is recommended to work with Hikashop out of the box.

Could you tell me the issue with the css code and I will amend it.

Thanks,

Mike

Hello Jerome,

Thanks for the very rapid response.

Do you mean change the "Hikashop->System->Configuration->Main", aor the "Image width/height" options of your hikashop product listing content menu?

I tried adjusting both but the images are still blurred as you can see.

Also how do I get the price, description and add to cart to appear with the thumbnail - I can see these items when I set Thumbnail to 'No' but they disappear when the Thumbnail is set to Ýes'?

Thanks,

Mike

Hi,

After changing the settings in the configuration > Main, you have to delete the thumbnails so after that they will be re-generated.
The images are hiding the other informations probably because they are too large.
You should reduce the size of the image in the hikashop listing menu options.

Or that's maybe the previous css properties which are causing that issue.
When editing css properties or changing images, you will maybe have to press Ctrl + F5 to reset the page design.

Hi Xavier,

Thanks for clarifying the steps:

I have now set the thumb size to 100 x100 in bother the config/options and the module display. The height in module display is 300.

For the first product, I then deleted the image and uploaded it again but with the same result

I then tried again withe the fourth product but did not add an image as I wanted to see the effect with the default image - in this case Add to cart is visible but not the description and price.

We are slowly getting there but there still is a problem in the configuration that is stopping the module from working correctly.

Regards,

Mike

I have tried setting the images to 200 x 200 before with the same effect.

I selected this template to work with HikaShop as this template/Hikashop combination has been recommended by both companies and I hoped that it would work out of the box.

I have not attempted anything dramatic here so was not expecting any issues of the kind with a basic install.

It would be helpful I you could quickly log into my admin and see what the problem is to stop all this going back and forth.

I have two more projects for the customer but I cannot start them until I have this basic issue resolved.

Regards,

Mike

Hello Nicolas,

The settings are now 200 x 200 but even the product with the default image does not show the title and price.

I am sure that Hikashop will work out of the box with this template unless you would have bot recommended it.

There is something simple missing here as we have been working on this issue for a week without resolution.

Regards,

Mike

I am editing Display / Content Module / HikaShop Content Module / Parameters for DIV

Where should the settings go?

Thanks

Mike

Hi,

I think that you have to change the settings in Configuration > Main > Images.

Configuration > Main > Images. are now also set to 200 x 200 but the default product image is still overwriting the title and the price.

What else could be causing this issue with a template that is designed to work with Hikashop?

Thanks,

Mike

Correct me if I'm wrong but the images are still 100*100px.
Did you changed the Thumbnail width and Thumbnail height?

Hi Eliot,

I attach 2 screenshots both showing 200 x 220

I just need to find out how to adjust the appropriate config that is making you see 100 x 100

Regards,

Mike

Are you sure you are editing the right module/menu?
Also, do you have a caching system enabled on your site? If yes, you should try to disable it.
Could you also check that you have the right thumbnails in media/com_hikashop/upload (there should be a 200x200 folder)

Hello Eliot,

Sorry that I have taken so long to get back to you.

I only have one module published - and I edit via Display / Content modules - is this correct?

Caching is disabled

I attach a screen shot of the file manager folder with the 200 x 200 images

I am sure that you can see the 100 x 100 set up somewhere but I just cannot.

I can send you my login details for you to have a quick look so that we can move on and set up the project - please let me know how to send them to you.

Thanks,

Mike

Hi,

We can see that 100x100 thumbnails are used in frontend thanks to the browser console.
Editing via Display / Content modules is indeed correct.

Thanks to update your version with the newest one, the 2.3.0, if the issue is still not fixed, thanks to give us the login details via private message with the link of this topic.