Appearance
Custom Code
Add your own CSS or JavaScript to fine-tune the wishlist's appearance or behavior beyond the built-in settings.
Overview
For merchants who want more control than the standard settings allow, Custom Code lets you add raw CSS and JavaScript that runs on every storefront page where the wishlist appears. This is an advanced, optional feature intended for merchants comfortable with code, or their developers.
Benefits
- Fine-tune styling details the visual settings don't cover
- Add custom behavior or integrations without waiting on a feature request
- Applies automatically across your whole store, wherever the wishlist runs
Where to Find It
Apps ↓ BRIX: Wishlist Plus ↓ Settings ↓ Features tab ↓ Custom code ↓ Customize
How to Use
- Open the app and go to Settings.
- Find Custom code under the Features tab.
- Click Customize to open the Custom Code editor.
- Switch between the Custom CSS and Custom JavaScript tabs.
- Enter your code in the editor.
- Click Save.
Available Settings
| Setting | Description | Default |
|---|---|---|
| Custom CSS | Additional CSS applied wherever the wishlist appears on your storefront | Empty |
| Custom JavaScript | Additional JavaScript that runs wherever the wishlist appears on your storefront | Empty |
Best Practices
- Test changes on a duplicate/draft theme first if you're unsure how a change will affect your live store.
- Keep custom CSS scoped to wishlist-specific class names to avoid unintentionally affecting the rest of your theme.
- Avoid loading external scripts you don't control from custom JavaScript, since they run directly on your storefront.
Notes
- This feature has no on/off toggle — it's always available, and simply does nothing if left empty.
- Custom code is not translated, versioned, or validated by the app. Errors in your code can affect how the wishlist displays or functions, so change with care.
- This feature is intended for merchants with coding experience or a developer's help. The app's support team can't debug custom code you've written.
Troubleshooting
My custom CSS/JavaScript isn't taking effect. Confirm you clicked Save, and that the theme app embed is enabled — see Installation. Also check for typos or syntax errors in your code.
The wishlist broke after I added custom code. Remove or comment out the code you added, save, and confirm the wishlist returns to normal. Then reintroduce your changes gradually to isolate the issue.