How to Add Favicon to Weebly Website

Home/Beginners Guide, Tutorials, Weebly Video Tutorials/How to Add Favicon to Weebly Website

How to Add Favicon to Weebly Website

Favicon is a small image (like a logo in this case) shown in the address bar of the web browser besides the URL or just on the corner of the browser’s tab. This is a Pro feature in Weebly. You may want to follow the steps listed below to easily add a favicon to even a free Weebly website without upgrading to Pro account.

Add Favicon to a Weebly Website with Paid Subscription



If your site is upgraded to one of the paid subscriptions, you can do this very easily. To learn how to so and add a favicon to your own Weebly website, watch the short video. If you haven’t upgraded to any paid subscriptions, then read the article that follows it.

Add Favicon to a Free Weebly Website

Step 1: You need to have a logo image before adding a favicon to your site. Your logo can be in any standard image format like JPEG and PNG. Once your logo is ready then you can use any of the free favicon generators available on the web to convert it into a .ico file.

One such a favicon generator is “freefavicon.com”. Browse the site and select your desired image to convert it into a .ico file.Download then the “favicon.ico” file.

Step 2: We’re going now to upload our favicon. Well, after you have your .ico file, go to your Weebly account and edit the site you want to add a favicon. Select “Edit HTML/CSS” under “Theme” tab in Weebly editor. Click then on the “+” icon next to “Assets”, select “Upload File(s)” option from the dropdown and upload your favicon.ico file. Also, make sure to upload a png the same name as your ico such as favicon.png and favicon.ico – upload them to the same folder or root.

Uploading Favicon in Free Weebly Site

When you upload the png right click it and copy image address. Copy it then into notepad and change .png to .ico then copy it with the .ico at the end. Afterward, use that as your link in the header section like explaining below in step 3.

Step 3: We’re going now to link the favicon to your website. Follow these steps to do so: Go to “Settings > Search engine optimization > Header code” and paste the following code:

<link rel=”shortcut icon” href=”Your Favicon Link”/>

favicon Weebly

Replace “Your Favicon Link” with the URL of your favicon.

There you go! Save your settings and publish your site.

By | 2017-09-14T17:56:08+00:00 June 19th, 2017|Beginners Guide, Tutorials, Weebly Video Tutorials|0 Comments

Your time was just wasted by:

Editorial Staff at WeeblyTutorials is a team of Weebly experts.

Leave A Comment