Resolved VirtueMart Main Product Images not Showing

Hello Julian,
Can you check the path for Product Media URL set in your VirtueMart configuration page and on templates tab? I am guessing the path should be wrong there so you are seeing the error icon.

On a related matter, the Long Description field has soft returns (line breaks) but when imported they appear as one long line with no breaks. Is there something I need to do during the import so those line breaks show?

For line breaks HTML needs <br /> tags and not \r or \n and that should be the reason why you don't see the line breaks.

Hello Julian,
It is the thumbnail image showing as error icon i guess. Do you see the images on backend on VirtueMart products page? Can you post the debug log of the import to check? To know on how to get debug log check Where to get debug information? section on top of this page.

Hi Tharuna, thanks for your reply.

I've attached a screenshot of the product's backend view. The thumbnail shows the thumbnail OK but only shows the error icon in the Product Information section same as front end.

Debug also attached which for security I've masked the domain and subdomain references with 'xxx'. I'm happy to send this directly offline.

While testing I'm only using a CSV with three products and as the site is in development it's currently hosted as a subdomain of an existing host account.

Thanks,
Julian.

Hello Julian,
As per your debug log thumbnail image and the main image are imported correct but the image is not shown on backend too. You can see the error icon in the screenshot you have sent. Can you check if the imported images are in images/stories/virtuemart/product/resized/ folder?

Hi Tharuna,

Yes the three images for the three test products are successfully showing in the folder images/stories/virtuemart/product/resized/

Using http://toner.isystems.co.nz/sound-cards/asus-xonar-dx-7-1-channel-pcie-audio-card-detail.html, I've pasted the source code that should be showing the main image below.

===
<div class="main-image">
<a title="no image found 9718-13131411.jpg" rel="vm-additional-images" href="http://toner.isystems.co.nz/images/stories/virtuemart/product/9718-13131411.jpg"><img src="/components/com_virtuemart/assets/images/vmgeneral/warning.png" alt="no image found 9718-13131411.jpg"></a><span class="vm-img-desc">9718-13131411.jpg</span> <div class="clear"></div>
===

The URL in the href tag (http://toner.isystems.co.nz/images/stories/virtuemart/product/9718-13131411.jpg) is live and can be viewed in another browser tab however the img src tag shows shows the warning icon as at /components/com_virtuemart/assets/images/vmgeneral/warning.png

The thumbnail images are saved and viewable in the folder images/stories/virtuemart/product/resized/ around 17kB each. The main product images are saved and viewable in the folder images/virtuemart/product/ which average around 65kB.

As I am able to manually add images which will show the main image correctly I don't think it's a template or VirtueMart configuration issue. I have tried importing the same products using a built in Joomla template but also does not work. I haven't made any custom config changes in VirtueMart yet as I want to get products loaded so I can see how they look before making config changes.

Could there be a setting in the CSVI import template or field mapper I've missed?

I've attached a screenshot of the field map my import template uses. Can you confirm the external Image URL field should be mapping to file_url? I've double checked the Image tab in the import template (screenshot at start of thread) and is set to process images, save images on server, resize large image (800 x 600) and create thumbnail (200 x 200).

Regards,
Julian.

Hello Julian,

Can you confirm the external Image URL field should be mapping to file_url?

Thats correct, external image URL field should be mapped to file_url field.

Your template mapping looks good. Can you check the permission on the images? if they are good then, Can you send me your import file and template XML to check? To get template XML file go to CSVI maintenance page, Select CSVI Pro on first option and Backup template on second option. Select your template and click continue. Download the XML file and post it.

Hi Tharuna,

I can confirm the permissions are correct. In the backend opening a product to edit at the bottom of the Images tab, /tmp/, /images/virtuemart/product/ and /images/virtuemart/product/resized/ are all marked as Writeable (via a file manager they are 0644).

I've attached the import template XML file and the CSV file I'm using to test.

On a related matter, the Long Description field has soft returns (line breaks) but when imported they appear as one long line with no breaks. Is there something I need to do during the import so those line breaks show?

Many thanks,
Julian.

Hi Tharuna,

I think you've found the problem! In VirtueMart the default Product Media URL is images/virtuemart/product/ but in the CSVI template the "Location product files" URL (Images tab) says to default to images/stories/virtuemart/product/ which it was set as.

I changed the URL in the CSVI template to images/virtuemart/product/, deleted existing products and media, ran the test again and worked first time. Thank you!

I'll have a play with the CSVI rules to convert the line breaks to <br />.

Regards,
Julian.

Hello Julian,
Yes, the image path was not matching with the one set for import so you were not able to see the image. The default product image URL for VirtueMart products is images/stories/virtuemart/product/ and that is what CSVI uses in its template. If you have your custom path for product images then you need to set it in CSVI Location product files field too.

Glad to know your issue is fixed now.