2012年4月17日星期二

magento modify the size of product images

 Shopping website:fridge-magnet-online-shop

How to modify the size of the image displayed magento front Magento product image size is related to the code page css modification, so you better understand some css. Sometimes in css to specify the size of the image, you modified the code will not necessarily effect you want, check the css. And do not forget to refresh magento cache.
 
To my helloblank template, for example, note that you are using the template file path.
 
The first place product images, product list page
 
File Location: app \ design \ the frontend \ default \ helloblank \ template \ the catalog \ product \ list.phtml
 
Search in this document "resize", there are two, because the list of pages List and Grid both display a resize List list shows pictures, the second resize Grid list shows products pictures.
 

$ This-> helper ('catalog / image') -> init ($ _product, 'small_image') -> resize (135, 135);?> "Width =" 135 "height =" 135 "
Code analysis:
 
resize (135, 135), is to set the function of the product image size in pixels. width = "135" height = "135" is the css settings. For example, it is changed to 150 pixels wide and 200 pixels high. Then the code is changed to


$ This-> helper ('catalog / image') -> init ($ _product, 'small_image') -> resize (150, 200);?> "Width =" 150 "height =" 200 "
 
Second place, product details page Product Image
 
File Location: app \ design \ the frontend \ default \ helloblank \ template \ the catalog \ product \ view \ media.phtml
 
Search in this file "resize". We will find the two first place is the big picture of the product, and the second is the small map of the diagram below.
.... Resize (265) .... resize (48, 48);?> "Width =" 48 "height =" 48 "....
Code analysis:
 
When the resize which only one parameter, it is set the width and height are the same. resize (265) is equal to resize (265,256).
 
This page has a lot of css modification of code, be sure to use firebug and other tools to check, can be modified to how much
 
Third place, pictures of related products, upsell product images, crosssell Product Image
 
Related Products picture to modify the file location: app \ design \ frontend \ default \ helloblank \ template \ catalog \ product \ list \ related.phtml
 
upsell product images to modify file location: app \ design \ frontend \ default \ helloblank \ template \ catalog \ product \ list \ upsell.phtml
 
crosssell product images to modify file location: app \ design \ frontend \ default \ helloblank \ template \ checkout \ cart \ upsell.phtml
 
Set the function of the size of the chart or the resize () function, but also basic and said earlier, is the same.
 
Fourth place, the page sidebar shopping cart product images
 
File Location: app \ design \ the frontend \ default \ helloblank \ template \ checkout \ cart \ item \ default.phtml
 
Basic to these, there are other places to change, open the magento template path look, where the method of change. The most important thing is, with the css and your modified code.


 Wholesale fridge magnets from china on sales.

1 条评论:

  1. Websites with magento integration are ever increasing as the platform promises profits and customer satisfaction with it's efficient and effective mechanism.

    回复删除