How to create and publish a favicon in WordPress

Share on facebook
Share on twitter
Share on linkedin
Share on pinterest
Share on reddit
Share on whatsapp


Create Yes publish a favorite icon at WordPress it is extremely important to help our site stand out when a user has multiple tabs open at the same time. We’ll teach you everything you need to know to be able to create, configure, and publish your website icon in WordPress in minutes.

What is a favicon?

If you look at the tab of the browser you currently have open, you will see that just on the left side of Islabit, you will find a small icon. It would be the favicon of the site. Installing one isn’t complicated at all, maybe the problem is designing it.

We don’t have too much space, so we need to be as original as possible and work in the same way so that it is seen clearly and helps to distinguish the website. For this we will have to meet a series of requirements:

  • The image we will use will have dimensions of 512 x 512 pixels.
  • It should be simple enough to be clearly visible at 16 x 16 pixels.
  • The favicon should represent your brand in a simple way.
  • Never copy a favicon as the only thing you will get is confusing users, this is not recommended at all.
  • The favicon must be saved in Windows ICO format.
  • We save the favicon at 512 x 512 pixels because depending on the device the user is using, they can see our site icon up to 16 x 16 pixels or up to 310 x 310 pixels. When we save it as 512 x 512 pixels, we cover all possible resolutions.

    The most complicated during its configuration will be to create it, it is difficult because although we do it in an acceptable size, it must look good in different dimensions and it is not easy to achieve.

    So let’s start with Adobe Photoshop, Gimp, or some of the beginner-friendly Photoshop alternatives if you don’t understand much about it. However, if you are not very good at using these types of programs, don’t worry, there are alternatives.

    There are sites that help us generate a favicon online completely free and which will be useful to us to resolve this problem quickly.

  • Favicon.io: is a simple website that allows us to start with text, add an image or choose an Emoji. We can customize virtually anything we add.
  • Favicon.cc: here we can even draw the icon using the mouse, this is great when we want to do something extremely different, although we don’t deny that it is difficult.
  • Ionos.ca: we start by simply uploading an image and voila, we upload it quickly.
  • Website Planet: we can upload an image or choose one from a large gallery of predefined favicons that we can customize to our liking.
  • Once the icon is created, we need to proceed with its installation. It’s something quite simple, in a few minutes we will achieve it.

    WordPress customization.

    For this we will need to log into the WordPress admin panel and we will go to the left menu to enter “Appearance”. Next, we will select “Customize”.

    This will open a new page, the WordPress visual customization tool where we can edit the visual section of the theme we are using. We go to the left sidebar and click on “Site Identity”.

    Select favicon.

    Here we will be able to customize the logo, title and several basic website features. If we go down a bit we can see the option to select “Site icon”.

    This is precisely where you have to click to be able to load the favicon that we created earlier.

    When we click on that button, it will open up the WordPress image selector tool, so let’s download it. If we’ve already downloaded it, we’ll just choose “Media Library”.

    Publish favicon in WordPress.

    Once we have finished downloading the favicon we will have a preview of it and if that convinces us we will only have to click on “Publish” at the top for it to appear on our website.

    Your favicon image is active and anyone can see it. Keep in mind that if you have enabled a cache plugin, you might need to clear the cache to be able to see it immediately.

    As you can see, creating and posting a favicon in WordPress can be complex at some point. However, with a little patience, we can have our website icon ready in no time.

    Share this with your friends!



    Source link

    Leave a Reply

    Table of Contents