UserWishList for Evolution CMS

Flexible Wishlist and Favorites solution for Evolution CMS 3.x

UserWishList is a package of four snippets for Evolution CMS that implements an advanced system for managing wishlists and favorites. Unlike traditional solutions based on cookies or tied to specific ecommerce modules, UserWishList operates independently by leveraging Evolution CMS 3.1x User TVs for data persistence. This approach ensures multi-device access to personal lists and offers valuable analytics and marketing opportunities based on user profiles.

Key Features

Dynamic Interaction

• AJAX management for instant addition and removal of items
• Real-time updates without page reloading
• Toast notifications to confirm operations

Smart Interface Management

• Dynamic button states reflecting items' presence in the list
• Configurable behavior for non-authenticated users (hide, modify, or show warnings)
• Complete customization of texts, CSS classes, and component attributes

Flexibility and Localization

• Multi-language support with customizable translation files
• Ability to manage multiple independent lists on the same site
• Versatile implementation (ecommerce wishlist, blog favorites, etc.)
• Custom language files to keep different lists' content separate

Standalone Architecture

• No dependencies on ecommerce modules
• Native integration with Evolution CMS through User TVs
• Reliable data persistence in user profile

Installation instructions

1. Install with Extras Module
2. Assign the TV UserWishList to the 'web users' role.
3. (optional) Assign the TV PrivateWishList to the same role

UserWishList snippet

The UserWishList snippet allows users to view and remove items from their wishlist. This snippet retrieves data from the user's Template Variable and displays it on a listing page.

UserWishList Parameters

• &userId: User ID (skip this parameter for the current logged user id)
• &userTv: WishList Template Variable name (default UserWishList)
• &tpl: Tpl for items
• &outerClass: custom class for WishList container/wrapper
• &btnRemoveClass: custom class for remove button
• &btnRemoveText: custom text for remove button
• &btnRemoveAlt: custom alt attribute for remove button
• &customLang: load a custom language placed in lang/custom (ie: &customLang=`favourites_it`)

Toast notifications Parameters

Both UserWishList and AddToWishList provide control over the appearance and behavior of Toast notifications.

• &loadToastify: load Toastify js and css (0 to disable)
• &toastClose: Add close button to Toast notifications
• &toastErrorBg: Toast Error Background.
• &toastErrorGrav: Toast Error Gravity (default: top)
• &toastErrorPos: Toast Error Position (default: center)
• &toastErrorDur: Toast Error Duration (default: 3000)
• &toastSuccessBg: Toast Success Background.
• &toastSuccessGrav: Toast Success Gravity (default: top)
• &toastSuccessPos: Toast Success Position (default: center)
• &toastSuccessDur: Toast Success Duration (default: 3000)

UserWishList Examples

Basic Call

[!UserWishList?
&tpl=`WISH-ROWS-tpl`
&tvList=`Image`
!]

Advanced Call with custom remove button and counter (on the top)

[!UserWishList?
&tpl=`WISH-ROWS-tpl`
&tvList=`Image`
&orderBy=`menuindex ASC`
&showCounter=`1`
&btnRemoveText=`<i class="icofont-ui-love-remove"></i> Remove`
!]

Custom counter placeholder

You can turn off the default counter by setting &showCounter=`0` and then use the placeholder to position it as desired.

<div class="header-wishlist">
You have <span data-wishlist-total>[+wishlist_total_items+]</span> saved items
</div>

UserWishList chunk tpl

<div class="wishlist-item" id="wishlist-item-[+id+]">
<h3>[+pagetitle+]</h3>
<p>[+introtext+]</p>
[+wishlist_remove_button+]
</div>

AddToWishList snippet

The AddToWishList snippet enables registered users to add an item to their wishlist. When a user clicks the designated button, the snippet retrieves the item ID and saves it in the user's Template Variable as a comma-separated list of IDs.

Additional Features:

• Ability to display how many lists the item is included in: the number of users who have added that particular item to their wishlist.
  
  

AddToWishList Parameters

• &docid: Document ID 
• &userTv: WishList Template Variable name (default UserWishList) 
• &btnClass:  classes for Add to WishList Button
• &btnAddText: text for Add to WishList Button (Add to Wish List)
• &btnAddAlt: alt for Add to WishList Button
• &btnAlreadyText: button's text for products already in list
• &btnAlreadyAlt: button's alt  for products already in list 
• &ShowToNotLogged: show/hide message/button for unregistered users
• &ToNotLoggedTpl: message/button for unregistered users
• &btnNotLoggedAlt: button's alt for unregistered users
• &showCounter: Show counter oh how many users save this item
• &counterTpl: tpl for counter
• &customLang: load a custom language placed in lang/custom (ie: &customLang=`favourites_it`)

AddToWishList Examples

Basic Call

Snippet call inside item page

[!AddToWishList?
&docid=`[*id*]`
`!]

Counter placeholder

<span class="wishlist-count wishlist-count-[*id*] test-muted">Saved by [+wishlist_count+] users</span>

Snippet call inside Doclister Tpl

[!AddToWishList?
&docid=`[+id+]`
`!]

Advanced Call

[!AddToWishList?
&docid=`[+id+]`
&btnClass=`btn btn-light`
&btnAddText=`<i class="text-body fa fa-heart-o"></i>`
&btnAlreadyText=`<i class="text-danger fa fa-heart"></i>`
!]

MostWished snippet

The MostWished snippet retrieves data from the Template Variable of all users and generates a list of the most wished items.

MostWished Parameters

• &userTv: WishList Template Variable name (default UserWishList)
• &limit: how many
• &tpl: DoclIster Tpl
• &tvPrefix: DoclIster tvPrefix
• &tvList: DoclIster tvList

MostWished Examples

[!MostWished?
 &limit=`10`
 &tvPrefix=``
 &tvList=`image,price,offer`
 &tpl=MostWished-tpl`
!]

MostWished chunk tpl

<div class="most-wished-item">
  <h3>[+pagetitle+]</h3>
  <p>[+introtext+]</p>
  <span class="badge bg-info">Saved by [+wishlist_count+] users</span>
</div>

WishedBy snippet

The WishedBy snippet displays the names (name, fullname, or username) of users who have added an item to their wishlist.

WishedBy Parameters

• &docid - Document ID of the product (default: current document)
• &display - Number of users to display (default: 10)
• &tpl - Chunk name or @CODE: for inline template
• &outerTpl - Chunk name or @CODE: for outer template
• &userTv - Name of the TV containing wishlist (default: UserWishList)
• &orderBy - Sort users by: username, fullname, first_name, last_name, email (default: username)
• &orderDir - Sort direction: ASC or DESC (default: ASC)
• &privateWishTv - (optional) The name of a userTv (checkbox) to filter users. Allows the user to protect his privacy. When a user selects this checkbox in their profile, they will be included in the count but their name will not be displayed on the list.

WishedBy Examples

Snippet Call

[[WishedBy?
  &docid=`[*id*]`
  &display=`5`
  &privateWishTv=`PrivateWishList`
  &orderBy=`random`
  &tpl=`@CODE:<div class="user">[+username+]</div>`
  &outerTpl=`@CODE:<div class="wishlist-users">This item is on the wishlist of [+total+] users<br>[+items+]<div>and other [+hidden+] users</div></div>`
]]

Result

This item is on the wishlist of 30 users
John
Michael
Will
James
Thomas
and other 25 users

Languages

Translations

Currently, the package includes translations in 8 languages: de, en, es, fr, it, nl, ru, uk.
Feel free to contribute new translations or improve the current ones.

Custom Languages

• Please refer to the included example of favourites_en.php.

Custom language files must be loaded into the "assets/snippets/UserWishList/lang/custom/" folder and must be called with the customLang parameter (ie: &customLang=`favourites_en`). 

What else can I do with UserWishList?

Some products from your wishlist are on sale

Create a "Some products from your wishlist are on sale" with Doclister and UserField snippets

[!DocLister?
&documents=`[[UserField? &fieldType=`tv` &field=`UserWishList`]]`
&tvList=`img,price,options,OnSale`
&filters=`AND(tv:OnSale:is:1)`
...
!]

Show a user's wishlist

Show with If, Doclister and UserField snippets, the wishlist of a specific user (e.g. for a public profile) , but only if the user has not set the WishList to "private"

[[if? &is=`[[UserField? &id=`123` &fieldType=`tv` &field=`PrivateWishList`]]:not:1` &then=`
  [!DocLister?
     &documents=`[[UserField? &id=`123` &fieldType=`tv` &field=`UserWishList`]]`
     &tvList=`img,price,options,OnSale`
     ...
 !]
`
]]

Addons for UserWishList

MoveToWishList

MoveToWishList snippet to move items between multiple wishlists

Other Snippets for Evolution CMS

MoveToWishList

UserField

RoleCheck

SortView

MonthDate

ImageSrcset Snippet