I’m checking to see if there is an option to add the RSS logo to the site NAV menu at the top of the site next to the social media icons. I’ve attached a screenshot of our site. I have it listed as RSS in the nav but just the text shows up. I’m hoping there’s a way to add the icon like the system automatically does with social media accounts.
Thanks!
… looking into the same thing.
Instructions on Ghost’s Forum gets me all the social icons, however with the exception of RSS.
Wonder if Ghost is looking for a specific string for nav-{ x }
I’ve tried nav-rss, nav-feed, nav-atom, … so far I get a broken icon. The RSS icon was already part of font-awesome v5~ and we’re calling on v6.4.2.
Since there isn’t really an index of all posts, figured RSS would be a great way of giving a potential subscriber or visitor at least an insight into a number of posts and their content.
Cheers ~
+1
I can’t add the RSS icon either, any solution?
You’ll need to look at the css and extrapolate from it what would give you formatting of the rss link. And you’ll need to look at font-awesome to figure out what encoding to use for it. Basically, look at all the parts that do any one icon, duplicate them, and change them to be an rss icon instead.
Post your attempt (inside the code block) if you need help debugging, or better yet, link your site.
When I get it working, I’ll post it …
Well, like I said, the only icon that is not working is for RSS, all other are fine.
Right, so it’s probably a small error. That’s why I suggested posting your code if you wanted help trouble-shooting. But up to you! :)
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/brands.min.css" integrity="sha512-W/zrbCncQnky/EzL+/AYwTtosvrM+YG/V6piQLSe2HuKS6cmbw89kjYkp3tWFn1dkWV7L1ruvJyKbLz73Vlgfg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>
.gh-head-menu .nav-mastodon a,
.gh-head-menu .nav-facebook a,
.gh-head-menu .nav-linkedin a,
.gh-head-menu .nav-keybase a,
.gh-head-menu .nav-rss a {
font-size: 0 !important;
}
.gh-head-menu .nav-mastodon a::before,
.gh-head-menu .nav-facebook a::before,
.gh-head-menu .nav-linkedin a::before,
.gh-head-menu .nav-keybase a::before,
.gh-head-menu .nav-rss a::before {
font-family: "Font Awesome 6 Brands";
display: inline-block;
font-size: 20px;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
}
.gh-head-menu .nav-mastodon a::before {content: "\f4f6"}
.gh-head-menu .nav-facebook a::before {content: "\f09a"}
.gh-head-menu .nav-linkedin a::before {content: "\f08c"}
.gh-head-menu .nav-keybase a::before {content: "\f4f5"}
.gh-head-menu .nav-rss a::before {content: "\f09e"}
</style>
So is your link named rssfeed? Or is it actually rss feed? The navigation helper turns the name of the link into a slug, so you need to match that.
I’ve edited the above and simplified it back to nav-rss.
The RSS link is https://detlev.bluelf.me/rss/ with an Item Label of RSS.
C’est tout.
So is it working? :)
No it’s not working, that’s why I’m here.
I figured out what your site was and looked at it. Your problem is that Font Awesome Brands doesn’t include an RSS icon.
You’re going to need to load Font Awesome classic for that.
If I’m reading FontAwesome correctly, the icon has been part of their collection since version 2.0 and is also part of the 6.5 version.
What am I missing?
It’s not part of the brands collection. It’s part of the free/classic collection, looks like.
You know, the quarter fell a penny at a time, but I finally found my way around FontAwesome and see what you mean.
So then the question becomes, is there an alternative to Ghost’s default Brands font family … i.e. the Classic family provided that that will cover all my icon needs, else call both families?
IOW, replace
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/brands.min.css" integrity= …
font-family: "Font Awesome 6 Brands";
with
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/classic.min.css" integrity=
font-family: "Font Awesome 6 Classic";
Sheeesh, so much work for one little icon!! 
Update:
Well, I’m done with this for now … pasted a rolled up newspaper with ‘rss’ !
When someone comes up with a more elegant solution, I’ll update it 
