Attachments reference

Overview


HyperTexting attachments are links and other media that may be featured on a given page. See the page.attachments property for more information.

Example


The page.attachments property is meant to be populated by applications that implement the HyperTexting CMS. Such applications may provide support for "attaching" links and other media to a page.

 1---
 2created_at: "2025-01-03T14:40:25-08:00"
 3layout: post.html
 4attachments:
 5    - kind: image
 6      href: IMG_0792.PNG
 7      data:
 8          src: IMG_0792.PNG
 9          width: 1152
10          height: 2048
11    - kind: image
12      href: IMG_0795.PNG
13      data:
14          src: IMG_0795.PNG
15          width: 2048
16          height: 1152
17    - kind: image
18      href: IMG_0788.PNG
19      data:
20          src: IMG_0788.PNG
21          width: 2048
22          height: 1152
23    - kind: image
24      href: IMG_0789.PNG
25      data:
26          src: IMG_0789.PNG
27          width: 1152
28          height: 2048
29---
30
31Checkout these promotional images for the new @vw.com ID Buzz!

This example shows a page with multiple image attachments. These could be used to populate an image gallery!

 1---
 2created_at: 2024-11-21T12:00:00-07:00
 3title: Two years of thinking & tinkering
 4description: Herd Works has been in stealth mode for two years now. What have we been up to?
 5draft: true
 6attachments:
 7  - kind: link
 8    href: https://herd.works/blog/starting-up/
 9    data:
10        author:
11            favicon: https://herd.works/apple-touch-icon-57x57.png?v=1
12            href: https://herd.works/
13            name: Herd Works
14            username: '@herd.works'
15        opengraph:
16            description: Introducing Herd Works, Inc. A Portland, Oregon-based startup building pocket-worthy productivity tools for people-people. Coming soon to an iPhone near you.
17            image: https://herd.works/blog/starting-up/billion.png
18            title: Starting Up, Part Deux
19            type: article
20            url: https://herd.works/blog/starting-up/
21            video: https://herd.works/blog/starting-up/billion.mp4
22        twitter:
23            card: summary_large_image
24            creator: '@herdworks'
25            description: Introducing Herd Works, Inc. A Portland, Oregon-based startup building pocket-worthy productivity tools for people-people. Coming soon to an iPhone near you.
26            image: https://herd.works/blog/starting-up/billion.png
27            site: '@herdworks'
28            title: Starting Up, Part Deux
29---
30
31Hello, friends! :wave:

This example (a blog post that never saw the light of day) shows a link attachment with some page metadata. The HyperTexting app provides built-in support for fetching link metadata which can be used to show link previews in a similar fashion as Twitter Cards.

Properties


attachment.kind
The attachment kind.

The suggested attachment kinds are:

  • link
  • image
  • video
  • audio
  • file
attachment.href
The attachment URL.

Every attachment should describe a resource with a unique URL.

attachment.data
The attachment template data.

Attachments may provide metadata and other content that will be accessible as template data to layouts.

NOTE: there is no specification for the attachment.data property.

The examples shown on this page are intended to demonstrate the flexibility of HyperTexting attachments. HyperTemplates applications such as the official HyperTexting app will produce consistent attachment template data, but layout and theme developers should consult the application reference documentation for more information.

Edit this page on GitHub

💬 Join the community

Stay up-to-date with the lastest releases and other news from Team HyperTemplates. Ask the developers questions, get help from the community, and share your creations! 🎨