Heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Heading

Heading

Text Link

Branding With a Shopify Favicon

Looking at all the things you have to do to get your Shopify store up and running, small things like adding a favicon might not seem that important.

In reality, however, adding a favicon to your Shopify store, should be one of the first things you do.

It only takes a few seconds and can actually have an impact.

What is a Favicon?

A so-called “favicon” is the combination of the words “favorite” and “icon”.

You probably already saw it thousands of times on a lot of websites. This small icon appears in the browser and in the bookmarks.

If you’re not adding a favicon, this is how your store will appear:

Very boring. Like a rainy Monday morning.

But except from the style, there are other reasons why you should add a favicon to your Shopify store.

The Purpose of a Favicon

Your Shopify store should have a favicon for two reasons:

  1. Easy navigation between browser tabs
  2. Branding

I bet you’re familiar with the following browser tab view:

Way too many tabs. But because of the favicons you’re able to spot the right tab whenever you need it.

Imagine it would look like this:

It will take you ages to find the site you’re looking for.

By adding a favicon to Shopify, your customers are able to easily navigate between multiple tabs. Don’t make it necessarily hard for them to spot your online store.

But there’s one more reason: branding.

A favicon is indeed just a small image, but it’s part of your brand.

Imagine this:

Which brand do you think has won the branding contest here?

That’s right: Shopify.

Not because they have the strongest branding but just because they added a favicon.

In a world of laziness the chances are high that some of your competitors (especially the smaller ones) forgot about their favicons. That’s your chance.

How to Create a Favicon For Shopify

Creating a favicon is fairly simple. But before we do this together, you should know the following:

The perfect size for a favicon is 16x16 pixels, or 32x32 pixels. 

If you’re uploading an icon that has larger dimensions, Shopify will automatically reduce it for you. In some cases, this can transform your image so your customers can’t really see what’s on it. So better make sure your icon size fits to the dimensions above.

In order to create a favicon, this is what you can do:

  • Take your logo and shrink it down to the dimensions above
  • Use a free design tool (like Canva) and create one
  • Download our free Shopify favicon bundle and use one of those

If you already have a logo, you can use a free tool like this to turn it into a favicon.

Enter your first name and email below and download the Shopify favicon bundle:

How to Add Your Shopify Favicon

In Shopify, you have two options to add a favicon.

Most Shopify themes allow you to add your favicon straight from the theme editor. This is the most simple way. Here’s how to do this:

In Shopify, click on “Online Store” on the left side. Below “Sales Channels”.

On the next page, look for the “Cutomize” button and click on on it.

Now you’re in the theme editor.

Scroll down to the bottom of the left sidebar. This is where you will find the section “Theme settings”. Click on it.

In your theme settings, choose the option “Favicon”.

All you have to do now is to click on “Select Image” and upload your favicon from your computer.

If you’re happy with your favicon, just click on the “Save” button in the top right corner and you’re done.

Your favicon is now active and your customers can see it.

If you’re working with a theme that doesn’t support the function from above, here’s how you can add your favicon directly to the code of your theme.

In Shopify, go to “Themes”, click on “Actions” and choose “Edit code”.

Scroll down to the “Assets” section and click on “Add a new asset”.

Click on “Choose file” and upload your favicon.

When doing it that way, make sure that the name of your favicon is “favicon.png” (obviously, the file format has to be .png).

You now know everything you need to know about the Shopify favicon.

It only takes a couple of seconds to set it up and should be one of the next things you do.

Want to get free favicon templates? Sign up below and download 10+ free favicons for your Shopify store.