Product page alignment

  • Resolved wordpressuser2020

    (@wordpressuser2020)


    4 years, 2 months ago

    Hello,

    I’m using WordPress 4. If I view my product page using the “Preview Changes” button while logged into the back-end it previews just fine with the product image to the left and the short description to the right and the description to the bottom. However, when I view the same page without using the Preview Changes button the short description now aligns underneath the product product image. Even if I remove the image and it only shows the place holder the short description text still appears beneath the place holder.

    What’s going on here?

    Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Support Damianne P (a11n)

    (@drwpcom)

    Hi @wordpressuser2020. It sounds like there is some CSS that is applied differently on the live or previewed page.

    Could you please share a link where I can see the issue and a screenshot of what you see when you Preview the page? I recommend a tool like https://snipboard.io/ for easily sharing screenshots.

    You may have already solved the issue. If there is no update on this thread within the next week, we will go ahead and resolve the thread. In that case, please feel free to start a new thread if you have additional questions.

    Thread Starter wordpressuser2020

    (@wordpressuser2020)

    Hi,

    Here is a link to the screenshot of how it looks when I preview it.
    https://snipboard.io/b50uO4.jpg

    Here is a link to the actual page.
    https://hairblueprint.com/product/donate/

    Thanks!

    Robert Ghetau

    (@robertghetau)

    Hi there,

    Thank you for sharing this with us!

    Because I’m not aware of how the original layout and CSS code should look, I’ve come up with this code to help structure the product page:

    .woocommerce.single-product .product {
    display: flex;
    flex-wrap: wrap;
}

.woocommerce.single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images {
    padding: 0 32px 0 0;
}

    Usually, if there are differences between the preview and the live version of a page, there might be some assets issues coming from the theme or even an optimization plugin.

    If the preview display is the right one, I encourage you to reach out to the Astra theme support and discuss further steps.

    I hope this helps!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Product page alignment’ is closed to new replies.