Adding a favicon with TYPO3 is pretty simple

It's pretty easy to add a favicon to a TYPO3 site. All you need to do is upload your favicon.ico file and then add one line of typoscript to your template.

Easily add a favicon with TYPO3

I've been working on my site today and one thing I noticed is that I don't have a favicon. I thought it would be difficult to add a favicon to TYPO3 for some reason, but it's not. So if you want to add a favicon to your TYPO3 site, read on, I'll show you how to do it.

First, if you don't have a favicon and you need one, you can use one of the following favicon generators:

Using the second site in the above list, I was able to create my own favorite icon which I downloaded to my computer and saved as 'favicon.ico'.

To get my favicon working in TYPO3 was easy. You can upload and configure a favicon on your TYPO3 site using the following steps.

Navigate to the Resources section of your site template

From the Web module of the TYPO3 backend, click on the link to the Template module. From the Template module, make sure you're at the Info/Modify section. Once you're there, click on the little pencil icon next to Resources.

: This is where you want to be. Just click on that little pencil icon next to where it says Resources.

Upload your favicon to your TYPO3 template

Once you're at the Resources section of your site template, you'll see a form labeled 'Upload Resource' where you can upload files. Click the Browse button and then select your favicon file from your computer. After you've selected your favicon file, click the save button at the top of the screen to upload your favicon and automatically save it to your TYPO3 site template.

: A favicon is selected and ready to be uploaded to the TYPO3 web site. Once the file is selected, clicking save will upload the file to the site.

Confirming that the favicon was successfully uploaded

: After the template is saved and the favicon uploaded, the favicon file will be listed among other template resources.

Activate the favicon using typoscript

Now that the favicon .ico file has been uploaded to the TYPO3 site, all that's left is to use typoscript to tell TYPO3 to link to the favicon file.

In your template's setup section, all that you need to add is the following line of typoscript:

### A favicon for the site
page.shortcutIcon = favicon*.ico

Note the asterisk (*) before the file extension. Although not necessary, it will help in the future if a new favicon file of the same name is uploaded and the original favicon is deleted. Adding the asterisk is not critical, just helpful for reasons that won't be elaborated on.

Also, of course, if your favicon file is not called 'favicon.ico', then do not put 'favicon.ico' in your typoscript setup. Use whatever name your favicon is called.

Make sure to save your typoscript template after making these changes!

Once you've saved your typoscript changes and your TYPO3 cache has been cleared, you will see your favicon on your web site.

No comments

Add comment

TYPO3 CMS

Computers & Technology