Social media platforms

Using Ghost
1

These seem like they’re hardcoded into Ghost, or can I configure somewhere, which social media platforms I want to support?

I’m mainly looking to support Mastodon, but essentially I don’t feel right when my self-hosted application is presenting me with two options that I would rather boycot (i.e. disable completely) given the strange times we live in:

image
image1225×538 27.1 KB

2

If you want to insert additional icons:

3

The code on the linked post is gibberish. Ghost doesn’t know what to do with {{instagram}} – but maybe you meant to linkthe code from themeupstudio later in the thread, which should be fine, as long as your theme has an element with a gh-social-icons container, or you modify the first line to match your target location for socials.

There’s a tutorial here:

It’s somewhat specific to Source, although it’ll work with many of the official themes, and with some paid themes with minor modification.

4

Sorry, wrong link, but the same topic:

You have to replace const socialLinkHTML = with let socialLinkHTML =

Use any svg-icons you like.

You have to place <div class="gh-social-icons"></div> somewhere in the code of your theme, wherever the icons may appear.
You have to style the class gh-social-icons by yourself.

Maybe Cathy’s suggestion is better, it depends on you.

1 Like
5

I am thinking about sending a patch (or merge request if you will) to add support for additional social links (e.g. Bluesky and fediverse) too, but maybe someone can take the task of this upstream if needed.

1 Like
6

I’d love to see someone put in a PR (but I’m not the core team, so my enthusiasm doesn’t mean very much). I /suspect/ that what’s likely the best option is something flexible. Rather than patching in one or two more socials, some sort of flexible option that’s a little more future-proof.

I’d love to see something like a field for the name of the social and then the url, and the ability to add multiples of those to each user. (And the same for the whole site, too.) It could be very much like the navigation interface.

And then theme creators could do something like:

{{#foreach socials}}
  <a href="{{link}}>
        <img src="/icons/{{name}}.jpg" alt="{{name}}">
  </a>
{{/foreach}}

But once again, I’m not core dev team, and if I were going to build something like that, I’d start by asking about mergeability of the idea, because if they don’t like it or want a different approach, you’d want to know that before you started.

3 Likes