Blog, Website & Page Publishing

shoon
Participant

Setting unique favicon to landing page

SOLVE

Hi all,

 

I want to set a unique favicon that is not the default brand favicon for a landing page. The theme I'm using is not a child theme, so I'm not able to make any edits on the files themselves. Is there a way for that landing page to show its own favicon?

0 Upvotes
1 Accepted solution
Jnix284
Solution
Hall of Famer

Setting unique favicon to landing page

SOLVE

Hi @shoon happy to help with overwriting the favicon for a landing page, this will only work if you have a paid subscription as you will need access to the landing page head HTML in the page settings.

 

1 - open the landing page, the click Settings > Advanced

Jnix284_0-1727392722630.png

 

2 - in the Head HTML box, add the code below

Jnix284_1-1727392750134.png

 

<link rel="icon" type="image/x-icon" href="/images/favicon.ico">

 

It should look like this:

Jnix284_2-1727392789967.png

 

3 - replace the /images/favicon.ico with the URL to your favicon file (ideally saved in your HubSpot Files directory), make sure you keep the quotes, so it still looks similar to this:

 

"https://45340635.fs1.hubspotusercontent-na1.net/hubfs/45340635/updated-file-folder/website/favicon.i..."

 

Because this code is inline on the page, it should overwrite the global favicon. If it doesn't, let me know and we can try another option.

 


If my reply answered your question please mark it as a solution to make it easier for others to find.


Jennifer Nixon

View solution in original post

5 Replies 5
Jnix284
Solution
Hall of Famer

Setting unique favicon to landing page

SOLVE

Hi @shoon happy to help with overwriting the favicon for a landing page, this will only work if you have a paid subscription as you will need access to the landing page head HTML in the page settings.

 

1 - open the landing page, the click Settings > Advanced

Jnix284_0-1727392722630.png

 

2 - in the Head HTML box, add the code below

Jnix284_1-1727392750134.png

 

<link rel="icon" type="image/x-icon" href="/images/favicon.ico">

 

It should look like this:

Jnix284_2-1727392789967.png

 

3 - replace the /images/favicon.ico with the URL to your favicon file (ideally saved in your HubSpot Files directory), make sure you keep the quotes, so it still looks similar to this:

 

"https://45340635.fs1.hubspotusercontent-na1.net/hubfs/45340635/updated-file-folder/website/favicon.i..."

 

Because this code is inline on the page, it should overwrite the global favicon. If it doesn't, let me know and we can try another option.

 


If my reply answered your question please mark it as a solution to make it easier for others to find.


Jennifer Nixon
shoon
Participant

Setting unique favicon to landing page

SOLVE

Hi Jennifer,

Thank you for your suggestion! I added the code snippet to the Head HTML box as shown below and updated, but it's still showing the default favicon. Seems to be the same result after a couple of hours and on incognito. 

Screenshot 2024-10-03 at 1.21.31 PM.png

 

If you can think of any other suggestions I can try, I'd appreciate it!

0 Upvotes
Jnix284
Hall of Famer

Setting unique favicon to landing page

SOLVE

Hi @shoon thanks for testing this out, I'm sorry it didn't work. Favicons are set in brand kits and while it allows you to set more than one:

Screenshot 2024-10-04 at 7.55.58 AM.png


It doesn't give you the option to select a favicon outside of the code for the theme itself. Maybe instead of trying to overwrite the file inline, we need to change where it's pointing to initially - @Anton any ideas to overwrite a favicon for a single landing page by using an alternate favicon from the brandkit?


If my reply answered your question please mark it as a solution to make it easier for others to find.


Jennifer Nixon
0 Upvotes
shoon
Participant

Setting unique favicon to landing page

SOLVE

Thanks, Jennifer. I also found this solution, but HubSpot must've made an update since it's no longer allowing me to remove the default favicon once it's set. 

Jnix284
Hall of Famer

Setting unique favicon to landing page

SOLVE

@shoon That's the same problem I ran into (not being able to remove the default or save without a favicon), I was hoping it would still work even with the default.


If my reply answered your question please mark it as a solution to make it easier for others to find.


Jennifer Nixon
0 Upvotes