WooCommerce · Elementor
WooCommerce Floating Cart Icon widget for Elementor
WooCommerce Floating Cart Icon is an Elementor widget in King Addons. Enable it under King Addons → Dashboard if it is off, then search for “WooCommerce Floating Cart Icon” in the Elementor panel.
Get King Addons
This page describes the PHP/JS for this widget — not a renamed stub. Install the free plugin from WordPress.org.
What it actually does
WooCommerce Floating Cart Icon is an Elementor widget in King Addons. Enable it under King Addons → Dashboard if it is off, then search for “WooCommerce Floating Cart Icon” in the Elementor panel.
WooCommerce Floating Cart Icon Widget (Free).
render() writes HTML data attributes: data-auto-open, data-trigger.
Output depends on WooCommerce objects (products, cart, or account). Empty without WooCommerce data.
Some inspector controls are marked Pro in PHP (eicon-pro-icon / king-addons-pro-control). Those need King Addons Pro, not Elementor Pro.
The script talks to WooCommerce front-end events or add-to-cart URLs.
How to add it in Elementor
- Install King Addons. Install Elementor and King Addons. Get King Addons from WordPress.org.
- Edit with Elementor. Open a page and click Edit with Elementor.
- Insert the widget. Search the panel for “WooCommerce Floating Cart Icon”. Typing “king” lists every King Addons widget.
- Set inspector controls from this widget’s PHP. Configure “Icon”, “Label”, “Show Label”, “Show Count Badge”. Style and Content tabs are listed on this page.
When to use it
- An Elementor page that needs WooCommerce Floating Cart Icon.
- A layout in the product grids, cart, checkout, and shop pages group.
- Search the panel for “WooCommerce Floating Cart Icon” after King Addons is active.
Inspector controls from this widget’s PHP
| Control | What the code does |
|---|---|
| Content — Icon | Icon rendered with Elementor Icons_Manager in this widget’s HTML. |
| Content — Label | Printed in the widget HTML from render(). |
| Content — Show Label | Switcher inspector control (`kng_show_label`). |
| Content — Show Count Badge | Switcher inspector control (`kng_show_badge`). |
| Floating Button — Side | The chosen value is read in render() and applied on the front end. Options: Left; Right. |
| Floating Button — Horizontal Offset | Spacing/size control (min 0, max 120). |
| Floating Button — Bottom Offset | Spacing/size control (min 0, max 200). |
| Quick View — Show Subtotal | Switcher inspector control (`kng_show_subtotal`). |
| Quick View — Hover to open (Pro) | Switcher inspector control (`kng_upgrade_hover`). |
| Quick View — Drawer layout (Pro) | Switcher inspector control (`kng_upgrade_drawer`). |
| Button — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-floating-cart__button`. |
| Button — Text Color | Writes CSS `color` onto the widget’s front-end markup. |
| Button — Background | Writes CSS `background-color` onto the widget’s front-end markup. |
| Button — Hover Background | Writes CSS (button, background-color) onto the widget’s front-end markup. |
| Button — Border | Elementor border group: type, width, color, and radius when the group includes it. Selector: `{{WRAPPER}} .king-addons-floating-cart__button`. |
| Button — Box Shadow | Elementor box-shadow group for the selector. Selector: `{{WRAPPER}} .king-addons-floating-cart__button`. |
| Button — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Badge — Badge Background | Writes CSS `background-color` onto the widget’s front-end markup. |
| Badge — Badge Text | Writes CSS `color` onto the widget’s front-end markup. |
| Badge — Box Shadow | Elementor box-shadow group for the selector. Selector: `{{WRAPPER}} .king-addons-floating-cart__badge`. |
| Panel — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-floating-cart__panel`. |
| Panel — Background | Writes CSS `background-color` onto the widget’s front-end markup. |
| Panel — Text Color | Writes CSS `color` onto the widget’s front-end markup. |
| Panel — Border | Elementor border group: type, width, color, and radius when the group includes it. Selector: `{{WRAPPER}} .king-addons-floating-cart__panel`. |
| Panel — Box Shadow | Elementor box-shadow group for the selector. Selector: `{{WRAPPER}} .king-addons-floating-cart__panel`. |
| Panel — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
Content and Style tabs from this widget’s PHP, including repeater fields and group controls (typography, background, border, shadow). Elementor’s Advanced tab is core Elementor and is not listed here.
FAQ
Which WooCommerce Floating Cart Icon options need King Addons Pro?
Controls marked with the Pro icon in this widget’s PHP. King Addons Pro is a separate license from Elementor Pro.
Does WooCommerce Floating Cart Icon require WooCommerce?
Yes. Install WooCommerce and add products (or complete a cart) before this widget has anything to show.
Do I need Elementor Pro?
No. King Addons runs on free Elementor. Some King Addons options (for example template-in-accordion, extra popup conditions, parts of the template catalog) need King Addons Pro — not Elementor Pro.
Related woocommerce widgets
Single Product
Single Product is an Elementor widget in King Addons. Enable it under King Addons → Dashboard if it is off, then search for “Single Product” in the Elementor panel.
Quick View Product
Quick View Product is an Elementor widget in King Addons. Enable it under King Addons → Dashboard if it is off, then search for “Quick View Product” in the Elementor panel.
360° Product Viewer
360° Product Viewer is an Elementor widget in King Addons. Enable it under King Addons → Dashboard if it is off, then search for “360° Product Viewer” in the Elementor panel.
Wishlist Button
Wishlist Button is an Elementor widget in King Addons. Enable it under King Addons → Dashboard if it is off, then search for “Wishlist Button” in the Elementor panel.
Wishlist Counter
Wishlist Counter is an Elementor widget in King Addons. Enable it under King Addons → Dashboard if it is off, then search for “Wishlist Counter” in the Elementor panel.
Wishlist Icon
Wishlist Icon is an Elementor widget in King Addons. Enable it under King Addons → Dashboard if it is off, then search for “Wishlist Icon” in the Elementor panel.
Get King Addons
One free plugin. 80+ Elementor widgets, 650+ templates, and 4,000+ sections. Search for WooCommerce Floating Cart Icon after you activate it.