Automatically opens and closes the mini cart preview in the Blocksy header when a product is added via WooCommerce AJAX.
This lightweight plugin enhances the UX of WooCommerce stores using the Blocksy theme by:
- Automatically focusing (
.focus()
) the.ct-cart-item
cart icon when a product is added to the cart via AJAX - Automatically blurring (
.blur()
) it after 3 seconds to close the mini cart
No configuration needed. Just install and activate.
- β Compatible with WooCommerce and Blocksy
- β Works out of the box with AJAX "Add to Cart"
- β Auto-opens and auto-closes mini cart preview
- β Lightweight and dependency-free
- Download or clone this repository.
- Copy the plugin folder to your
/wp-content/plugins/
directory. - Activate the plugin in your WordPress admin panel under Plugins.
- Done! The mini cart will auto open/close when products are added.
The plugin listens to the WooCommerce added_to_cart
event and applies:
document.querySelector('.ct-cart-item').focus();
setTimeout(() => {
document.querySelector('.ct-cart-item').blur();
}, 3000)
Will it work on product detail pages?
No. This works only with AJAX-enabled add-to-cart buttons, usually on shop or archive pages.
Can I change the timeout?
In this version, the timeout is hardcoded to 3 seconds, but you can easily change the number in the plugin file or request a feature.
- WordPress 5.0+
- WooCommerce 4.0+
- Blocksy Theme (Free or Pro)
- PHP 7.2+
FraGoTe Software Factory Expertos en soluciones a medida, inteligencia artificial y desarrollo web de alto rendimiento.
π www.fragote.com
π§ support@fragote.com