Your wishlist page is often the last stop for a customer before they decide to buy. If that page looks like a generic plugin that clashes with your carefully chosen brand colors and fonts, it can create a “disconnect” that hurts trust.
Until now, the wishlist page used a default blue color scheme that didn’t always play nice with every WordPress theme. With the new Wishlist Page Style Customization feature, those days are over. You now have total creative control over the typography and colors of your wishlist, ensuring a seamless, high-end experience for your shoppers.
By the end of this guide, you’ll have a professional, on-brand wishlist page that looks like it was custom-coded specifically for your theme.
Why Customize Your Wishlist Page?
Consistency is king in eCommerce. When your SaveTo Wishlist page carries the same DNA as your homepage using your brand’s specific shades and font scales, it feels like a native part of your store.
This update moves away from “one-size-fits-all” styling and gives you a dedicated toolkit to adjust headings, tables, and buttons. Whether your brand is bold and vibrant or clean and minimal, you can now reflect that identity effortlessly.
💡 Note:
These settings specifically affect the main Wishlist Page (where customers view their saved items) rather than the “Add to Wishlist” buttons found on product pages.
🔗 External Resource:
If you are unsure about which colors to use, we recommend checking out Adobe Color for accessible palette inspiration.
Step-by-Step: Designing Your Custom Wishlist Page
1. Locate the Style Settings
All your design tools are grouped together for easy access.
- Go to SaveTo Wishlist → Settings.
- Click on the Wishlist Page tab and scroll down to the Styles section.
2. Customizing Headings and Titles
The heading is the first thing a user sees. Make it stand out:
- Heading Title: Adjust the Font Size and Color to match your site’s main H1 or H2 tags.
- Heading Text: Control the sub-text or description area to ensure it’s legible and matches your brand’s body font color.
3. Styling the Wishlist Table
This is where the product data lives. You can now fine-tune the “technical” look of the list:
- Table Columns: Change the text size for headers like “Product Name” or “Unit Price.”
- Table Rows: Adjust the font size of the item details within the list for better readability on desktop and mobile.
4. Designing the Popup Modal
If you use the Popup action, ensure the window matches your site’s aesthetic:
- Popup Header: Set your Title Size and Title Color.
- Body Text: Use the Popup Text Size and Color controls to ensure instructions are clear.
- Action Buttons: Use the color pickers for Save and Cancel buttons.
- Tip: Set your “Save” button to your primary brand color to encourage the user to complete the action.
5. Creating High-Conversion Buttons
Buttons are your primary Call to Action (CTA). Here is how to make them pop:
- Button Background: Change the default blue to your primary brand color.
- Button Text Color: Ensure there is high contrast (e.g., white text on a dark background) by selecting a custom color.
- Button Font Size: Make your “Add to Cart” or “Share” buttons larger or smaller to fit your design language.
6. Preview and Save
- Always click Save Settings at the bottom of the page.
- Open your wishlist page in a new incognito window to see the changes exactly as your customers will.
✨ Bonus Tip: Matching Your Wishlist Links
By default, the links on your Wishlist page (like product titles) usually inherit your theme’s global link settings. If you want to change these colors to better match your new button styles, you can typically find these settings in your WordPress Dashboard under Appearance → Customize → Typography → Link / Accent Color.
💡 Note:
Every theme is built differently! Depending on which theme you have installed, this setting might also be located under “Global Colors” or “Button & Link Styles.”
Before & After: Matching the Wishlist Page to Your Branding
Below is a before-and-after comparison showing how the wishlist page can be customized to better match your store’s theme.
Troubleshooting Your Design
⚠︎ My changes aren’t showing up on the site.
This is almost always due to caching. If you use a plugin like WP Rocket, LiteSpeed Cache, or a CDN like Cloudflare, make sure to Clear/Purge Cache after saving your styles. You can also refer to the official WooCommerce guide on caching.
⚠︎ The font style doesn’t match my theme exactly.
The plugin uses your theme’s inherited font family by default. These settings allow you to change the size and color. If the font family itself looks wrong, ensure your theme’s global CSS is loading correctly.
⚠︎ The colors look different on mobile.
Check if your phone has “Dark Mode” enabled, as some browsers try to invert colors automatically. Our style settings provide a hard-coded CSS variable that should override most browser defaults.
FAQ
➤ Do I need to know CSS to change these colors?
Not at all! We’ve built a user-friendly interface with color pickers and sliders, so you never have to touch a line of code.
➤ Will these settings slow down my page?
No. We use modern CSS variables that are extremely lightweight and load instantly alongside your theme.
Build a Branded Wishlist Experience for Your Store
You’ve successfully moved away from the “default blue” and created a branded experience. A professional-looking wishlist page encourages customers to return and eventually complete their purchase.
Why stop at colors? Now that your page looks great, go to the Settings → Guest Options tab and enable this feature so guests can start making wishlists too!
Help & Support
We have a dedicated support team for SaveTo Wishlist Pro for WooCommerce who know our products, WooCommerce, and the industry very well. You’re welcome to make use of their expertise at any time, worldwide.
If you would like to know more about this plugin or find any issues with it, please go to the support ticket request form and send us a message.
