Add favicon in blog - 2nd # DreaMerZ-Note

Hello, I'm writing a blog to keep in mind. This is DreaMerZ-Note.

This post is about to write down how to set up the applied favicon when your blog is searched by Search engines (ex. Google, Bing ..). In the last post, I introduced you to how to make a favicon and apply it to your blog or your web site. If you applied the last post well, this will be easier. 

If you say you haven't applied the favicon, plz look at the post below and apply it :)

* A related post

- Add favicon in blog - 1st

* What is favicon?

A small image used by a browser to represent a website (ex. blog)

| Quick View

How to Apply It.

# Blog Theme > Edit HTML > Add Link Tag between the Head Tag > Save.

- Code : <link href='https://your-site-url.com/favicon.ico' rel='icon' /> 

# Before 

We do not capture the search results before application, so we replace them with Google blog search results. Maybe, if you're using it without any changes to the Favicon, the Google is like the image below. If it's a T-story blog, you will find it with the T-story default favicon.

# After 

If you search it right after you apply it, it will show up as an existing favicon. Each search engine also has a different crawling cycle, so it takes about a day to apply. You can directly request crawling, but I recommend you to take your time because even if you do, it won't immediately crawl.

| Check Out Google's Guide. (Favicon)

Before applying it, let's check out how to set up the favicon that is explained in Google Guide. If you look at the guide document, it kindly explains it under the title "Define the favicon to display on search results." That's all we have to do. The guide page explains it in detail, but I will summarize what we need in two ways. 

1. Add link tag to the homepage Header. 

https://developers.google.com/search/docs/appearance/favicon-in-search?hl=ko

2. Use an icon with a 1:1 aspect ratio and larger than 48x48.

We have already followed the second process. The icon applied in the previous post is 1:1 ratio and the size is 48x48 / 128x128 / 192x192, so we don't need any setting for the icon size. So, I just need to apply the first process. Shall we try it?

| Add Link tag to Blog theme (html).

Before applying Course 1, you first need the address (path) of your site's favicon.ico. After browsing the browser, Check if the favicon icon is displayed when you approach it as shown in the image below.

# Check the Favicon URL > 'https://your-blog-url/favicon.ico'

Once you have confirmed the Favicon path(address), you can apply it to the blog header. When you add a link tag, plz change 'your-site-url' address to your own address and apply it. And After adding the code, please check Save. Then, it's Over!

# Blog Admin Page > Theme > Edit HTML

# Add link Tag to Top of Head Tag > Save.

- Code : <link href='https://your-site-url.com/favicon.ico' rel='icon' /> 

| Check Out the favicon on My Blog searched on Google.

# After Adding the link Tag, the search engine must crawl and collect site information to check the applied favicon when searching for users. Crawling is done periodically (1day to 1week), but if you want to request manual crawl, please refer to the Google Guide below.

* Google Guide : Re-Crawling.

- https://developers.google.com/search/docs/crawling-indexing/ask-google-to-recrawl?hl=ko

It's been about a day since I applied it. So, should I search the blog and see if the Favicon is applied properly? Oh, I checked and it turned out well with the applied "DMZN" Favicon. It's a really mini icon, but i feel good because I can feel my own color. Then, I hope you apply it well and see you in the next post.