Adding a favicon to a page in RSD

Jun 30th, 2016 at 04:52 PM
User 2054785 Photo

Steven Stewart
Registered User
23 posts

I'm a RSD newbie coming from VSD, and I'm really enjoying the program so far. I'm trying to figure out how exactly to add a favicon script onto a page. Where exactly do you place the code? Thanks in advance!
Jun 30th, 2016 at 04:54 PM
User 103173 Photo

Scott Swedorski
VP of Software Development
0 posts

You can associate an favicon in RSD by add this markup to Settings > Head box. Then include that image under the Resources.

<link rel="shortcut icon" href="/favicon.ico">
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
Jun 30th, 2016 at 06:04 PM
User 2088758 Photo

Steve
Senior Advisor
3,121 posts

Correct me if I'm wrong but by default don't most browsers pick up the favicon without adding any markup at all. Just store the file on the root of your directory where your website is?
Taking over the world one website at a time!

Steve Kolish
www.misterwebguy.com

YouTube Channel:
https://www.youtube.com/channel/UCL8qVv … ttneYaMSJA
Jun 30th, 2016 at 06:27 PM
User 103173 Photo

Scott Swedorski
VP of Software Development
0 posts

Only if you use favicon.ico and put it in the root folder. If you want to use a different image format or path, the markup is needed.

Still, it is good to always use the markup.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
Jun 30th, 2016 at 06:37 PM
User 2484360 Photo

Adam East
Registered User
3,293 posts

Steve wrote:
Correct me if I'm wrong but by default don't most browsers pick up the favicon without adding any markup at all. Just store the file on the root of your directory where your website is?


It is recommend that you do add the link rel attribute value and not simply add the .ico image to your root.

You can learn more about that here http://www.w3.org/2005/10/howto-favicon
Jul 2nd, 2016 at 11:22 AM
User 2823310 Photo

Alter Eagle
Registered User
312 posts

A little bonus there for a iOS phone icon is make a .png 180x180 name it apple-touch-icon.png and attach it to the root folder with your favicon.ico image. Then put this in the HEAD below your favicon links.
<link rel="apple-touch-icon" href="apple-touch-icon.png">

I use this for example:
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" href="apple-touch-icon.png">


Now you'll get an icon in your apple phone and your browser.
Alter Eagle Mantel & Carpentry
Alter Eagle Construction
STEP BY STEP TUTORIALS for RSD FOUNDATION
Jul 14th, 2016 at 12:10 PM
User 2054785 Photo

Steven Stewart
Registered User
23 posts

Awesome! Thanks guys!

Edit - after trying this, I seem to be unable to add the file into as a resource into the Head box. It only allows me to select folders and not single files. How do I add a single file?
Jul 14th, 2016 at 12:31 PM
User 2054785 Photo

Steven Stewart
Registered User
23 posts

It works perfectly. Thanks!
Apr 21st, 2017 at 01:08 PM
User 458539 Photo

Byron Tipping
Registered User
1,647 posts

What format should the favicon be if you place it in the resources folder?

<link rel="shortcut icon" href="/favicon.ico">

What is .ico?

Dumb question I know but

Byron
Apr 21st, 2017 at 01:20 PM
User 2147646 Photo

jamo
Registered User
233 posts

I use IcoFX but there are many online converters https://www.google.ie/search?q=.ico+con … mp;oq=.ico

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.