Login/Register
Add Favicon to Hexo Blog
Asked Answered
node.jshexo
K

6

8

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.

Krimmer answered 17/5, 2015 at 20:5 Comment(0)
B
6

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.

Behr answered 14/6, 2015 at 13:39 Comment(0)
H
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.

Hahnke answered 13/6, 2015 at 4:35 Comment(0)
U
2

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

Unionist answered 5/8, 2017 at 10:0 Comment(0)
B
1

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!

Bucephalus answered 26/5, 2020 at 6:38 Comment(0)
T
0

Konstantin Pavlov is right. for example, I use hexo-theme-next theme. I change code in themes/next/_config.yml.

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

I put my favicon.ico in themes/next/source/images/favicon.ico
well Done.

Templia answered 7/4, 2017 at 7:57 Comment(0)
L
-1

Add this to the head part of the html code...

  <head>
    <title>Test Page</title>
    <link rel="icon" type="image/png" href="http://www.w3.org/Icons/w3c_home">
  </head>

For more on this have a look at the W3C site : How To FavIcon

It's also good to inspect the page source by looking at the console as it will report if there were any issue retrieving the icon.

Lyallpur answered 17/5, 2015 at 21:27 Comment(1)
This answer, while pointing to a related favicon resource does not answer the question related to Hexo site generator. – Stimulative

© 2022 - 2024 — McMap. All rights reserved.