Ask SkyVerge

Today’s Ask SkyVerge question comes from Liz:

How can I remove the weight from the WooCommerce Additional Information tab? I want to keep my attributes in the tab, but not the weight. It would also be really cool if my attributes could be a list instead of comma separated. Is this possible?

Thanks so much for the great help on your blog!


These require a couple of minor adjustments to your site and should be pretty easy to do. First, remember to check out our tutorial on How to Add Custom Code to your site so that we’re doing this correctly.

Since these are changes that we want to keep around no matter which theme we use, we don’t want to add them to our theme’s functions.php file. Instead, we’ll add them using a custom plugin or within the Code Snippets plugin. Let’s tackle the first part of the question to remove the weight info.

When you add shipping information to your product (weight and dimensions) these are automatically added to the WooCommerce Additional Information tab on the product page. You could always remove this tab using our WooCommerce Tab Manager, but it’s handy to list out attributes so you may want to keep it around.

The template for the “Additional Information” tab is what adds a list of all of the product attributes. If we dig a bit deeper, we find that these attributes are actually added from the product-attributes.php template via this function: enable_dimensions_display(). There’s a filter available that will let us change the dimensions display. We can set this to ‘false’ by adding this new code snippet:

add_filter( 'wc_product_enable_dimensions_display', '__return_false' );

Please note that this will remove both the weight AND the product dimensions (all shipping information) from the WooCommerce Additional Information tab. Unfortunately, these are both added using the same check, and to remove only the weight we’d have to override the product-attributes.php template (which you should really avoid doing for future upgrades).

Now weight and dimensions will be removed from this tab, and the tab will be hidden unless some attributes have been checked as “Visible on the Product Page”. This will re-add the tab and list your attributes!

Now let’s tackle question #2. If we go back to the product-attributes.php template, we discover a handy filter in this file to change the output of the attributes. Instead of creating a comma-separated list of product attributes, let’s put a line break after each attribute.

We’ll make a function that returns almost the same exact thing, but we’ll replace the commas with a <br /> to create a line break. Create a new code snippet, then insert this code:

function skyverge_change_attribute_list_display( $output, $attributes, $values ) {

	return wpautop( wptexturize( implode( '<br />', $values ) ) );
}
add_filter( 'woocommerce_attribute', 'skyverge_change_attribute_list_display', 10, 3 );

Want to use something else to separate these characters? You could change the <br /> to a pipe character: | or something else instead.

We’d love to hear about it if you use either of these tips! Let us know in the comments 🙂 .

Published by Beka Rice

Beka leads product direction for SkyVerge, focusing on new features for our plugins and Jilt. She spends a lot of time on research and interviews, but likes to write so she has an excuse to spend more time jamming out to anything from The Clash to Lady Gaga.

22 Comments

  1. […] another WooCommerce tutorial from SkyVerge: How to change the WooCommerce Additional Information Tab, which tells you how to remove the shipping information from this tab and adjust the attribute […]

  2. What if I want to rename the weight to “shipping weight”. This is something which a lot of the woocommerce user means when they define weight in the system. Because if you use some other shipping plugin like Table Rate Shipping from woocommerce, it calculate the shipping fees by using this weight as your shipping weight. I want to differentiate between product net weight from shipping weight. And I will create a custom attribute call net weight to refer to the weight without any packaging box.

    • You could change the way it displays on the frontend by ‘translating’ it with the Say What plugin. Change the string “Weight” to whatever you’d like – the text domain is: woocommerce

      • I just installed it, and it has a field “text context”, what should i key in for woocommerce?

        And is there a way we write a filter function that is hooked to wc_product_enable_dimensions_display and replace it ?

  3. Your #2 function (to put items in a list) didn’t work for me. Using latest version of WooCommerce, with a child theme. (Child theme functions working properly.)

    Is this true for the latest WC?

    • Yep, it’s working with latest WC on our site. I’m guessing your theme is overriding this template and the filter isn’t present if it’s not working, so I’d get in touch with the theme dev and ask them to update the template, or manually update yourself.

      • Looking closer at the code (yours, plus the original code), it appears that the function of your code is to take an array of items (additional attributes) and display them as a list of items (each attribute separated by a <br />).

        My initial (quick) impression was that the code would take a list of items in the attribute (said list typed in with the Enter key between each item) placed in *one* attribute field and display them as a line-breaked list.

        The WC code ignores any HTML code (such as a or and displays the items as a paragraph. Even if you put each item on a separate line in that attribute field.

        The WC code will take text separated by the ‘pipe’ “|” character and replace that character with a comma, but you still get a ‘paragraph’-looking hunk of text.

        What would be optimal, IMHO, is additional code that would allow you to enter HTML code in the attribute textarea, and display that HTML code. That was the function I was looking for which I hoped this article’s code would provide. Hence my confusion.

        • Rick, you’ve probably already figured out what you want to do, but I’ll post this for future searchers. This create a bullet list of attributes.

          // Change "Additional Information" tab to bullets
          function child_change_attribute_list_display( $output, $attributes, $values ) {
          
              return '<ul><li>' . wpautop( wptexturize( implode( '</li><li>', $values ) ) ) . '</li></ul>';
          }
          add_filter( 'woocommerce_attribute', 'child_change_attribute_list_display', 10, 3 );
          • That’s worked fantastic for me and that’s from the point of view of someone with almost no code experience.
            Quick question though as I simply wanted to be able to use enter to create text on a new line which it appears to have done using this code how would I remove the bullet point?

  4. I needed to hide just the weight but retain the dimensions, so I used CSS.

    table.shop_attributes tr:FIRST-CHILD {
    display:none;
    }

    This hides the first row of the table, which in our case displayed the weight.

  5. Hey Beka,
    Any idea if there is an ‘easy’ way to add additional fields?
    As well as Weight & Dimensions, it would be great to be able to add Material, Capacity and other attributes?

    Thanks alot

    • If you enable the checkbox to make attributes visible on the product page, they’ll automatically be added to the additional info tab 🙂

  6. Is it possible to create and group custom (newly created) product attributes to show-up under custom tabs, either through code or using Tab manager plugins for woocommerce.

    I mean, rather than having all the attributes under additional information tab, can i choose to categorize and display under multiple custom tabs?

    • Hey Suresh, I’m afraid the Tab Manager can’t do this on its own. You would need some custom code to get the attributes for the product and output them — I’d recommend turning this into a shortcode that you could use within tabs. Here’s a helpful tutorial to get started.

      • Hi Beka,

        Thanks for the reference link. I shall processed forward in that direction.
        Could you also help me with any reference articles that explain converting wordpress functions (code output blocks) into shortcodes. May be, i will need to loop through all the attributes filtering them into separate array variables (one each for category), and later apply shortcodes on these new category array variable.

        Also, It would be even more helpful, if can find a plugin that can generate these shortcodes for me.

        Thanks in advance

        Regards,
        Suresh Jaladanki

  7. Hi,
    thanks for the tips but for some reason my Additional information tab just doesn’t open. Anyone has any idea what’s preventing that? It doesn’t react on click.
    Dan

  8. Is it possible to show the SKU number as well of each of the varations.

  9. Hi, Beka

    Can i change Additional Information data display layout

    current layout like this:

    WIDTH X HEIGHT | 350 x 50, 150 x 20, 150 x 200

    I need layout like this

    WIDTH X HEIGHT | 350 x 50
    150 x 20
    150 x 200

    Remove ‘,’ and display line by line

  10. Ok , Now it’s working

    Nice blog helpful for me

    Thanx,

Hmm, looks like this article is quite old! Its content may be outdated, so comments are now closed.