dsrkafuu / hugo-theme-fuji

A minimal Hugo theme with nice theme color. | 一个主题色极简 Hugo 主题。
https://github.dsrkafuu.net/hugo-theme-fuji/
Apache License 2.0
367 stars 97 forks source link

Add support for Font Awesome #69

Closed zincnode closed 1 year ago

zincnode commented 3 years ago

Font Awesome

Get vector icons and social logos on your website with Font Awesome, the web's most popular icon set and toolkit.

Add global support for Font Awesome

Adding script to head.html makes Font Awesome globally available.

Usage

Example:

<i class="fas fa-camera"></i>

Add short code support for Font Awesome

Create fa.html to add support for Font Awesome shortcodes in markdown.

via: Font Awesome in Hugo

Usage

Example:

{{< fa bath >}}
dsrkafuu commented 3 years ago

Global support for Font Awesome is not recommended as the script is large and not everyone needs to use it.

Shortcode is the solution, and I recommend the jsDelivr CDN for its better performance in China:

https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.15.2/css/all.min.css
itsraghz commented 3 years ago

Thanks @dsrkafuu for the comments on not using the Font Awesome. If I need to use a suitable icon for an Author, how do I add? what icons can I make use of it and how can we get them imported in the Hugo Theme Template?

itsraghz commented 3 years ago

Hi @dsrkafuu , The post https://matze.rocks/posts/fontawesome_in_hugo/ shared by @zincnode seems to be easy to follow on our own sites. How do you see that? Is it a valid extension/customization?

dsrkafuu commented 3 years ago

@itsraghz

Previously I've been working on a solution to load icons from the local assets folder, it uses shortcodes or partials (in templates) then inserts the SVG icon into the HTML dom which saves time for requesting remote files.

Like this on my blog theme:

However, since this method requires adding SVG files manually, it’s a bit more troublesome for theme users, so I haven't decided exactly how to implement it.

itsraghz commented 3 years ago

Thanks @dsrkafuu . I have been recently learning Hugo and using your fuji theme only. You can see my posts in https://discourse.gohugo.in website- - https://discourse.gohugo.io/u/itsraghz/summary. I will see if I can take up something - may be once I get a good grasping on Go Language and Hugo Internals.

Btw, You can visit my blog deployed on Netlify and available at https://raghsonline.com if time permits. I have been adding all my experiments in the "Hugo" tag → https://raghsonline.com/tags/hugo/

dsrkafuu commented 3 years ago

Thanks for using the Fuji theme.

The theme itself was created when I started using Hugo quite early on.

So there may be a lot of imperfections yet to be modified.

itsraghz commented 3 years ago

Thanks for using the Fuji theme.

The theme itself was created when I started using Hugo quite early on.

So there may be a lot of imperfections yet to be modified.

yes indeed. I will see if there is anything I can help contribute for the betterment. I just created an issue https://github.com/dsrkafuu/hugo-theme-fuji/issues/80. Kindly check and advise.