How can I manually add Mastodon to my social links?

[detritusbooks]

I just wanna add Mastodon to my social links, but the theme doesn't have Mastodon as an option. Is there a way to just manually do this in the code?

[detritusbooks]

Nobody knows?

[detritusbooks]

I'm kind of surprised that nobody knows how to do this...

[CharlesA-M]

I figured out how to add a Mastodon icon to my social icons using FontAwesome:

First, add this line to your theme.js file, just before the </head> tag:

    {{ '//cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css' | stylesheet_tag }}

Then add one of these to the place in your code where you want it to appear (e.g. social-icons.liquid or footer.liquid):

<i class="fab fa-mastodon"></i>

or

<i class="fa-brands fa-mastodon"></i>

Additionally, because I wasn't using the render tag on the svg liquid files, I had to do some tweaking of the size and other CSS attributes, namely adding text-decoration:none and height: 44px to the a tag.

Source help docs used to solve this:
StackOverflow thread

More about formatting fontawesome fonts.

[potterybyosa]

Would also love to know. I'm nervous about altering my Theme code and hope this becomes an option in future Shopify updates.