Logo & Favicon

You can choose to keep your Logo as text, or upload your logo image. The favicon is the small icon that shows in the browser bar. It's best to keep the favicon a simple image with high contrast as it'll show better in the browser as it's a very small icon. If your logo contains text, perhaps create a favicon of a two letter abbreviation of your site name, or just the first letter.

For the below tutorials edit the theme where you want to add your logo and favicon. Note that you need to have cloned the default theme as it cannot be edited.

Adding a Logo

When in the edit screen, scroll down to "Brand Logo" and drag and drop a logo image, we use SVG images, but you can use any of the accepted formats (SVG, PNG, JPG, GIF). The recommended sizes are either 144 x 32 or 800 x 400. Note that you can also click to upload an image instead of using the drag and drop method.

Under the logo is a Logo height slider bar. You can change the height of the logo by sliding the bar. The size can be reverted to default by clicking the Reset to Default button next to the slider.

Removing a Logo

To remove a logo, click the Remove Logo button. You can then either upload a new logo, or not use a logo and just use the text site name.

Adding a Favicon

When in the edit screen, scroll down to "Favicon" and drag and drop a favicon image, we use SVG images, but you can use any of the accepted formats (ICO, SVG, PNG, JPG).

Upload one square master of at least 512x512. The sizes browsers, iOS and Android each need (16, 32, 180, 192 and 512) are generated from it. ICO and SVG files are kept exactly as uploaded. Add a dark variant if your icon disappears against a dark browser tab; leave it empty to use the same icon everywhere.

Removing a Favicon

To remove a favicon, click the Remove Favicon button. You can then either upload a new favicon, or not use one.

When done, be sure to save the settings by clicking Save Changes at the top of the page.