Instructions to add Favicon for WordPress

WordPress Favicon is a small image that appears on the browser Tab or displayed in the website browsing history, Bookmark list, etc. In case the website does not set up a Favicon, it will automatically get the Favicon of the Hosting, also in some cases it is a white icon. . So how to add Favicon for WordPress? Detailed answers will be available in the following sharing of BKNS.

How to add Favicon for WordPress?

1. Why add Favicon for WordPress?

Why Add Favicon to WordPress

WordPress Favicon is likened to the "identification" of the website. Website will be missing, incomplete without inserting WordPress Favicon. The important reasons that you need to add Favicon in WordPress are:

1.1 Brand affirmation

Along with Domain, website title, Favicon is one of the important factors to help users quickly identify which website is open. This is a small but very effective icon to increase website identification for users, especially in case the user opens many Tabs on the browser.

1.2 Building trust

Users will not feel comfortable and feel the website is not professional if Favicon. If creating a website for a business or online store, it is definitely indispensable for Favicon.

2. How to Create a WordPress Favicon

You should choose the size for the Favicon as a 512px x 512px square. You can absolutely use a large image, but WordPress will automatically crop it smaller to fit the frame. For image size 512px x 512px. You can use any photo editing tool to edit (eg: Adobe Photoshop paid, free Gimp or online Favicon maker).

For the background of the Favicon, you can choose a color or make it transparent (transparent is best). Use format .ico, .jpeg, .gif, .png (use format .png if you leave the background transparent). Once you're done, do it! add Favicon for WordPress in the ways that BKNS instructs below.

3. How to Add Favicon to WordPress

3.1 Adding Favicon in WordPress Manually

Steps add Favicon for WordPress manually as follows:

Step 1: Access website with File manager or FTP Client

Step 2: Search folder /wp-content/themes/your-theme

Step 3: Conduct Upload Favicon go to folder Theme (should upload to subfolder)

Step 4: Save the path

Step 5: Find files function.php

Step 6: Add the following code:

function add_favicon() {

echo '<link rel="shortcut icon" type="image/png" href="'.get_template_directory_uri().'https://media.bkns.vn/assets/favicon.png" />';

}

add_action('wp_head', 'add_favicon');

Step 7: Enter the path to the Favicon in the paragraph:

href=”‘.get_template_directory_uri()

Fill in the correct filename with the format .ico as follows:

function add_favicon() {

echo '<link rel="shortcut icon" type="image/png" href="'.get_template_directory_uri().'https://media.bkns.vn/assets/favicon.ico" />';

}

add_action('wp_head', 'add_favicon');

3.2 Adding Favicon to WordPress with WordPress Customizer

Follow these steps if you want to add a Favicon to WordPress using the WordPress Customizer:

Step 1: Go to Admin Dashboard

Step 2: Go to section Appearance

Step 3: Arrive Customize

Step 4: Choose Site identity

Step 5: Choose Select Image (below Site Icon)

Step 6: Upload Favicon

Step 7: Save changes by pressing the button Publish

3.3 Add Favicon for WordPress with Plugin

You absolutely can Add Favicon to WordPress by Plugin. The steps are as follows:

Step 1: Access Admin Dashboard

Step 2: Choose Plugin

Step 3: Click Add New

Step 4: In the search bar type Favicon by Real Favicon Generator

Step 5: Install, activate Plugin

Step 6: Move in Appearance

Step 7: Click Favicon

Step 8: Upload the image you want to install for Favicon. Here, the plugin will automatically edit the image so you do not need to edit the image with the software. It is recommended to choose an image with a size of 70px x 70px, it is best to choose an image of about 260px x 260px

Step 9: Choose Generate Favicon when uploading photos

Step 10: The plugin will automatically redirect you to the website Real Favicon Generator

Step 11: Search and click on Generate your Favicon and HTML Code

Step 12: The plugin automatically takes you back to the website. Then you get the message that Favicon is installed

Above, BKNS shared 3 ways add Favicon for WordPress. If you have followed the steps correctly but have not been successful, please leave a comment below for BKNS to promptly support. Regularly follow other useful articles of BKNS - one of the leading providers of information technology services and network solutions in Vietnam by visiting bkns.vn Please!

>> Learn more:

My name is Thinh Hanh, currently the CEO of BKNS. I will provide you with information technology services and network solutions in the fastest and most effective way.