Skip to main content
Add to Favorites
Updated over 2 weeks ago

The Add to Favorites widget in Dynamic Content for Elementor allows users to mark any post, page, or product as a favorite, providing a simple yet effective way to create personalized experiences on your site. This feature can be scoped to browser cookies (for guests) or user metadata (for logged-in users).

Settings

  • Scope
    Choose between User (favorites stored in user meta) or Cookie (favorites stored in browser cookies).

    • User: Requires the visitor to be logged in.

    • Cookie: Works for all visitors, with an optional cookie expiration (in days).

  • Key
    The Key is the unique name for identifying a favorites list in UserMeta or browser Cookies.

    • Important: If you change the key, previously saved preferences will no longer be recognized (they remain saved but associated with the old key).

    • It is strongly recommended to use lowercase, use underscores _ instead of spaces, and avoid special characters.

  • Allow Removal
    Enables users to remove a post from favorites. If disabled, only the "Add" action is available.

  • Titles and Icons
    Customize:

    • Add to Favorites text and icon

    • Remove from Favorites text and icon (if removal is enabled)

    • Added to Favorites text (if removal is disabled)

  • Button Settings
    Define button type (Default, Info, Success, Warning, Danger), size, icon alignment (left/right), and styling, such as border-radius, typography, padding, and hover effects.

  • Visibility for Visitors

    • Optionally hide the button for non-logged-in users (only when the scope is set to User).

    • Optionally redirect visitors to a custom login URL when interaction is tried.

Style

The widget provides extensive design flexibility through the Style tab:

  • Button alignment

  • Text and background colors (for Add/Remove states and Hover)

  • Border, border radius, box shadow

  • Text padding

  • Icon size and spacing

Counter

An optional Favorites Counter can be displayed next to the button:

  • Display a dynamic number of favorites

  • Choose counter position (left/right)

  • Add a separator and adjust its width, padding, and spacing

  • Set an icon for visual enhancement


The counter displays how many users (in User scope) or how many cookie-based interactions (in Cookie scope) have saved a given post as a favorite—similar to a Facebook Like button.

In Cookie scope, the counter may not be completely reliable. A visitor who deletes and re-adds a favorite (after clearing cookies) may unintentionally increase the count multiple times.

Usage Summary

  • Use [dce-favorites key="your_key" get="count"] shortcode anywhere in your content to retrieve the number of saved favorites.

  • Perfect for building:

    • Favorite articles lists

    • Wishlists

    • Bookmark systems

Did this answer your question?