Comments 2Wayne started the conversationJuly 22, 2024 at 2:39pmI think having SKU in (brackets) next to the title creates some visual imbalance issues.I want to put SKU smaller on a new line like below.How can we wrap it in a span instead so it can be styled better? See image here and the highlighted / selected value of what i want to do. 2,212WebWizards repliedJuly 23, 2024 at 2:11pmHello Wayne,Just to let you know, one way to address this, is to add a separate column for the SKU: https://woocommerce-b2b-plugin.com/docs/wholesale-bulk-order-form/#8-toc-title (this is achieved by adding the sku=yes parameter to the shortcode).I've also tried to achieve what you described with the SKU on the next line. It seems to work for me with the following code snippet: add_filter('b2bking_bulkorder_cream_search_name_display', function($name, $product){ $sku = $product->get_sku(); echo esc_html(strip_tags($product->get_name())); if (!empty($sku)){ echo '<br>'.$sku.''; } }, 10, 2);I then see it as follows:You may want to reduce the distance / gap between the name and SKU. You can control it with CSS, by adding this CSS to the site: .b2bking_bulkorder_indigo_name.b2bking_bulkorder_cream_name { line-height: 22px; }You can change this value to increase or decrease the total height.Let me know if that works for you,Kind regards,Stefan1 Like 2Wayne repliedJuly 23, 2024 at 2:40pmWorks a treat, i think this should be native! looks much better and is cleaner for the customer 2,212WebWizards repliedJuly 23, 2024 at 2:57pmThanks for the feedback!I think you're right about that, will look at maybe making this the default in the next update.1 Like Sign in to reply ...
I think having SKU in (brackets) next to the title creates some visual imbalance issues.
I want to put SKU smaller on a new line like below.
How can we wrap it in a span instead so it can be styled better?
See image here and the highlighted / selected value of what i want to do.
Hello Wayne,
Just to let you know, one way to address this, is to add a separate column for the SKU: https://woocommerce-b2b-plugin.com/docs/wholesale-bulk-order-form/#8-toc-title (this is achieved by adding the sku=yes parameter to the shortcode).
I've also tried to achieve what you described with the SKU on the next line. It seems to work for me with the following code snippet:
I then see it as follows:
You may want to reduce the distance / gap between the name and SKU. You can control it with CSS, by adding this CSS to the site:
You can change this value to increase or decrease the total height.
Let me know if that works for you,
Kind regards,
Stefan
Works a treat, i think this should be native! looks much better and is cleaner for the customer
Thanks for the feedback!
I think you're right about that, will look at maybe making this the default in the next update.