Header Logo and Favicon

Learn how to change your store's branding and favicon imagery.
Written by Jonathan Diaz
Updated 7 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?