Full width Product Image . Rest Bellow

  • Resolved shaki

    (@shaki)


    8 years, 10 months ago

    Hello all.

    Need to put product single page image in full width, and then all the rest (price, options, add to cart) bellow it.

    Been messing with product image sizes (now at 1500x750px), with CSS and all files but no avail.

    I can’t make single product page image full width and put all thr rest bellow.

    This is a custom theme bootstrap based. It just divides content and places image into a col md 6, and then places price, add to cart, etc into another col-md-6.

    What am I missing ? 🙁 what do I need to edit?

    • This topic was modified 8 years, 10 months ago by shaki.
Viewing 3 replies - 1 through 3 (of 3 total)
  • Peter Lawrenson

    (@lorro)

    8 years, 10 months ago

    Probably the best way to go would be to make a custom single product template with the image in a full width column, so not in a md 6.

    Make a child theme:
    https://codex.wordpress.org/Child_Themes

    Then copy
    wp-content/themes/your-theme-name/woocommerce/content-single-product.php
    to
    wp-content/theme/your-child-theme-name/woocommerce/content-single-product.php
    and alter the div classes in the copy.

    Thread Starter shaki

    (@shaki)

    8 years, 10 months ago

    Thank you so much Lorro 🙂 That was exactly it:

    woocommerce folder (inside theme folder) > file “content-single-product.php

    There were 2 col 6 in there, i just edited it out and placed col 12 and it’s all good.

    Cheers, much appreciated.

    • This reply was modified 8 years, 10 months ago by shaki.
    Peter Lawrenson

    (@lorro)

    8 years, 10 months ago

    If you edited a file inside the theme folder you will lose your edits when you update the theme. You’ll need to make a child theme for the edited template to be update-safe.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Full width Product Image . Rest Bellow’ is closed to new replies.