Spicing up the off-canvas cart header item

[thisisbbc]

Hello guys,

Few questions regarding the off-canvas cart item.

Since Dynamic Content has been added, we don’t need our custom shortcode to display the cart count, that’s great.

We use the Primary Text of the Toggle Setup and {{dc:woocommerce:cart_items}} along with some CSS and it works fine. We would like however the cart count to be hidden when there’s nothing in the cart (but we would like to keep the cart button). Since there’s no class like “emptycart”, I’m not too sure how we can achieve that using Pro’s options.

Also, although the text color has been configured in white, the text “No products in the cart.” still displays with the default theme color.

Speaking about this text, how would we go about adding some rich content for the empty cart? Marketing-wise it’s important to redirect the user at least on the shop page. Can we add a custom picture along with some text and 1-2 buttons on here?

This would make the off-canvas area much more interesting

Thank you!

[paul.r]

Hi @thisisbbc,

Regretfully, this will require custom development which is outside the scope of support that we offer.

Though I can help with the changing of text color. To change it, add the code below in Theme Options > CSS

.woocommerce-mini-cart__empty-message {
   color:#fff;
}

Then If you would like to change it, you can add the code from the link below in your child theme’s functions.php file

https://wordpress.org/support/topic/woo-3-1-0-your-cart-is-currently-empty-text/

Hope that helps

[thisisbbc]

Hey Paul,

I think that might just do it…

Using the snippet found in the link you provided, would I technically be able to output a shortcode for a Pro Global Block? Something like…

add_filter( 'wc_empty_cart_message', 'custom_wc_empty_cart_message' );

function custom_wc_empty_cart_message() {
  return '[cs_gb id=12345]';
}

I don’t think we can return a shortcode directly like that, can we?

Thanks again!

[ruenel]

Hello @thisisbbc,

Your code is not possible. You cannot nest any element inside a <p></p> tag. The filter was taken from this WooCommerce function:

/**
 * Show notice if cart is empty.
 *
 * @since 3.1.0
 */
function wc_empty_cart_message() {
	echo '<p class="cart-empty">' . wp_kses_post( apply_filters( 'wc_empty_cart_message', __( 'Your cart is currently empty.', 'woocommerce' ) ) ) . '</p>';
}

You can only insert a plain text.

[thisisbbc]

Bummer, I sensed this wouldn’t work.

Since in your April status report you guys mentioned the element are getting some major love can I keep my fingers crossed for better options to achieve this kind of thing in the next release (i.e: empty cart toggle, empty cart content, etc.)?

Your consideration is very much appreciated!

All best,
B

[ruenel]

You are most welcome!
If you need anything else we can help you with, don’t hesitate to open another thread.

[thisisbbc]

I guess I’m going to keep my fingers crossed hehe.

Thanks RueNel

[ruenel]

No problem.
Best Regards.