Any simple way to check on character in front matter variable?

[j9t]

I’m probably not seeing the forest for the trees: I like to check on the presence of a character in a front matter entry, to customize a template based on the result.

In the specific case, I like to extend an author field (which used to contain Twitter handles, without a leading “@”) to also cover Mastodon handles (of the form “[email protected]”).

Theoretically, something like the following should work:

{% if '@' in author %}MASTODON{% else %}TWITTER{% endif %}

But it doesn’t—and neither a string, nor a list, nor a string and list conversion help, nor converting “author” first, nor doing any other transformations. It’s like “author” cannot be inspected and worked with at all—all that works is check on its presence. (I’ve worked through Eleventy, Nunjucks, and Jinja docs, so the forest I was looking at is big ;)

What am I missing? What’s the simplest way of accomplishing this?

[pdehaan]

A few possible suggestions (for Nunjucks; Liquid would probably need a slightly tweaked syntax):

---
author: "@twitter"
---
{% if author[0] === "@" %}TWITTER1{% endif %}
{% if author.at(0) === "@" %}TWITTER2{% endif %}
{% if author.startsWith("@") %}TWITTER3{% endif %}
{% if author|first === "@" %}TWITTER4{% endif %}

{{ "TWITTER" if author|first === "@" else "MASTODON" }}

Or if this is something you're using in 1+ places, I might suggest a custom Eleventy filter that you can reuse a bit more easily.

  eleventyConfig.addFilter("social", function (username="") {
    if (!username) {
      return "";
    }
    if (username.startsWith("@")) {
      return `<a href="https://twitter.com/${username.replace(/^@/, '')}">TWITTER</a>`;
    }
    return "MASTODON";
  });

---
author: "@pdehaan"
author2: "[email protected]"
---

<p>{{ autho | social | safe }}</p>
<p>{{ author | social | safe }}</p>
<p>{{ author2 | social | safe }}</p>

OUTPUT

<p></p>
<p><a href="https://twitter.com/@pdehaan">TWITTER</a></p>
<p>MASTODON</p>

[j9t]

Fantastic. Thank you so much, @pdehaan.

It wasn’t exactly what I’m trying to set up, but—sharing to learn but also to help anyone trying to do similar—this got me on a track to solve this. What I’ve used this for was to add the following filter:

eleventyConfig.addFilter("checkHandle", function (handle) {
  if (handle.includes("@")) {
    return `<a href=https://mas.to/@${handle}>@${handle}</a>`;
  } else {
    return `<a href=https://twitter.com/${handle}>@${handle}</a>`;
  }
});

to check on any social media handles to include an at-sign. Given that (in this project) handles can only be Twitter or Mastodon handles, and don't start with a leading “@”, this allows to identify the Mastodon ones, and to generate the respective link (keeping this simple by not caring about the instance—it seems you can open a profile on any instance); and to return a regular Twitter link otherwise.

(In the Nunjucks template, these would be just called as {{ author | checkHandle | safe }} indeed.)

Curious about feedback on this one, and grateful for the kind and quick pointer! Thank you!