Topic: I want to change the position of the product review.

zadoome
July 13, 2023 at 9:04 am

Hello, I’m using the ‘niche’ template.
In this template, the ‘product review’ tab is activated next to the description on the product page.
Currently, I have made the description area invisible in the layout settings.
I like this design.
I want to change this location.
I’d like to display the product reviews at full width above the “Related products” section. Is there a way to do this?

site

Ying

July 13, 2023 at 10:12 am

Hi there,

Can you try this?

1. Change this CSS from customizer > additional CSS:

.woocommerce div.product div.summary {
    grid-column: 2;
    grid-row: 1;
    margin-left: 80px;
    position: -webkit-sticky;
    position: sticky;
    top: 105px;
    bottom: 100px;
    padding-right: 80px;
}

to:

.woocommerce div.product div.summary {
        grid-column: 2/2;
        grid-row: 1/1;
        margin-left: 80px;
        position: -webkit-sticky;
        position: sticky;
        top: 105px;
        bottom: 80px;
        padding-right: 80px;
        margin-bottom: 200px;
}

2. Change this CSS:

.woocommerce-tabs {
    grid-column: 1;
}

to:

.woocommerce-tabs {
    grid-column: 1/3;
}

Let me know 🙂

zadoome
July 13, 2023 at 10:30 am

After making the changes as you suggested, it is displayed like this.

site

I want to use the theme by unchecking “Display product tabs” in Appearance – Layout.
I don’t want to use the product description tab.
However, I need product reviews, and I want to use an external plugin for photo reviews.
I would like this review area to be located right below the product image and brief description tab.
Is my request too much… I’m really begging for your help!!
Ying
July 13, 2023 at 11:09 am

As your content in the tab is very long, this Grid structure doesn’t really work well. You’d have to increase the bottom margin of the short description (CSS #1), try 1500px instead of 200px.
zadoome
July 13, 2023 at 11:32 am

Thank you for answering my excessive request!!
So, is there any way to move the description and review tabs below the “product image & brief description”?
I like the current setting where the product image and shopping cart button are side by side at the very bottom.
Ying
July 13, 2023 at 1:05 pm

I looked into the elements that the template builder added, and found a way out 🙂

So go to appearance > elements >Close Summary Wrap , change the priority to 9 instead of 10.

And revert the CSS back to the original state.

Let me know if this works!
zadoome
July 13, 2023 at 10:03 pm

It’s perfect… I was about to give up!!
I can’t believe you came back and provided a solution,,
Thank you so much!!!
Ying
July 14, 2023 at 9:41 am

You are welcome! Glad to help 🙂

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

You must be logged in to reply to this topic.

Are you a GenerateCustomer?

Just browsing?

I want to change the position of the product review.