{"id":30416,"date":"2015-01-27T03:18:56","date_gmt":"2015-01-27T08:18:56","guid":{"rendered":"http:\/\/www.templatemonster.com\/help\/?p=30416"},"modified":"2017-08-24T06:12:42","modified_gmt":"2017-08-24T10:12:42","slug":"magento-how-to-change-products-images-dimensions","status":"publish","type":"post","link":"https:\/\/www.templatemonster.com\/help\/magento-how-to-change-products-images-dimensions.html","title":{"rendered":"Magento. How to change products images dimensions"},"content":{"rendered":"

<\/p>\r\n

This tutorial will show you how to change dimensions of products images on Products Pages, Category Pages and for New Products section on home page in Magento.<\/p>\r\n

Magento. How to change products images dimensions<\/a><\/p>\r\n

    \r\n
  1. \r\n

    Open the root directory where you’ve installed magento site and navigate to: app\\design\\frontend\\default\\your_theme_number\\template\\ecommerceteam\\cloud-zoom\\catalog\\product\\view<\/strong> folder.<\/p>\r\n<\/li>\r\n

  2. \r\n

    Open media.phtml<\/strong> file using a text editor.<\/p>\r\n<\/li>\r\n

  3. \r\n

    In order to change the images size on Product Pages, you need to change $bigImageX = 308;<\/strong> $bigImageY = 308;<\/strong>
    \r\nvalues:<\/p>\r\n

    \"magento_img_size1\"<\/a>\r\n<\/li>\r\n

  4. \r\n

    To modify images size on Category Pages, navigate to app\\design\\frontend\\default\\your_theme_number\\template\\catalog\\product<\/strong> folder.<\/p>\r\n<\/li>\r\n

  5. \r\n

    Open list.phtml<\/strong> file. Search for “resize” text:<\/p>\r\n

    \"magento_img_size2\"<\/a><\/p>\r\n<\/li>\r\n

  6. \r\n

    You need to change:<\/p>\r\n

    resize (210);<\/pre>\r\n
    and<\/p>\r\n
    width=\"210\" height=\"210\" values.<\/pre>\r\n
    We’ve changed the size for a “List Mode”.<\/p>\r\n<\/li>\r\n
  7. \r\n
    Search for the next “resize” text to alter images size for a Grid layout.<\/p>\r\n
    \"magento_img_size3\"<\/a>\r\n<\/li>\r\n
  8. \r\n
    You need to change:<\/p>\r\n
    resize (228);<\/pre>\r\n
    and<\/p>\r\n
    width=\"228\" height=\"228\" values.<\/pre>\r\n
    We’ve changed the size for a “Grid Mode”.<\/p>\r\n<\/li>\r\n
  9. \r\n
    Finally, open new.phtml<\/strong> file to change the New Products images size:<\/p>\r\n
    \"magento_img_size4\"<\/a>\r\n<\/li>\r\n
  10. \r\n
    You need to change:<\/p>\r\n
    resize (270);<\/pre>\r\n
    and<\/p>\r\n
    width=\"270\" height=\"270\" values.<\/pre>\r\n
    We’ve changed the size for the “New Products” section on Home page.<\/p>\r\n<\/li>\r\n<\/ol>\r\n
    Re-load your site to see the changes. Note: you may need to clean browser cookies and cache and also clear Magento cache<\/a>.<\/p>\r\n
    \r\n\r\n\r\n<\/a>\r\n<\/div>\r\n
    Feel free to check the detailed video tutorial below:<\/p>\r\n
    Magento. How to change products images dimensions<\/a><\/p>\r\n
    <\/p>","protected":false},"excerpt":{"rendered":"
    This tutorial will show you how to change dimensions of products images on Products Pages, Category Pages and for New Products section on home page in Magento.<\/p>\n","protected":false},"author":12,"featured_media":43329,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[729],"tags":[1183,1267,494,2407,1305],"_links":{"self":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/30416"}],"collection":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/users\/12"}],"replies":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/comments?post=30416"}],"version-history":[{"count":2,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/30416\/revisions"}],"predecessor-version":[{"id":83025,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/posts\/30416\/revisions\/83025"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media\/43329"}],"wp:attachment":[{"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/media?parent=30416"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/categories?post=30416"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.templatemonster.com\/help\/wp-json\/wp\/v2\/tags?post=30416"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}