Why isn't my favicon displaying on all pages?

loveartesia · ‎12-19-2023

I've uploaded my favicon into my theme settings but it only shows on certain pages. How do I fix it to show on all?

PageFly-Richard · ‎12-19-2023

This is Richard from PageFly - Shopify Page Builder App

Please navigate to theme.liquid file and check if the favicon code has been added to your theme.
You can also add a favicon manually

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: Add this code under <head> and make sure you put the link of the image into the code like this

<link rel="shortcut icon" href="{{ 'https://cdn.shopify.com/s/files/1/0615/5462/2723/files/Support.webp?v=1701392184' }}" type="image/png" />

Hope this can help you solve the issue

Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!

➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)

All features are available from Free plan. Live Chat Support is available 24/7.

loveartesia · ‎12-19-2023

Hi Richard!

I added the code. Thank you!

It still only showing on certain pages within Safari. I just checked with Chrome and it shows on all - guess it may be my browser.

PageFly-Richard · ‎12-19-2023

The favicon displayed on a Safari tab is managed differently. This requires the use of HTML code for the Apple mask-icon for Safari Pinned Tabs. Consequently, this requires the editing the following code below:

<link rel="mask-icon" href="{{ 'https://cdn.shopify.com/s/files/1/0615/5462/2723/files/Support.webp?v=1701392184' }}"
color="#000000">

<link rel="shortcut icon" href="{{ 'https://cdn.shopify.com/s/files/1/0615/5462/2723/files/Support.webp?v=1701392184' }}" type="image/png" />

Please make sure you will change the link of the image too.

Please let me know if it works by giving it a Like or marking it as a solution!

➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)

All features are available from Free plan. Live Chat Support is available 24/7.

loveartesia · ‎12-19-2023

Do I place this code in the place as the one above?

Also, please remind me where to find the links to the photos again.

PageFly-Richard · ‎12-19-2023

Hi @loveartesia You can upload the image that you want it to display to Shopify > content then hit copy link button at the end of the image

Please let me know if it works by giving it a Like or marking it as a solution!

➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)

All features are available from Free plan. Live Chat Support is available 24/7.

loveartesia · ‎12-20-2023

Okay! I've uploaded the code- but its still not working on some pages.

Pages not working: https://pharmdschoolofwigs.com/products/1on1-100-glueless-hands-on-class-2-day-class-cyber-monday-de...

https://pharmdschoolofwigs.com/products/1on1-100-glueless-hands-on-class-2-day-class-cyber-monday-de...

https://pharmdschoolofwigs.com/policies/terms-of-service

PageFly-Richard · ‎12-21-2023

Safari uses "apple-touch-icon" and not just "icon". Also, you will have to specify the icon for all Apple devices if you want it to show up in all of them.

Please try this above the code you added with your link

<link rel="apple-touch-icon" href="{{ link img here }}">

Please let me know if it works by giving it a Like or marking it as a solution!

➜ Optimize your Shopify store with PageFly Page Builder (Free plan available)

All features are available from Free plan. Live Chat Support is available 24/7.

Why isn't my favicon displaying on all pages?

Why isn't my favicon displaying on all pages?

Community Blog Articles