Related Product Borders

Support
#1

Hi there,

We need help please. we are trying to remove the borders from the related post images, it currently has a thick white border. There is also a white border around the description panel that we need to get rid of. This client is Irate and will apparently die if we can’t remove the white borders above mentioned.

Please help.
Link: https://drive.google.com/open?id=1vWkYjeoUbhvYy3impbCrelfnppJIHPU6

#2

Hello Tevan,

Thanks for writing in!

To remove the borders of the related products, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.woocommerce .related.products li.product .entry-featured {
     border-width: 1px;
}

We would love to know if this has worked for you. Thank you.

#3

Hi thanks for the reply.

I have tried to insert it and it didn’t take the borders away. The related product borders are still there and the description/Additional Information/How to use/reviews tabs still have the border as well.

#4

Hello Tevan,
​
​To assist you better with this issue, would you mind providing us the url of the page in questioned with login credentials, if necessary, so we can take a closer look? This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

To do this, you can make a post with the following info:
– Link to your site
– WordPress Admin username / password (only if necessary)

To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Thank you.

#5

Hey Tevan,

To remove the borders of the related products and for the WooCommerce tabs in the product page, please make use of this code instead:

.woocommerce .related.products li.product .entry-featured {
     border-width: 0;
     padding: 0;
}

.woocommerce-tabs .x-tab-content,
.woocommerce-tabs .x-nav-tabs,
.woocommerce-tabs .x-nav-tabs.top>li,
.woocommerce-tabs .x-nav-tabs.top a {
    border: 0;
}

.woocommerce-tabs .x-tab-content .x-tab-pane {
    background-color: transparent;
}

We would love to know if this has worked for you. Thank you.

#6

You guys are amazing!

You wouldn’t by any chance know how to remove the actual white selected tab colour for description/reviews etc.?

#7

Hello Tevan,

Thanks for updating the thread. :slight_smile:

To remove the background color from tabs, you can add following CSS under X > Theme Options > CSS:

.x-nav-tabs.top>.active>a {
    background-color: transparent;
}

1- I have found the proper CSS code selector using the Chrome browser Developer Toolbar: https://www.youtube.com/watch?v=wcFnnxfA70g

2- For the CSS code itself, I suggest that you get started with this tutorial: https://www.youtube.com/watch?v=yfoY53QXEnI

Thanks.

#8

Thank you so much

#9

You’re welcome.

#10

Hey there are 2 things left that we are battling with, the images are in the link attached below.

We would like to know how to change the background colour of the comment boxes under reviews, then also there are white borders if we go into a category eg. ladies the archive images still have a white border.

Link: https://drive.google.com/open?id=1yp4UtXYNvf5w_0OB1vl9kkIcfoH2OSHn

#11

Hello Tevan,

Please add this code as well:

.woocommerce .entry-featured {
    background-color: #000; /* Please change it to your color preference */
}

.woocommerce #comments article.comment {
    border: 0;
    background-color: #000;
}

.woocommerce #comments .x-comments-list .x-comment-header .star-rating-container {
    border: 0;
}

.woocommerce #comments article.comment:before {
    display: none;
}

Hope this helps.

#12

perfect thank you

#13

Glad we were able to help :slight_smile:

#14

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.