Storing User's Favourite WebApp / Module Items
Users can "add" or "remove" their favourite WebApp and Module items. You can display them to the User in Lists.
- You have installed the Secure Zones Module
- You have added a User Sign Up Form
- A User has logged in
We've added the ability for User's to store their favourite Module items within a "favourite_items" array, they'll be able to "add" and "remove" items from the list which will be stored alongside the rest of the CRM data available to that User in user_details. Possible Use Cases for this feature include:
- A wishlist of Products
- Bookmarks of favourite Pages
- Giving feedback on parts of a Site the User found helpful.
This Layout will allow the User to add or remove an Item from their favourites.
Note
The User Favourites Toggle Layout will only work within an item.liquid file (for Modules) or a WebApp Layout file that has access to {{this.id}}.
Use this Liquid to include your User Favourites Layout, the only parameter that'll differ for this is the "layout", here you can specify a custom layout: {% include 'user_favourites_toggle', layout: 'default' -%} is_favourite - you can use this within user_favourites_toggle layouts to determine if the Module/ Webapp item is already added to the Users favourites like so:
Our default Layout contains two buttons which we'd recommend you use for reference when setting this up. Let's have a look at these buttons and what they're doing:
To keep things simple, we've bundled the arguments you need to pass into the function into a single Liquid variable containing a JavaScript array {{this.favourite_item}}.
If you need to modify them, you can split this into following the 4 items in the JavaScript array:
A note on security
Even if a malicious User submits a fraudulent User ID argument, we will double check on the server-side, so it won't be possible for them to change the favourites of other Users.
You can also pass success/ failure functions to the add/ remove buttons.
Available arguments for success callback functions:
- type - add/ remove - whether item was added or removed from favourites
- name - name of item added/ removed
- button_element - element that fired toggle function Available arguments for error callback functions:
- error - error message detailing why function failed
Step 2) Add the name of your success function as the second argument to the toggle button's function, and your error function as the third.
If you add an error function, you must add a custom success function. Note it's important to only add the names of functions at this step- this means without the usual round brackets which would contain arguments- that's because we only want to store the functions now and call them later.
You may want to hide the add/ remove buttons from the User if they aren't logged into a Secure Zone you could do so by wrapping your user_favourites Layout within this IF statement: {% if context.current_user %} {% endif %}
Now let's look at how we can output all of the User's Favourite items. The favourite_items object is stored within the User Details Layout.
You can include the user_details Layout like so: {% include 'user_details', layout: 'my_layout' -%} Layouts for user_details are stored under the following path: site Manager/code Editor/layouts/modules>module_5/user_details/my_layout.liquid Next within the "user_details" Layout, you can use the following Liquid variables:
- favourite_items - an array of IDs of favourite WebApp and Module Items you can loop over. This is mostly for use in your logic.
- favourite_items_string - a comma-separated String of favourite WebApp and Module Items. This is formatted ready to be passed into an item_ids parameter for filtering WebApp and Module List views. See below.
{%- include 'webapp', id: '1', layout: 'my_layout', item_ids: favourite_items_string -%}
{%- include 'ecommerce/products', layout: 'default', item_ids: favourite_items_string -%}
{%- include 'module', id: '3', layout: 'my_layout', item_ids: favourite_items_string -%}