Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • November 27, 2013 at 9:27 pm #194078
    djnicke

    I am trying to adjust the Individual Product Page.

    I want to get rid of the left-column and instead have the product description and its images display all in one single column.

    If possible, I would like the images to appear above the product description / reviews – as a simple slideshow

    How can I edit the single product page to remove the left widget or column?
    How can I then change the images to display above the Description / Reviews tabs?

    As an example, I have manually created a slideshow for this product, but I cannot get rid of the image on the left column without removing the featured image.

    November 28, 2013 at 4:20 pm #194378
    Yigit

    Hey rednovaMeUp!

    You should go to wp-content\plugins\woocommerce\templates folder to modify WooCommerce templates. Can you post a screenshot and show us changes you would like to make?

    Best regards,
    Yigit

    November 28, 2013 at 5:47 pm #194444
    djnicke

    Hello Yigit,
    I don’t fully understand the hooks and structure of the PHP and CSS files of the WooCommerce templates.

    However, these are the changes I would like to make. On the page I’ve included, I just created an Enfold Simple Slideshow in the “Short Description” area of this particular product.
    Single Product Page

    If it’s possible to have my “Featured Image” and “Product Image Gallery” images automatically incorporated into a slideshow, that would be the best option. But at a minimum, I would like the left column removed and then I can manually create the slideshow for each product.

    November 29, 2013 at 4:52 am #194595
    Yigit

    Hi!

    Can you also post the link to your website?

    Cheers!
    Yigit

    November 29, 2013 at 9:12 am #194623
    djnicke

    http://rednovamedia.com/arabella

    Let me know if you also need an administrator account.

    November 29, 2013 at 9:54 am #194636
    Ismael

    Hey!

    You can add this on your custom.css or Quick CSS:

    .single-product .four.units.single-product-main-image.alpha {
display: none;
}

.single-product .eight.units.single-product-summary {
width: 100%;
}

    You can manually add the featured image on the slider if you want.

    Cheers!
    Ismael

    November 29, 2013 at 11:20 am #194681
    djnicke

    Thank you! That works perfectly!

    Will that affect any other areas of the website though?

    November 29, 2013 at 12:29 pm #194709
    djnicke

    Just for anyone else with this change:

    I also had to remove the 50px margin-left on this div. So the code ended up being:

    .single-product .eight.units.single-product-summary {
width: 100%;
margin-left: 0px;
}
  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Product Page Images’ is closed to new replies.