User Tools

Site Tools


prestashophelp:productpage

Product page

Tabs on the product page

Here you can see how to configure tabs on the product page in Prestashop
Path: Back-office > Catalog > Products, edit


Configuring the Product Comments

Thickbox image

When you click to the main image you see the thickbox image.

The default image size 363*600 px. If you want to make it bigger you need to do the following:

For example I want the size 600*992 px

Add to the end of file /themes/alysum_2.0/css/alysum.css

/* $customer modifications - Thickbox */
#pattern #fancybox-img { width: 600px; height: 992px; }
#pattern #fancybox-content { width: 600px !important; height: 992px !important; }
#pattern #fancybox-wrap { width: 620px !important; } 

JqZoom

When you hover the main product image near you see the zoomed copy. Nice feature for some shops.

Here you can enable it Back-office > Preferences > Products > Enable JqZoom instead of Thickbox on product page.

If JqZoom is blurry

By default JQZoom uses image type thickbox_alysum 310px*512px So if you have product image with high dimensions and want to see image with better quality in the JQZoom you need to increase the values 310px*512px for thickbox_alysum and “Regenerate the thumbnails” (Back-Office > Preferences > Images)


Modifications

Make Zoom bigger

If you want bigger zoom just add to the end of file /themes/alysum_2.0/css/alysum.css

/* $customer modifications*/
#pattern #view_full_size img.bigimg { width: 100% !important; } 

width: 100% - just increase this value or change to height: 100% (maybe height changing will be better for your case)

Make zoom from the right side of the zoomed picture

From Prestashop 1.6 zoom block shows on the same product picture place. If you want to show zoom from the right side of the zoomed picture (as it was in Prestashop 1.5) here is the fix: add this code to the BO>Theme Settings>Custom css

@media (min-width:980px) {
    #product .zoomWindow {right: 0;left: 364px !important}
    #product .zoomWrapper {width: 512px !important}
}
prestashophelp/productpage.txt · Last modified: 2014/11/21 01:20 (external edit)