Create a dynamic, interactive shopping cart icon that displays real-time cart information and enhances the shopping experience. This powerful WooCommerce integration block provides a fully customizable cart indicator with live updates, mini cart functionality, and comprehensive styling options that seamlessly integrate with any theme design.
Perfect for headers, navigation areas, or anywhere you want to provide quick cart access, this block automatically updates cart counts and totals while offering complete control over appearance and functionality. From simple cart icons to feature-rich shopping interfaces, customize every aspect to match your store’s branding and user experience requirements.
Key Features:
Multiple Icon Styles – Choose from shopping cart, shopping bag, basket icons, or upload custom SVG icons for unique branding
Real-Time Cart Updates – Automatic display of current cart count and total value with live AJAX updates
Interactive Mini Cart – Optional hover dropdown showing cart contents, item details, quantities, and quick remove options
Flexible Display Options – Toggle cart count badge, cart text, total price, and mini cart independently for custom layouts
Smart Visibility Controls – Option to hide the entire cart icon when cart is empty for cleaner presentation
Responsive Layout System – Horizontal and vertical layout options with device-specific alignment controls (left, center, right)
Complete Color Customization – Independent color controls for icons, count badges, text, totals, backgrounds with hover states
Advanced Typography Controls – Separate font settings for cart text, count badges, and mini cart content with responsive sizing
Professional Count Badge – Customizable circular badge displaying cart quantity with position and styling controls
Mini Cart Styling – Comprehensive mini cart design options including width, position, colors, typography, and button styling
Custom Text Options – Editable cart text and empty cart messages for multilingual and branding flexibility
Border & Styling System – Complete border controls with styles, widths, colors, radius, and hover effects
Interactive Hover Effects – Built-in hover animations including scale, bounce, and pulse effects for enhanced user engagement
Responsive Spacing Controls – Device-specific icon sizing, spacing, padding, and margin controls for perfect layouts
Animation Integration – Entrance animations with preview functionality to create engaging cart interactions
Device Visibility Controls – Show or hide cart icon on specific devices for optimized mobile shopping experiences
WooCommerce Integration – Seamless integration with WooCommerce cart functionality, sessions, and checkout process
Developer-Friendly Structure – Clean semantic HTML markup with custom anchor support and CSS classes for advanced customization