Icons | Styling & Layout
This article explains how to manage icons for your mailings and website.
Social Media Icons
All social media icons will be automatically shown in the last column of your website footer after the social media URLs are configured in your “Social links” field in Control Panel > Core.
Almost all known social media icons can be used. Just fill in the correct URL, and the code will do the rest.
The default social media icons all feature a circle with the icon inside. Default and roll-over colours are automatically applied from the website CSS to reflect the rest of your website styling:
Upon request, it is also possible to use a different icon set without the circles:
Your design team can also create a truly custom icon set. Peppered can help to convert the design into a usable .svg file, or your design team can make the .svg file. The file should contain all icons with their exact names, but the design can be anything you want. We provide a template .svg file for you to download at the bottom of this article.
More information about the website footer can be found in the website footer article (NOTE: add link to page in Notion once it has been created!).
Social Media Icons in your Mailing Templates
Our Professional Services team will configure these.
Story Types
Upload a png-file for each story type in your Story type module:
An example of what it might look like:
Genres & Tags
Icons can be added by using the [font fantastic four icon codes (Font Awesome Icons) in the name of the genre, for example:
comedy will add a tag icon in front of the name “comedy”.
Other Icons
Please use these only for light lists, anything in detail should use section titles to break out content.
Several website icons can be changed by uploading a new .svg file in the Dashboard > Core section. These icons include:
- avatar (My Account icon)
- cart (The Shopping cart icon)
- search (Search icon)
- x (For closing search box, etc)
- empty list (When no items were found during the search or a calendar filter)