PL Wishlist/Compare: How To Add & Edit A Wishlist?

Written by the Divi Engine Documentation Team

Introduction

Follow this information to add a wishlist feature to your website using the Wishlist/Compare module.

Step 1: Enable Wishlist Feature

Go to BodyCommerce > Wishlist and enable the wishlist feature - remember to save.

Step 2: Add The Wishlist/Compare Module

Head over to your product page template and add the Wishlist/Compare module.

Step 3: Set The Module To The Wishlist

Select Wishlist from the "Type" field in the Main Settings section. After doing this you can customize the other settings - more on these settings below.

Step 4: Create A Wishlist Layout

Go to the Divi Library and build a wishlist layout.

  • Add the Product Loop module.
  • Select your post type - such as Products.
  • Select the "Wish List" feature.
  • Select a custom loop layout (aka product loop layout) built in the Divi Library. Note that you should add the Wishlist/Compare module to THIS product loop layout so that your customers can remove products from their wishlist.

Step 5: Add The Wishlist Layout To Your Account Page

Go over to BodyCommerce > Accounts and select your Wishlist layout from the Wishlist dropdown. This will then add the Product Loop layout in the Wishlist layout to the account page so that users can view wished-for products. 

Wishlist/Compare Module Settings

Main Settings

  • Choose The Type: Select the wishlist feature.
  • Make The Module As A Button: Enable to display a button instead of an icon.
  • Button Text: Define text for the button.
  • Added Button Text: Define text for the button when the product has been added to the wishlist.
  • Icon Position From Right: Define the icon position.
  • Extra Icon Positioning: Give the icon extra positioning.
  • Use Popup Notification: Enable to use the popup feature.
  • Adding To List Text: Give the popup some text.
  • Added Success Message Text: Give the popup some text after the product is successfully added to the wishlist.
  • Delay After Successful Add/Remove: Define the delay time.
  • Removing From List Text: Define the text to remove the product from the wishlist.
  • Removed Success Message Text: Define the message after the product is successfully removed from the wishlist.

Add Icon

  • Add Icon: Select a "Add To List" icon (if not using the button).
  • Add Icon Colour: Give the "Add To List" icon colour.
  • Use Add Icon Font Size: Enable to define a specific font size for the "Add To List" icon.
  • Add Icon Font Size: Define the "Add To List" icon font size.

In List Icon

  • Add Icon: Select a "In List" icon (if not using the button).
  • Add Icon Colour: Give the "In LIst" icon colour.
  • Use Add Icon Font Size: Enable to define a specific font size for the "In List" icon.
  • Add Icon Font Size: Define the "In List" icon font size.

Adding Icon

  • Add Icon: Select a "Adding To List" icon (if not using the button).
  • Add Icon Colour: Give the "Adding To List" icon colour.
  • Use Add Icon Font Size: Enable to define a specific font size for the "Adding To List" icon.
  • Add Icon Font Size: Define the "Add To List" icon font size.
  • Adding Icon Rotation Speed: Define a speed for the rotation of the "Adding To List" icon.

More Support?

Please email us at [email protected] if you are unable to get Divi BodyCommerce working.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.