Community Favicon & Browser Tab Name

  • 1
  • Question
  • Updated 3 years ago
  • Answered
I'm working on improving a visualforce community.

1. Currently the favicon is just the cloud part of the Salesforce logo. I would like to change that somehow. I uploaded an icon as a Salesforce static resource. But it doesn't seem to be working. Can this be done through Skuid?

2. Since implementing a custom header, the browser tab names just display the url of the page. Which is kind of ugly. Previously it displayed the name of the community.

Anyone know how to fix this? Thanks!
Photo of Ryan Denis

Ryan Denis

  • 478 Points 250 badge 2x thumb

Posted 3 years ago

  • 1
Photo of mB Roman Melnik

mB Roman Melnik

  • 2,802 Points 2k badge 2x thumb
Hey Ryan,

For #2: you can set the browser tab names by adding <apex:page title="YourTabTitle" on the Visualforce Page itself. See this for guidance: http://help.skuidify.com/m/page-assignments-and-overrides/l/201793-using-the-skuid-page-visualforce-...

As for #1: That's a good point. I'm building a community myself at the moment and would want to brand the favicon. Not sure how to do this. But my current guess would be that it's something we could set in the Visualforce Page as well.
Photo of Ryan Denis

Ryan Denis

  • 478 Points 250 badge 2x thumb
The favicon works as well now on pages where I am not utilizing a custom header. But still no luck where I am using the new header.

Not sure if it has to do with the disabling the Salesforce header, or because these are child pages. I created a parent page with just the skuid header, and every other page in the community is a child page. I tried adding title="OODA Risk" to the visualforce page but no change. 

Photo of mB Pat Vachon

mB Pat Vachon, Champion

  • 42,714 Points 20k badge 2x thumb
Just came across this as well and wanted to use my own icon. You could do this from the master skuid page using javascript.



(function(skuid){
	var $ = skuid.$;
	$(document.body).one('pageload',function(){
        var link = document.createElement('link');
        link.type = 'image/x-icon';
        link.rel = 'shortcut icon';
        link.href = 'http://www.mblazonry.com/wp-content/uploads/2016/03/mblazonry_logo_only_favicon.ico';
        document.getElementsByTagName('head')[0].appendChild(link);
	});
})(skuid);
Photo of mB Roman Melnik

mB Roman Melnik

  • 2,802 Points 2k badge 2x thumb
Awesome, thanks for sharing this snippet Pat.

Just to be clear though, my understanding is that if you want to override the SF Cloud Favicon on a Community, you MUST use a custom https:// domain (meaning you'll need an SSL certificate on the custom domain that you're using for your community).

I have tried to update the favicon on my Community with no luck because I'm waiting for approval to buy an SSL cert for our custom domain.

But nonetheless, I'll be using this snippet once we get that certificate, so thanks for sharing Pat.

My guess is you're using this for your actual SF org, and not a community, correct?
Photo of mB Pat Vachon

mB Pat Vachon, Champion

  • 42,714 Points 20k badge 2x thumb
Correct. Using on my production org.