Add Favicon to Hexo Blog

Question

I have made a Hexo blog. I can't however find out where to add the favicon. I have tried adding it to different folders but it isn't being found.

Does anyone know where it should be added or if there is anything else I need to update.

Answer 1

It depends on theme you're using, check theme documentation and source.

Some themes, like apollo are supports favicon config parameter (theme_config.favicon parameter in_config.yml).

If theme does not support a custom favicon, then just add file source/favicon.ico and it will be requested by browser automatically.

Answer 2

I use Landscape, the default theme at time of writing.

blog\blog\node_modules\hexo\node_modules\hexo-cli\assets\themes\landscape\_config.yml

At the bottom of the file, you'll find a section titled Miscellaneous.

# Miscellaneous 
google_analytics:
favicon: blog\themes\landscape\source\css\images\favicon.ico
twitter:
google_plus:
fb_admins:
fb_app_id:

Windows can be directionally-challenged when it comes to slashes, so try the opposite direction if you use PC. This took some fudging on my part, and I was able to use an .ico file as well as a .png.

If you're still in need of a placeholder image, I've used Favicon.cc and had great results.

Answer 3

you can add the favicon.ico in the source floder, and add a line in the blog/_config.yml

favicon: favicon.ico

so, you know the source is the root path

Answer 4

I think all the other answers are so confused.
Now just three steps to add a favicon to your hexo-blog website, and I take next theme as example:

• First, download your favorite imagename.ico image file from network or you make one by yourself.

• Second, rename the imagename.ico file to favicon.ico, then move it to that folder: blog/themes/next(the theme folder you are using now)/source/images/.

• Finally, modify the code in file blog/themes/next/_config.yml at that line to the same as below:

  # Put your favicon.ico into `hexo-site/source/` directory.
  favicon: images/favicon.ico
  

Done!