Hello! I am updating my Glitch in Bio site, and I would like to add the Pixelfed logo and link out to my Pixelfed account.
I don’t understand how the logos work in the layout / social.html file. I don’t see any of the other logos hosted on my site, so I am not sure how or where they are being pulled in from for the existing social media accounts, so I can’t figure out how to add Pixelfed.
I am a coding newbie and hoping for some tips on how to update my social links. Thanks!
wh0
January 27, 2025, 9:24pm
2
layout/social.html
sounds not current. maybe the glitch in bio template has updated since you remixed it?
the version I see now has … a great big .js file with svg code in string literals
1 Like
Hi @pamela-drouin ! It sounds like you are using the older version of Glitch in Bio, here’s how to add a new logo:
You need the SVG for the logo, I can see some for Pixelfed here and would recommend the monochrome one to work with the Glitch in Bio styles.
In social.html
add a section for the logo – here’s one I’ve tweaked from the source SVG linked above:
<!-- ==================== -->
<!-- Pixelfed -->
{{#if settings.social.pixelfed}}
<a aria-label="{{settings.name}} on Pixelfed" href="{{settings.social.pixelfed}}">
<svg
xmlns="http://www.w3.org/2000/svg"
class="social-profile-icon"
viewbox="0 0 50 50"
>
<path
d="M 25,50 C 11.192881,50 0,38.807119 0,25 0,11.192881 11.192881,0 25,0 38.807119,0 50,11.192881 50,25 50,38.807119 38.807119,50 25,50 Z M 23.015316,30.458015 h 4.586148 c 4.320335,0 7.822658,-3.409518 7.822658,-7.615371 0,-4.205853 -3.502323,-7.615371 -7.822658,-7.615371 h -6.619172 c -2.492501,0 -4.513072,1.967029 -4.513072,4.393483 v 17.100022 z"
/>
</svg>
</a>
{{/if}}
In settings.json
add an item for Pixelfed inside the social
section, with your Pixelfed profile as the value:
"pixelfed" : "your-profile-link",
That should be it! Here’s how it looks in a remix of my own Glitch in Bio :
We’ll definitely look into adding Pixelfed as a default option!
2 Likes
Thank you for your detailed reply! I will give this a try and report back.
2 Likes
That worked! I was able to add Mastodon too thanks to looking at your Glitch in Bio!
1 Like
Yay thanks for the update
1 Like