Virtuemart Support :: Topic: Display of image subtitle and image alt text (1/1)

Welcome, Guest

TOPIC: Display of image subtitle and image alt text

Display of image subtitle and image alt text 10 years 8 months ago #6066

Francis van Essen	Is there a way to display the image subtitle and/or image alt text for the thumbnails and/or main image on the product details page? I have several thumbnails showing the same product, but with different colors. I would like to use the subtitle and/or alt text to mention the specific colors.
	Last Edit: 10 years 8 months ago by Francis van Essen. The topic has been locked.

Display of image subtitle and image alt text 10 years 8 months ago #6109

Support	Hi, I guess i understand what you are asking. Let me run some tests about it. Regards.
	The topic has been locked.

Display of image subtitle and image alt text 10 years 8 months ago #6110

Support

Hi,

I managed to achieve it.
Here is what you need to do (in order to add "Displayed image subtitle" to each thumbnail)

First make sure you put some subtitle to "each" additional picture through VM Backend > Shop > Media Files

Attachment Pasted_Image_8_22_13_2_33_PM.png not found

Then open this PHP file:
/templates/flexible_darkmart/html/com_virtuemart/productdetails/default.php

and find this line:

<li class="flexibleZoomAdditionalImagesEach">
<a href="<?php echo $this->product->images[$ImageId]->file_url;?>" class="flexible-zoom-gallery" rel="useZoom: 'zoom1', smallImage: '<?php echo JURI::root(); ?><?php echo $this->product->images[$ImageId]->file_url;?>'"><img src="<?php echo $this->product->images[$ImageId]->file_url_thumb;?>" class="zoom-tiny-image-additional"  />
</a>
		</li>

Change it with this:

<li class="flexibleZoomAdditionalImagesEach">
<a href="<?php echo $this->product->images[$ImageId]->file_url;?>" class="flexible-zoom-gallery" rel="useZoom: 'zoom1', smallImage: '<?php echo JURI::root(); ?><?php echo $this->product->images[$ImageId]->file_url;?>'"><img src="<?php echo $this->product->images[$ImageId]->file_url_thumb;?>" class="zoom-tiny-image-additional"  />
 <?php echo $this->product->images[$ImageId]->file_description ;?>
</a>
		</li>

Basically you are going to use this:

<?php echo $this->product->images[$ImageId]->file_description ;?>

to print the "Subtitle" for each media file.

The result will be:

Attachment ScreenShot2013-08-22at2.38.18PM.png not found

Alternatively you can change the

<?php echo $this->product->images[$ImageId]->file_description ;?>

Line with this:

<span style="display:block; text-align:center;margin-bottom:10px;"><?php echo $this->product->images[$ImageId]->file_description ;?></span>

To include some CSS rules for that Subtitle Text.

Regards.

Last Edit: 10 years 8 months ago by Support.

The topic has been locked.

Display of image subtitle and image alt text 10 years 8 months ago #6111

Support	One more thing. To print the "Image ALT-Text", the proper PHP line is this: <?php echo $this->product->images[$ImageId]->file_meta ;?>
	The topic has been locked.