Using the wishlist
Shortlist is a free WooCommerce wishlist plugin. It adds an Add to wishlist button to the shop loop and product pages, a Wishlist tab in My Account and an optional wishlist page. Guests can save products too: their list is tied to a cookie and moves to their account when they log in.
This walkthrough takes a fresh install to a working wishlist: a button in your loops, a place for shoppers to view saved items, and guest lists that survive until login.
1. Turn it on and choose placements
Section titled “1. Turn it on and choose placements”Open the Shortlist menu, confirm Enable wishlist is on, and pick your placements, shop loop, single product page, My Account tab. Most stores enable all three. If you want logged-out shoppers to keep a list, leave Allow guests on; turn it off to send them to login instead. Remove when added to cart is off by default, so the list keeps everything until the shopper removes it; turn it on to drop a product (or the saved variation) from the list once it goes into the cart.
2. Set labels and the variation hint
Section titled “2. Set labels and the variation hint”Set the add and remove button labels to your store voice. Set the variation hint too, on variable products the button stays disabled with this hint until the shopper picks options, so they save the exact variation rather than the generic product.
3. Give the wishlist a home
Section titled “3. Give the wishlist a home”Shoppers need somewhere to view their list. You have two options that work together:
- The My Account > Wishlist tab (turn on the placement), optionally with a live item count next to the menu label.
- A dedicated wishlist page, pick an existing page from the dropdown, or click Create wishlist page to publish one with the
[shortlist]shortcode in a click.
4. Confirm on the storefront
Section titled “4. Confirm on the storefront”- Open Shop and click Add to wishlist on a simple product, the button toggles to the remove state and the change is announced via
aria-live. Every button for that product on the page stays in sync. - Open a variable product, the button shows your hint and stays disabled until options are picked, then saves that variation.
- Open the My Account tab or the dedicated page, saved items appear in the grid with the columns you enabled.
5. Test the guest merge
Section titled “5. Test the guest merge”If guests are allowed, log out, save a product, then log back in. The guest list, tied to the shortlist_session cookie (valid for six months), merges into the account automatically, there is no manual import step for shoppers. The merge also runs when a guest registers during checkout, since it hooks the moment WordPress sets the login cookie.
Shortcode and block
Section titled “Shortcode and block”Show the current shopper’s list anywhere with the shortcode:
[shortlist]It takes no attributes, there is no per-list ID; it always renders the viewing shopper’s own list. The Shortlist Wishlist block (shortlist/wishlist) produces the same server-rendered output in the block editor, so the editor preview matches the front end. If your dedicated page already contains [shortlist], turn off Show list on page so the grid is not output twice.
For a header icon, use [shortlist_count]. It prints a heart link with a count badge. The link goes to the dedicated wishlist page when one is set and published, otherwise to the My Account wishlist tab. The count is fetched over AJAX for the current visitor, so it stays correct on cached pages.
How the toggle behaves
Section titled “How the toggle behaves”A click posts the product ID to admin-ajax.php (action shortlist_wishlist_toggle, guarded by the shortlist_wishlist nonce); the server adds or removes the row and returns the new state, label and saved-item count. Logged-in customers are keyed by their user ID; guests by the session cookie. The button is disabled and marked aria-busy while the request is in flight, so a double-click cannot submit twice. The toggle is a real <button> with aria-pressed, and because the script matches on the product ID, every button for that product on the page (a loop card and the single-product button, say) flips together after one toggle. If guests are not allowed, an anonymous click instead sends the visitor to the login page.
On a variable product the button starts disabled. Shortlist loads WooCommerce’s own wc-add-to-cart-variation script and listens (through jQuery) for its found_variation / reset_data events: picking a valid variation enables the button and swaps in that variation’s ID; clearing the selection disables it again and shows the hint. This is the one place Shortlist relies on jQuery, the add/remove toggle itself is plain JavaScript.
Performance and accessibility notes
Section titled “Performance and accessibility notes”The add/remove toggle script is vanilla JavaScript, deferred and loaded in the footer, and uses event delegation so buttons rendered after page load (infinite scroll, quick-view, AJAX filters) keep working. The button reserves its space, so switching between the add and remove states never reflows the page, no Cumulative Layout Shift. Outcomes (added, removed, or an error) are announced through a polite aria-live region, the My Account count updates live without a reload, and an empty list shows a friendly state with a Browse products link rather than a blank panel. Shortlist’s stylesheet and script load on the shop, product, product-archive, account and dedicated-wishlist pages, and on any other page where [shortlist], [shortlist_count] or a block product button with the wishlist toggle renders.
Below the wishlist: quotes, waitlist and compare
Section titled “Below the wishlist: quotes, waitlist and compare”Partner plugins add their own controls to the wishlist, on the My Account wishlist tab and wherever [shortlist] renders:
- Quotlet: with Quotlet’s quote requests on and at least one quote product saved, a Request a quote for these items button sits under the wishlist grid. It adds only the quote products to the quote and opens the quote page. A note under it counts the saved items that are sold the usual way and stay out of the quote.
- Waitlist: an out-of-stock or backorder simple product shows Waitlist’s own sign-up form (email, consent, Join Waitlist) right on the wishlist. An out-of-stock variable product shows a Notify when available button that opens the product page, where the shopper picks a variation first.
- Versus: with two or more products saved, a Compare these button replaces the visitor’s comparison with the wishlist products and opens the comparison table.
How long does a guest wishlist last?
Section titled “How long does a guest wishlist last?”The guest list is tied to the shortlist_session cookie, which expires after six months. If the shopper clears cookies before logging in, that list is lost.
Why is the wishlist button greyed out on a variable product?
Section titled “Why is the wishlist button greyed out on a variable product?”It waits for a variation. Once the shopper picks all options the button turns on and saves that variation; clearing the selection disables it again and shows your variation hint.
Can I show a wishlist count in the site header?
Section titled “Can I show a wishlist count in the site header?”Yes. Add [shortlist_count] to a header template part or widget. It shows a heart icon with the number of saved items and links to the wishlist.
Does adding to cart remove the product from the wishlist?
Section titled “Does adding to cart remove the product from the wishlist?”Only with Remove when added to cart switched on. It is off by default.