It doesn’t get much better (or easier) than online shopping in your pajamas. What can you do to make this experience even better for your users? Add Webflow wishlists to your website today. Let your users shop and save their favorite products to a personalized wishlist.

With Jetboost, your users will have the freedom to edit and revisit their wishlists at any time. Improve your user experience and watch your customer engagement grow. That’s not all though. Keep reading to learn more about the benefits of wishlists.

We’ll also teach you how to add a wishlist feature to your Webflow website with Jetboost’s CMS Item Favoriting Booster. And don’t worry, you don't need to write any code. Let’s give your users an exceptional shopping experience from the comfort of their own homes. 

How can I use a wishlist feature on my website?

We know that wishlists are a stellar addition to any eCommerce store. But, how else can you use wishlists on your website? Check out some of our favorite use cases below. 

eCommerce Stores. eCommerce wishlists are beneficial for your users and your business. Your users will love how easy it is to save and share their favorite products. Give your users even more features like the ability to see their total saved items or reset their wishlist with the click of a button. Keep users coming back to your store and watch your sales grow. 

Membership Sites. Does your website provide member-only content or products? Our wishlist feature integrates with Webflow Memberships, Memberstack, MemberSpace, and Outseta. Your users will be able to save their wishlists directly to their login for future reference.

Travel Booking Sites. It’s not uncommon for people to plan vacations months, if not years in advance. Let your users save their favorite flights, hotels, excursions, etc. to a wishlist. When it’s time to book, all their favorites will be easily accessible. If you have a user who can’t decide between Bermuda or the Bahamas, no worries. Add an option that lets users remove individual items from their list. Want to let your users compare vacation destinations? Limit the number of items that users can add to their wishlists and make comparisons easy for everyone.

Gift Registries. Let your users create shareable wishlists for their next big event. Think weddings, baby showers, birthdays, and more. Party planning is stressful. Make gift-giving fun (and effortless) for your users and their guests.

What are the benefits of a wishlist?

Let your users browse first, and buy later. Add a wishlist feature to your Webflow website to improve your user experience and connect with your customers. Keep reading for more key benefits. 

Complete design control. No cookie cutter wishlists here. With Jetboost, you have complete control over the look and feel of your user’s lists.

Enhance your user experience. What leads to abandoned eCommerce shopping carts? Frustrated consumers that give up and bounce. Make it easy for users to shop your store, save and share their favorites, and return to your website when they're ready to buy. A positive user experience will encourage brand loyalty. Keep your customers coming back for more!

Engage your customers. Wishlists give your users an interactive shopping experience. No mindless scrolling here. Showcase your most popular items so your users can see what other people are shopping for. You can even use Jetboost to show your users specific content, comparison tables, etc. all based on their behavior. Provide a high-tech, personalized shopping experience without writing any code. 

Boost social shares. Add an option for your users to share their wishlists on social media or via email. Make giving gifts simple for everyone. Not only is this a bonus feature for your user, but it’s also free advertising for your website. Increased traffic to your website is never a bad thing.

Improve your inventory. Jetboost tracks every time a user saves an item to a wishlist. This data is then saved to your Webflow CMS. You’ll be able to see what's popular and what’s not. Use this information to make knowledgeable inventory decisions based on user feedback.  

Increase your conversion rate. Increase your sales with user-friendly shopping, increased social shares, and user-driven inventory decisions. You can also use wishlists to guide marketing campaigns. Notice that a specific product is trending? Add free shipping or a discount on this product. Offer your most loyal customers benefits like selective sales or exclusive membership perks. 

How do I add a Webflow wishlist to my website?

Use our powerful CMS Item Favoriting Booster and “Favorites List” Power Up to add a wishlist feature to your website. No need for messy integrations or complicated code. 

Add as much customization to your Webflow wishlist as you want! Follow the steps below to add this dynamic booster to your Webflow website. Note, although this power up references “favorites”, we are going to use it to add a wishlist to our eCommerce store. 

Step 1: Set up your Jetboost account. 

If you’re not already a Jetboost user, sign-up for Jetboost for free here. Add your Webflow account to Jetboost. All set! You’re ready to start adding boosters. 

Step 2: Add the CMS Item Favoriting Booster to your Webflow website.

Follow the step-by-step instructions to add this booster to your website. Need more help? Check out our video tutorial or how-to article. 

Note: Instead of styling this booster as a “Favorites Button,” style it as a “Wishlist Button.” Change the text, images, etc. For example, try the phrases “save to wishlist” and “saved.” Use your design creativity!  

Step 3: Add the Favorites List Power Up. 

On your Jetboost dashboard, click “Power Ups” and add the “Favorites List” Power Up. 

Step 4: Create a Wishlist Div Block. 

Add a new “wishlist” div block to your website. It can be on a new page or the same page as your Wishlist Button. For most use cases, we suggest using a new page. Copy the provided Jetboost class, and add it to the div block. This is where your user’s wishlist will display.

Important: Only add the below contents to your Wishlist Div Block. If you’d like to add a title, extra text or images, etc., add this information outside the Wishlist Div Block.

Step 5: Create your Wishlist Collection List.

Inside your Wishlist Div Block, add a Collection List. Connect it to the Collection List you added to the CMS Item Favoriting Booster.

Inside the Collection Item, add the content that you want your user to see on their wishlist. For example, product image, name, and price.

Hide the Collection List Wrapper when you’re done styling it.‍

Pro Tip: When hiding elements in Webflow, add a “hidden” class to the element before you hide the element.

Step 6: Add the Jetboost Collection Item Embed. 

Add an Embed element inside of your Collection Item. Add the provided Jetboost code to the Embed element. Click “save & close.”

Step 7: Optional: Display Content when the Wishlist is Empty

What if your users haven’t added any items to their wishlists? Add a child div block to your Wishlist Div Block. The contents of this child div block will appear if your user’s wishlist is empty. Be sure to hide the div block once you’ve added content.      

Step 8: Optional: Create a Loading Div Block.

Are you concerned that your users will worry if their wishlist is slow to load? No problem. Simply add a 2nd child div block to your Wishlist Div Block. The contents of this child div block will appear when your user’s wishlist is loading. This is especially helpful to add if you’re working with a very large Collection List.

Important: The child elements of your Wishlist Div Block must be in the order of Collection List Wrapper, Empty Wishlist Div Block, and Loading Div Block. Of course, feel free to use different names than these.

Step 9: Wishes accomplished. 

That’s it! Re-publish your website with your new wishlist feature. Let your users know that they can now add items to their wishlists!

Prefer video format? Check out our video tutorial below.

You can also try our live demo where you can test our wishlist feature at our pricey (yet fictitious) eCommerce furniture store. 

Curious about what else our CMS Item Favoriting Booster can do for you? Let users add reactions to your blog posts, save their favorite content to a favorites list, provide valuable feedback on your content, and so much more.

We've designed all Jetboost boosters to work together. Combine our Webflow wishlist feature with the Dynamic Filtering Booster to create beautiful, user-friendly content directories. Ready to get started? Try Jetboost for free here!   

Answer User Wishes with a Webflow Wishlist

What’s good for your users is good for business. Increase your customer engagement (and satisfaction) with Webflow wishlists. Use Jetboost’s CMS Item Favoriting Booster to design and style your wishlist to integrate seamlessly with your existing user interface. Use any Webflow button design with Jetboost. Let us help you improve your user's shopping experience today. Happy shopping!

‍