[Resolved] Removing the additional information borders

Home Forums Support [Resolved] Removing the additional information borders

Home Forums Support Removing the additional information borders

  • This topic has 11 replies, 5 voices, and was last updated 2 months ago by Leo.
Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #2245968
    Hana

    Hello, How to Remove the additional information borders in the single product page, I want them for example like this with no table borders

    Color: Black
    Size: Small
    Material: Cotton

    #2245989
    David
    Staff
    Customer Support

    Hi there,

    can you share a link to a product where i can see them ?

    #2246270
    Hana

    please check the private link

    #2246309
    Leo
    Staff
    Customer Support

    Try this CSS:

    .woocommerce .woocommerce-tabs table.shop_attributes th, 
    .woocommerce .woocommerce-tabs table.shop_attributes tr, 
    .woocommerce .woocommerce-tabs table.shop_attributes td {
        border: 0;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    #2246447
    Hana

    It doesn’t work my dear

    #2246464
    Ying
    Staff
    Customer Support

    Hi Hana,

    Try this:

    .woocommerce .woocommerce-tabs table.shop_attributes th, 
    .woocommerce .woocommerce-tabs table.shop_attributes tr, 
    .woocommerce .woocommerce-tabs table.shop_attributes td, 
    .woocommerce table.shop_attributes{
        border: 0;
    }
    #2246870
    Hana

    Sorry Ying, It doesn’t work

    #2246906
    Fernando
    Customer Support

    Hi Hana,

    Tested the code and it should work.

    See: https://share.getcloudapp.com/ApuXOW0p

    May we know how you’re adding the CSS code? Can you try adding it in Appearance > Customize > Additional CSS?

    Moreover, I can see that you added PHP code in Appearance > Customize > Additional CSS. This would cause other code not to work in there. PHP code shouldn’t be added there. Kindly remove all non-CSS code in your Additional CSS and see how it goes.

    For instance, you have this code in Additional CSS:

    add_filter( 'woocommerce_product_tabs', 'woo_rename_tabs', 98 );
    function woo_rename_tabs( $tabs ) {
    
    	$tabs['description']['title'] = __( 'More Information' );		// Rename the description tab
    	$tabs['reviews']['title'] = __( 'Ratings' );				// Rename the reviews tab
    	$tabs['additional_information']['title'] = __( 'Product Data' );	// Rename the additional information tab
    
    	return $tabs;
    
    }

    This is PHP code and should be add through a plugin like Code Snippets for instance.

    Adding PHP reference: https://docs.generatepress.com/article/adding-php/#code-snippets

    Kindly let us know.

    #2250079
    Hana

    It is work now my dear 🙂
    but how to remove grey line mentioned in this screenshot

    #2250430
    Leo
    Staff
    Customer Support

    Try this:

    .woocommerce table.shop_attributes tr:nth-child(even) td, .woocommerce table.shop_attributes tr:nth-child(even) th {
        background: none;
    }
    #2250702
    Hana

    That is great
    Thank you Leo 🙂

    #2251230
    Leo
    Staff
    Customer Support
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.