Advanced Feed Customization

Lisa Fockens Updated by Lisa Fockens

At this time, the Advance Feed Customization feature is enabled on a per-merchant basis. If you'd like this feature so that you can pursue deeper customization, simply reach out to our team and we'll enable it on your account.

Advanced Feed Customization

The Advanced Feed Customization feature is for shops that require a more bespoke look and feel for their feed. This gives greater control over many of the UI elements that make up the default Wisp feed through simple CSS.

Wisp provides its own style sheet to render the iframe. The Advanced Feed Customization fields allow you to alter the existing classes to better suit your websites design. This means that the associated styles for any declared CSS class can be changed, reduced, or added to until you achieve the results you want.

How to use the Advanced Feed Customization

Since Wisp provides its own stylesheet, the scope of customization is bound by existing declared classes. To find the Wisp stylesheets you'll want to use the website inspecting tools from your favourite browser. When inspecting the feed, you'll be able to access the stylesheet in full, or selectively by zeroing in on specific elements of interest.

While you're inspecting, it's worthwhile to take some time to understand the html structure of the feed so that you can assess the impact or reach of any changes you wish to make. As with any website, several classes are reused and making changes might result in changes elsewhere, other than where you expect.

When you decide on changes you'd like to make, simply write the css in the field provided on Settings > Feed. As an example, try this and see what happens:

.Teaser {background: blue;}

Limitations of the Advanced Feed Customization Feature

Since Advanced Feed Customization relies exclusively on altering existing CSS classes, it's not possible to create new ones. As long as your imagination can be realized within the existing classes, you can build the experience you want!

How did we do?

Configure Custom Properties for notifications