/** * @snippet Truncate Tags @ Single Product * @how-to Get CustomizeWoo.com FREE * @author Rodolfo Melogli * @compatible WooCommerce 6 * @donate $9 https://businessbloomer.com/bloomer-armada/ */ add_action( 'woocommerce_after_single_product', 'bbloomer_woocommerce_tag_list_truncate' ); function bbloomer_woocommerce_tag_list_truncate() { wc_enqueue_js(' var ellipses = "... "; var delimiter = ","; var content = $(".tagged_as").html(); var a = content.split(delimiter).slice(0, 3); var b = content.split(delimiter).slice(3); var html = a + "<span class=\'truncated\'>" + ellipses + "<a class=\'read-more\'>+</a></span><span class=\'truncated\' style=\'display:none\'>, " + b + "</span>"; $(".tagged_as").html(html); $(".read-more").click(function(e) { e.preventDefault(); $(".tagged_as .truncated").toggle(); }); '); }
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter