Product Reviews Position and Review Stars Position

[cori_tmc]

I have questions regarding the location of the product reviews and the location of the product review stars. I should probably mention that I use YOTPO reviews currently.

1.a) I’m trying to change my product page so that the product reviews are already open like this page: http://swiftideas.com/product/achilles-mid/, but I’d like for the Description tab to be open above it instead of the Additional Information tab.
b) The other option would be to have the product page have tabs like this page: http://puzumi.co/shop/diamond-rainbow/. When I go to Theme Options>WooCommerce Options>Product Options and set Product Review Position to tabs it doesn’t change anything.

2. Some of my products are showing two rows of stars, but not all of them. Here are examples: http://tmcadmin74.staging.wpengine.com/product/cleansing-oil/, http://tmcadmin74.staging.wpengine.com/product/miners-mint-toner-aftershave-face-tonic/, http://tmcadmin74.staging.wpengine.com/product/birch-tar-soap/ Is this because there are some old product reviews from WooCommerce on those products, and it’s reading the WooCommerce reviews as well as the Yotpo reviews?

3. The star ratings below the products on the product catalog page are aligned left, even though I have the product details centered. You can look at that here: http://tmcadmin74.staging.wpengine.com/shop/

Thank you very much for your help!

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Hi

1a) You will need to not be using along description, just use the short description box and leave the other empty, then the description tab will not show and the additional info will be open by default

2) Yes, you will need to either remove those reviews or add this to your custom css:

.woocommerce .star-rating {
  display: none;
}

3) Check the settings of the plugin, the stars have a class of ‘pull-left- so I imagine there is a setting for the alignment of the stars. If not, add this to your custom css:

.woocommerce ul.products li.product .yotpo-bottomline .text-m {
  display: none;
}
.yotpo .pull-left {
  float: none!important;
  text-align: center;
}

– Kyle

[cori_tmc]

Hi, Kyle.

Thank you for your reply. Unfortunately that didn’t resolve my issues.

1a) I was asking for the Description tab with the long description to automatically display with the product reviews automatically open below the long description. The example page I provided was to show how the reviews were automatically open at the bottom. http://swiftideas.com/product/achilles-mid/

3) I added the code in the custom css box, but unfortunately it only removed the text showing the number of reviews, but the stars are still aligned left. I removed the code since it didn’t work, but I have attached a screenshot.

Thank you again for your help.

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

1) Yes but you’re using a review plugin which is added to the tab area, so it’s not possible to have both open at the same time

3) Can you add the css so I can check, it’s working for me in the live editor

– Kyle

[cori_tmc]

1. If there’s no way to make my page have the reviews tab automatically open, then how do I get it to look like option 1b that I posted in my original question? “1b) The other option would be to have the product page have tabs like this page: http://puzumi.co/shop/diamond-rainbow/. When I go to Theme Options>WooCommerce Options>Product Options and set Product Review Position to tabs it doesn’t change anything.”

3. I’ve added the code to center the stars for you to take a look at.

[Rui Guerreiro – SUPPORT]

Hi,

Just forward it to my Kyle so he can assist you.

-Rui

[cori_tmc]

I’m still waiting for a reply regarding this issue.

Thank you.

[Kyle – SUPPORT]

1) This layout is not possible as that’s a different theme, with Atelier that info is below the product where it is now on your site. The original reviews from the theme have 2 output options, below the tabbed area or within the tabbed area, you’re not using those reviews, you’re using a plugin which is set to output in the woocommerce tabs. If you want to change the output to display out of the tabs you will have some custom editing to do

3) Change it to:

.yotpo .pull-left {
  float: none !important;
  text-align: center!important;
}

– Kyle

[cori_tmc]

Thank you for your help.

1) My concern is that on the mobile layout the reviews tab hangs off to the right, and people will not know to scroll over to find the reviews tab.(Screenshot attached.) If I can’t have the reviews open at the bottom is there an easy way to remove the Additional Information tab or to move it to the end so that the Reviews tab is easily visible on the mobile layout?

2) Thank you for the code. That did work to center the stars on the products catalog page, however now the stars on the individual product pages are also centered.(Screenshot attached.) They should be left justified.
Also, the related products at the bottom of the product page no longer show stars.(Screenshot attached.)

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

Hi,

1) To remove the Additional Information tab on a small screen, please use this:

@media only screen and (max-width: 767px) {
li.additional_information_tab {
    display: none!important;
}
}

3)

Please also add this:

.single-product .yotpo .pull-left {
    text-align: left!important;
    float: left!important;
}

Thanks.

[cori_tmc]

Thank you. That solved most of the issues. The related products at the bottom of the product page are still missing their stars. How do I bring those back? Thanks!

[Kyle – SUPPORT]

Hi

There’s no output in the html, are you sure they used to be there?

– Kyle

[cori_tmc]

Hi, Kyle.

I removed all the coding related to the stars and double checked if there were originally stars under the related products, and it actually looks like they weren’t there before. Sorry about that. However, I did notice that the stars on the product catalog page used to have red text to the right that shows the number of reviews. I’ve attached a screenshot. Is there a way to bring the number of reviews back on the products catalog page?

Thank you.

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Remove this from your css:

.woocommerce ul.products li.product .yotpo-bottomline .text-m {
  display: none;
}

– Kyle

[cori_tmc]

That worked! Thank you very much for all your help!