Favorite Items

The Favorite Items Add-On lets users heart or like map items directly from the item list or pop-up. Favorites can be stored locally in the browser or synced to a Memberstack account so they persist across devices.

Key Features

• Enable Liking: A heart button appears on each map item so users can save their favourites directly on the map or in the list view.
• Favourites Filter: A one-click filter tag lets users view only their liked items.
• Memberstack Sync: In Guest Mode, favourites are saved to the current browser session. When a user is logged in via Memberstack, favourites are saved to their profile and persist across devices.

Enable Favoriting

In Dynamic Map App, navigate to Add-Ons, enable Favoriting, and press Save. A heart button (ncf-favorit-button) will appear on each item in your map item list.

Style the Favorite Button

Style all button states in the Style Guide in Webflow Designer. Three states are available:

ncf-favorit-button — Default state (item not yet favourited)

• ncf-favorit-button favorited — Active state for liked items
• ncf-favorit-button disabled — Disabled state when Memberstack is enabled but the user is not logged in

Add the Favourite Button to Your Pop-Up or Tooltip

💡 Pro Tip: Place a like button inside your pop-up or tooltip for a more immersive experience. Copy (Cmd+C) the ncf-favorit-button element from the map item list and paste (Cmd+V) it inside the pop-up or tooltip element in Webflow Designer.

Style Liked Pins on the Map

💡 Pro Tip: To visually distinguish favourited pins on the map, add the combo class liked to your cru-ncf-pin element in the Style Guide and apply your desired styling.

Filter Favourite Items

To add a Show Favourites Only filter button, enable Create Filter Tag for Favourites in the Dynamic Map App Add-Ons panel and press Save.

💡 To show a filtered item count alongside the favourites tag, make sure Live Filtering is enabled in the Interactions panel.

Style the Filter Tag

To style the favourites filter tag independently from your other filter chips, give it the class ncf-filter-chip-liked and add hover and active combo classes as you would for any other filter chip.

Alt: Webflow Designer showing the favourites filter tag styled with the ncf-filter-chip-liked class and custom styling.

Integrate with Memberstack

Enable Connect with Memberstack in the Add-Ons panel to sync favourited items to the logged-in user's Memberstack profile. See the full setup guide: Integrate with Memberstack.

• If a user is not logged in, the button enters the ncf-favorit-button disabled state. Style this in the Style Guide.
• If a user is logged in via Memberstack, favourites are saved by their Memberstack ID and are no longer accessible after logout.