Comments (13)
I'm about to be adding these to my latest site, I'll pull request my favicons partial layout and the params added to the config when done it.
from hugo-universal-theme.
I didn't write this and do a pull because I'm not sure if this is the best way to do it. My experience with CSS is limited.
However, this is the change I've made to our own site, so that you can favourite it on iOS/Android/Windows and get the favicon you want.
from hugo-universal-theme.
I think you're close there, but I'd DRY it further, by putting it in its' own partial that's called in the base template, in the same way that the scripts is called through the scripts.html.
I'd also say to replace all the colours with custom params that are set in the config.toml.
Think I'll pull request this later actually.
from hugo-universal-theme.
Sorry for my ignorance, but are all those different favicons really needed?
@terrafoundry can you provide information about how/when those icons are used?
@GeorgeWL Thanks, I'll review the PR when you send it.
from hugo-universal-theme.
They're not all necessary, the only ones really needed :
- Standard Android, but only if you want a version with drop shadow in case someone sends the bookmark to their Home Screen. Otherwise it falls back to the iOS standard, and if it can't find that, to the favicon
- iOS Standard & Retina icons (retina is the iOS super-hd) but only if you want a version to exist in case someone sends the bookmark to their iOS Home Screen. If it can't find that it goes to the favicon
- Windows Live Tile Icon if the website is likely to get pinned to start bar by someone, which only allows transparent background icons with a tile colour set in the manifest.xml. If it can't find that it goes to the favicon, which looks weird if the favicon has a background colour.
- Safari Pinned Tab in some cases (the way Safari does favicons is different, it makes a monochrome silhoutte of whatever the icon is, so in some cases you'll want a different icon file for that so it doesn't look funky.)
becomes
The rest are only there for backwards compatability and nice but not necessary. @adrianmo
I can say for a fact that chunk of code is taken from http://realfavicongenerator.net/ which has an API btw, so another possible method is to link to it and have them set that up then use a script to pull from there API. Too much faff for my liking, but it's a possible way.
from hugo-universal-theme.
Here's my site before I put favicons on for e.g.
from hugo-universal-theme.
@GeorgeWL Wow! Thanks a lot for the clarification. I can see now the importance of those icons...
IMO they should be configured in the config.toml
file, probably inside the [params]
section as optional params.
@GeorgeWL as you have the know-how, would you be willing to lead this effort?
Thanks,
-Adrian
from hugo-universal-theme.
@GeorgeWL BTW, do you want to become a collaborator of the project?
from hugo-universal-theme.
@adrianmo, I'm actually a little busy atm. But I'd like to help :)
from hugo-universal-theme.
@terrafoundry see my pull request
from hugo-universal-theme.
from hugo-universal-theme.
Sorry for lack of response on this, been working away recently.
To address an earlier point, I included all favicons, regardless of market share, because some applications pick and choose which one to use.
For example, copying a link into Rocketchat from a URL, it tries to use the Windows Phone favicon for some reason, so I just used them all to cover all bases.
from hugo-universal-theme.
This issue is being addressed in PR #77
from hugo-universal-theme.
Related Issues (20)
- Enable the discussions section HOT 3
- Add support for modern image formats (AVIF, JXL and WebP)
- Bug: AVIF not recognized as image format in the front matter
- Cannot find how to modify BLOGS header + Menu behaviour question HOT 8
- Is it possible to display the top bar (with the social links) on all pages? HOT 9
- any option for Markdown processor to support HTML? HOT 1
- Content in subdirectories formatted differently
- Open links in new page HOT 1
- Use an image instead of carousel? HOT 1
- Anyone implemented a Portfolio page?
- Problem with build_site HOT 1
- get rid of google fonts
- Premium to remove footer watermark HOT 8
- Add support of taxonomy 'series' HOT 1
- Title and subtitle in features section on the landing page
- Post titles with same names are disappearing
- Blog doesn't show HOT 1
- navbar menu items keep the `:focus` pseudo-class after exiting the pop-out submenu HOT 1
- Cannot build on latest hugo HOT 3
- Google AdSense implementation
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from hugo-universal-theme.