Favicon

The small icon shown in the browsers in front of the URL is called a favicon. You can use your favicon by replacing the default favicon.ico icon with your own.

Standard method if you have access to the theme folder.

Typically, the favicon.ico file is located in your theme's folder, for example, in ../theme/(theme name)/pix/favicon.ico. Make sure to keep your favicon.ico file named "favicon.ico." If you are not using a standard theme, you will have to find the "favicon.ico" file that your custom theme uses.

• The change may not be noticeable because the previous image may be in the server or browser cache.

Tip: Favicon is not changing on your browser? Moodle cached the old one. Site Administration > Appearance > Themes > Theme settings > Theme designer mode check box and save. Then hit your browser's refresh button. You might want to uncheck the box after it works. You might also need to clear your Moodle's cache by going to Site Administration > Development > Purge caches > Purge all caches.

This Wikipedia article explains how favicons work and has some useful links to software you can use to create one. It also mentions some online utilities that can be used to convert pictures to the right format for use as a favicon.

Alternative method if you do not have access to the theme folder.

Many Moodle installations will not give you access to the theme folder to upload a favicon.ico file. If this is the case, you can still add a favicon by adding the icon on a publicly accessible site page and then using the Additional HTML settings to include a link to the icon.

1. Go to your Moodle sites home page and enable editing.
2. Click the Add a block link. In Boost, this is located in the right side drawer.
3. Choose Main Menu from the list of available blocks.
4. On the Main menu block, click Add an activity or resource then choose the Page resource.
5. Name this page something relevant, such as Resources or Icons and give it a relevant description if you wish.
6. Add your favicon.ico file to the content section of this page then click Save and display.
7. With the page displayed, make of copy of the link to the favicon by right clicking the favicon and choosing (Chrome) Copy Image Address or (Firefox / Edge) Copy Image Link. Paste the link somewhere safe if you want to.
8. Click Site Administration > Appearance > Additional HTML.
9. In the Within HEAD box, create a link to the favicon by entering the following, replacing the href value with the copied link to the favicon: <link rel="icon" type="image/x-icon" href="https://your.moodle.server/path/to/your/favicon.ico">
10. Click Save changes. When saved, do a hard reload (Usually Ctrl-F5) or clear your web browsers cache and check that the icon has loaded.

Hiding the Main menu block

You probably do not want the Main menu displaying on the site Home page. If this is the case you can hide it by:

1. Go to your moodle sites home page and enable editing.
2. Click the Main menus Action menu cog
3. Choose Hide Main Menu from the list.
4. The page you have just added will disappear from the menu, but the Main menu itself will still show. Disable editing to see the final result.

If you've hidden the main menu, you will need to show it again to access the site page with the favicon.

See also

• Main menu block
• HTML favicon