Favorites Button Element¶

Adding the element is done by dragging or selecting the Favorites Button element into your Elementor page content:

The element is available in the VDP and Search Results Item categories, so place it on a listing detail template or on the listing card used in search results — anywhere a single listing is in context. It renders nothing on a page with no listing, so it can't be used as a standalone site-wide widget.

Placing this element is also what loads the sidebar and trigger button. You never add those separately.

Button Settings¶

The element settings allow you to customize the text, icon, and styling for both adding the listing to the user's favorites and removing it.

Setting	Description	Default
Add Label	Text shown when the listing is not yet saved.	Save
Remove Label	Text shown when the listing is already saved.	Saved
Button Icon	Icon displayed inside the button.	—
Saved State Icon	Icon displayed when the listing is saved. Falls back to the default icon if empty.	—

Button Style¶

Standard styling controls for the default (unsaved) state:

Background Color
Padding
Border Radius
Button Typography

Saved State¶

A separate tab styles the button once the listing has been saved, so the change is obvious to the visitor:

Background Color
Text & Icon Color
Border Color

Only these three are overridden in the saved state — padding, radius, and typography carry over from Button Style, so the button doesn't shift or resize when clicked.

Shortcode¶

The element is registered with DMS as dms_favorites_button, so it is also available anywhere DMS shortcodes are supported, with the same label attributes:

[dms_favorites_button add_label="Save" remove_label="Saved"]

The same rule applies — a listing has to be in context for it to render.