Favorites Button element in Max Addons for Bricks Builder lets your users save content they like and return to it later.
This element works perfectly for blogs, eCommerce stores, recipe sites, and event listings, making it easy for visitors to mark items as favorites.
You can use it with Blog posts, Products, Recipes, Events, or any Custom Post Type!
Getting Started#
Before you start, make sure the following are installed and active on your website:
How to Add the Favorites Button Element#
Follow these steps to add the element to your page:
- Open an existing page or create a new one using the Bricks Builder editor.
- In the element search bar, type “Favorites.”
- Add the element to your page.
- Make sure the element has the “MAX” label.
Once added, you will see two main tabs:
- Content Tab
- Style Tab
Content Tab#
Content Tab allows you to control the functionality and behavior of the Favorites Button.
Button Type#
Choose how the button behaves:
- Toggle Favorite: Let users add or remove a single item from favorites
- Clear All Favorites: Removes all saved items at once
- Favorites Count: Displays the total number of saved items.
User Access#
Control who can use the favorites feature:
- Logged-in Only: Only registered users can add favorites.
- All Users: Anyone (including guests) can use the feature.
Post Type#
Select the type of content the button will work with: Post, Page, or Media.
Button Settings#
- Button Text
- Set the default button label.
- Customize the text after an item is added to favorites.
- Size: Choose the button size: Small, Medium, Large, or Extra Large.
- Style: Select a predefined style: Primary, Secondary, Light, Dark, Muted, and more.
- Additional Options
- Circle: Enable this to make the button circular
- Outline: Enable this to display an outline-style button
Icon
You can enhance the button with icons:
- Button Icon: Default state
- Button Icon (Added): When item is added to favorites
Button Style#
Control the appearance of the button:
Default State
- Typography
- Background Color
- Border
- Box Shadow
- Padding
Added State
- Typography
- Background Color
- Border
- Box Shadow
Loading Indicator#
Show a loading animation when users interact with the button.
- Enable Loading Indicator: Turn this option on to display a loading state.
Available Options
- Loading Indicator Type: Spinner or Icon
- Preview: You can also preview your loading indicators directly in the editor for real-time adjustments.
- Color: Choose the indicator color.
Spinner Settings (if Spinner is selected)
- Spinner Size
- Spinner Width
Icon Settings (if Icon is selected)
- Icon Size
Tooltip#
Tooltips provide helpful messages when users hover or interact with the button.
- Enable Tooltip: Turn this on to display a tooltip.
- Tooltip Content: Customize Default Text, Text (Added State) and more.
- Position: Choose where the tooltip appears.
- Offset: Horizontal Offset or Vertical Offset.
Tooltip Style#
Customize the tooltip design:
Default Tooltip
- Typography
- Background Color
- Border
- Box Shadow
- Border Radius
- Width
- Padding
Added Tooltip
- Typography
- Background Color
- Border
- Box Shadow
Advanced Options#
Fine-tune tooltip animations and behavior:
- Delay (ms): Time before tooltip appears
- Transition In (ms): Animation speed when tooltip appears
- Transition Out (ms): Animation speed when tooltip disappears
- Translate X: Move tooltip horizontally
- Translate Y: Move tooltip vertically
- Tooltip Scale: Adjust tooltip size during animation
Wrapping Up!#
This was the complete overview of the Favorites Button element by Max Addons for Bricks Builder. If you have any doubts or questions, you can contact us here!