Header Logo and Favicon

Learn how to change your store's branding and favicon imagery.
Written by Jonathan Diaz
Updated 10 months ago

Here you will be able to change the stock Shoptimized branding for your own logos and favicon imagery

8 STEPS


1 The first step is to open your theme settings area of your Shopify theme config and go into the Header- Logo and Favicon section.

Step 1 image

2 Now click Use custom logo to enable it.

Step 2 image

3 Now Click Replace to upload or change Logo.

Step 3 image

4 Now Enter logo max width.

Step 4 image

5 Now click Use custom icon to use custom favicon icon.

Step 5 image

6 From here you can upload / change favicon icon.

Step 6 image

7 Custom shoptimized logo.

Step 7 image

8 Now click save to your theme config and preview your changes.

Step 8 image

Here's an interactive tutorial for the visual learners

https://www.iorad.com/player/1573140/Header-Logo-and-Favicon

Use Custom Logo: Keep this selected to use your own custom logo.

Custom Logo: Select the logo image you wish to use in your store. (Be sure to use a transparent PNG for this)

Max Logo Width: Allows you to set the width of your logo. We suggest no greater than 245 pixels wide.

Mobile Logo: Select your mobile-optimized logo for use here. We suggest the following dimensions: 600 pixels wide and 180 pixels high.

Favicon: A favicon is a small 16×16 pixel version of your icon. It’s how a browser displays your logo in the top left corner of a browser. If someone saves your website on their phone, it will also show your logo, so it’s important! Don’t leave this out.

Did this answer your question?