FFF

Appearance

FFF Flavored Frontmatter
Version 1.2 ​

Published: 2024-01-01

Overview ​

  • Modify: lang no longer supports arrays

Base ​

Base variables: It has been implemented for some time and is more commonly used.

title ​

  • type: string
  • jsonfeed: title
  • microformats: p-name
  • description: the title of article, non-article posts may omit titles.
yaml
title: 'Hello World'

summary ​

  • type: string
  • jsonfeed: summary
  • microformats: p-summary[1]
  • description: plain text sentence or two describing the post.
yaml
summary: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.'

tags ​

  • type: string[]
  • jsonfeed: tags
  • microformats: u-category
  • description: tags array, any plain text values you want.
yaml
tags:
  - foo
  - bar
  - baz

categories ​

INFO

You can also merge categories into tags and use this variable only when you don't want to.

  • type: string[]
  • microformats: u-category
  • description: categories array, any plain text values you want.
yaml
categories:
  - foo
  - bar

flags ​

  • type: string[]
  • description: flags array, any plain text values you want.
yaml
flags:
  - unlisted # https://indieweb.org/unlisted
  - draft

INFO

For more on flags, see Concepts: Flags

DateTime ​

created ​

  • type: string
  • description: The created[2] date of the post.
yaml
created: 2022-07-18

updated ​

  • type: string
  • jsonfeed: date_modified
  • microformats: dt-updated
  • description: The updated[3] date of the post.
yaml
updated: 2022-07-18

published ​

  • type: string
  • jsonfeed: date_published
  • microformats: dt-published
  • description: The published[4] date of the post.
yaml
updated: 2022-07-18

start ​

  • type: string
  • microformats: dt-start[5]
  • description: datetime the event starts.

end ​

  • type: string
  • microformats: dt-end[5:1]
  • description: datetime the event ends.

Media ​

INFO

For more on object media, see Concepts: Object Media

image ​

  • type: string
  • optional type: FFFImage
  • jsonfeed: image (string only)
  • description: the main image for article or photo[6] post.
  • microformats: u-photo or u-featured[7]
yaml
# String Image
image: 'https://fff.local/images/foo.avif'
# Object Image
image:
  src: 'https://fff.local/images/foo.avif'
  alt: 'lorem ipsum'
  figcaption: 'lorem ipsum'
  sources:
    - srcset: 'https://fff.local/images/foo444.avif'
      media: '(min-width:444px)'
    - srcset: 'https://fff.local/images/foo666.avif'
      media: '(min-width:666px)'

images ​

  • type: string[]
  • optional type: FFFImage[]
  • jsonfeed: image (string and first only)
  • microformats: u-photo
  • description: the images for multi-photo[8] post.
  • note: use it only when you need more than one photo.
yaml
# String Images
images:
  - 'https://fff.local/images/foo.avif'
  - 'https://fff.local/images/bar.avif'
# Object Images
images:
  - src: 'https://fff.local/images/foo.avif'
    alt: 'lorem ipsum'
    figcaption: 'lorem ipsum'
    sources:
      - srcset: 'https://fff.local/images/foo444.avif'
        media: '(min-width:444px)'
      - srcset: 'https://fff.local/images/foo666.avif'
        media: '(min-width:666px)'
  - src: 'https://fff.local/images/bar.avif'
    alt: 'foo bar'

audio ​

  • type: string
  • optional type: FFFAudio
  • microformats: u-audio[9]
  • description: the main audio for audio post.
yaml
# String Audio
audio: 'https://fff.local/audio/podcast.flac'
# Object Audio
audio:
  src: 'https://fff.local/audio/podcast.flac'
  alt: 'podcast'
  controls: 'controls'

video ​

  • type: string
  • optional type: FFFVideo
  • microformats: u-video[10] or u-featured[7:1]
  • description: the main video for video post.
yaml
# String Video
video: '/video/yumeyume.av1'
# Object Video
video:
  src: 'https://fff.local/video/yumeyume.av1'
  alt: 'Yume Yume'
  autoplay: true
  loop: true

alt ​

INFO

This is a fallback for Object Media image.alt, which should be converted automatically by the plugin.

  • type: string
  • description: image alternate text.
yaml
# String Image
image: 'https://fff.local/images/foo.avif'
# Alt
alt: 'foo'

Mention ​

bookmark_of ​

  • type: string
  • microformats: u-bookmark-of
  • description: indicates this post is a bookmark[11] of another URL.
yaml
bookmark_of: 'https://example.com/permalink47'

like_of ​

  • type: string
  • microformats: u-like-of
  • description: the URL which the post is considered a "like"[12] (favorite, star) of.
yaml
like_of: 'https://example.com/permalink47'

repost_of ​

  • type: string
  • microformats: u-repost-of
  • description: the URL which the post is considered a "repost"[13] of.
yaml
repost_of: 'https://example.com/permalink47'

in_reply_to ​

  • type: string
  • microformats: u-in-reply-to[14]
  • description: URL which the post is considered reply[15] to.
yaml
in_reply_to: 'https://example.com/post123'
# or
in_reply_to:
- 'https://example.com/post123'
- 'https://example.com/post456'

Extra ​

This means that its naming is tentative and only used as a suggestion if needed.

authors ​

  • type: FFFAuthor[]
  • jsonfeed: authors
  • description: specifies one or more post authors.

lang ​

  • type: string
  • jsonfeed: language
  • description: the primary language for the post.
yaml
lang: en

draft ​

INFO

This is optional, you can also use flags: ['draft'] for draft: true.

  • type: boolean
  • description: when true, the post is considered a draft.
  • see also: flags#post-status

visibility ​

INFO

This is optional, you can also use flags: [${visibility}] for visibility: ${visibility}.

  • type: 'public' | 'unlisted' | 'private' | (string & {})
  • description: post visibility, consistent with micropub extensions.
  • see also: flags#visibility

location ​

  • type: string
  • microformats: p-location
  • description: location the post was posted from.

syndication ​

  • type: string | string[]
  • microformats: u-syndication[16]
  • description: URL(s) of syndicated copies of this post.
yaml
syndication: 'https://twitter.com/example/status/1542566710594658312'
# or
syndication:
- 'https://twitter.com/example/status/1542566710594658312'
- 'https://mastodon.social/@example/108964809799826911'

checkin ​

  • type: string
  • microformats: u-checkin[17]
  • description: the URL of the venue/location h-card which the h-entry is considered a "checkin" of.
yaml
checkin: 'https://example.com/venue'

rsvp ​

  • type: 'yes' | 'no' | 'maybe' | 'interested'
  • microformats: p-rsvp[18]
  • description: a reply to an event that says whether the sender is attending.
yaml
rsvp: 'interested'

Types ​

FFFImage ​

ts
/** Object Image */
export type FFFImage = Partial<HTMLImageElement> & {
  sources?: Partial<HTMLSourceElement>[]
  figcaption?: string
}

FFFAudio ​

ts
/** Object Audio */
export type FFFAudio = Partial<HTMLAudioElement> & {
  sources?: Partial<HTMLSourceElement>[]
}

FFFVideo ​

ts
/** Object Video */
export type FFFVideo = Partial<HTMLVideoElement> & {
  sources?: Partial<HTMLSourceElement>[]
}

FFFAuthor ​

ts
/** Author */
export type FFFAuthor = {
  /** the author's name. */
  name?: string
  /** the URL of a site owned by the author. */
  url?: string
  /** the URL for an image for the author. */
  avatar?: string
}

References ​

  1. summary - IndieWeb ↩︎

  2. created - IndieWeb ↩︎

  3. updated - IndieWeb ↩︎

  4. published - IndieWeb ↩︎

  5. h-event - Microformats Wiki ↩︎ ↩︎

  6. photo - IndieWeb ↩︎

  7. featured - IndieWeb ↩︎ ↩︎

  8. multi-photo - IndieWeb ↩︎

  9. audio - IndieWeb ↩︎

  10. video - IndieWeb ↩︎

  11. bookmark - IndieWeb ↩︎

  12. like - IndieWeb ↩︎

  13. repost - IndieWeb ↩︎

  14. in-reply-to - IndieWeb ↩︎

  15. reply - IndieWeb ↩︎

  16. u-syndication - IndieWeb ↩︎

  17. checkin - IndieWeb ↩︎

  18. rsvp - IndieWeb ↩︎