change product images display/ aspect ratio

Home Forums Gillion Theme change product images display/ aspect ratio

Home Forums Gillion Theme change product images display/ aspect ratio

This topic contains 12 replies, has 2 voices, and was last updated by  Shufflehound Support 1 week, 4 days ago.

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    RESOLVED Posts
  • Hi. The aspect ratio of my product images is 3:4. I’d like to display the entire image in this ratio in my product catalogue/ shop page/ front page. Images are now cropped 1:1. See screenshot (1)

     

    Images are displayed without cropping (correct) in the individual product page. However, the “Sale” badge is not fully displayed here, and is cut off. See screenshot (2). How can I display the badge like in the product catalogue?

    Attachments:
    You must be logged in to view attached files.

    Hi @sensado,

     

    I hope you are well today and thank you for your question.

     

    Could you please share the page URLs from your site where it is displaying so that I can help you to achieve it?

     

    Best regards,
    Shufflehound team

    sure

     

    individual product page

    https://www.sensado.com.au/product/himalayan-breeze/

     

    products displayed on home page

    https://www.sensado.com.au/

    Your shared pages are not accessible for me and just displays the message “SITE UPDATE IN PROGRESS”.

     

    Would you mind if I log in to your site and access it? If this is ok then could you please temporary share me your site admin login details privately by adding them in the box having text “Enter your private content here (only you and forum moderators will be able see it)”?

     

    Also, please tell me exactly how you want to display the images on your shared pages.

    Sensado
    Participant

    sure, thanks for your reply.

     

    yes, my site is currently in coming soon mode. please use the log in details below.

     

    Image display:

     

    • Aspect ratio 3:4 (as in uncropped original picture)
    • Badge (“Sale”) to be displayed in full on individual products as in product catalogue pictures.

     

    Also, I noticed that the second picture of an individual product is pixelated/ blurry although the image size is sufficient. See screenshots attached

    Attachments:
    You must be logged in to view attached files.

    Please update the theme on your site to the below latest version as described here https://support.shufflehound.com/updating-theme/

     


    Please login to access this file

     

    Also, please try regenerating thumbnails on your site using the below plugin.

     

    https://wordpress.org/plugins/force-regenerate-thumbnails/

    Hi there.

     

    Did all of the above.

     

    No improvement. see screenshot. 2nd product image still blurry. badge cut off. no 3:4 ratio in product catalogue.

     

     

    Attachments:
    You must be logged in to view attached files.

    update: could solve the 2nd image to be shown correctly by setting main image width in frontend customiser.

     

    other issues still persistent

    I regenerated the thumbnails and used below custom CSS code to make it work.

     

    .gillion-woocommerce div.product-tag-container {
        top: 10px;
    }

     

    Could you please check it now?

    thank you.

     

    individual product page:

    • badge is displayed fully now
    • however, the badge doesn’t look like the one displayed on products in the catalogue, i.e. off-set/slightly above product image with shadow
    • can you please adjust if possible

    product images in product catalogue:

    • aspect ration still not 3:4 (full image display, like on individual product page)
    • please adjust if possible

    Thank you so much

    Solution for this topic

    badge is displayed fully now

    however, the badge doesn’t look like the one displayed on products in the catalogue, i.e. off-set/slightly above product image with shadow

    I did it on your site using below CSS code.

     

    .single-product .content-container.sh-page-layout-full {
        padding-top: 25px;
    }

     

    can you please adjust if possible

    product images in product catalogue:

    aspect ration still not 3:4 (full image display, like on individual product page)

    To achieve this, you have to develop custom code in the child theme of Gillion theme.

     

    Developing custom code for custom functionality is beyond the scope of support that we provide here. Please see https://themeforest.net/item/gillion-multiconcept-blogmagazine-theme/19470306/support

     

    If you are not a developer then you can consider hiring a developer to develop it for you. You can hire a developer from any freelance site. Shufflehound recommends the developer https://www.upwork.com/freelancers/~011652ffec8865c6d5

    thank you. the badge is displayed correctly now. cheers.

    You are most welcome here 🙂

Viewing 13 posts - 1 through 13 (of 13 total)