gotosocial/web/template
tobi 700b7eaab7 [feature] Add extra opengraph meta tags (#4154)
# Description

> If this is a code change, please include a summary of what you've coded, and link to the issue(s) it closes/implements.
>
> If this is a documentation change, please briefly describe what you've changed and why.

Update our opengraph meta tag code stuff:

- Use `audio` and `video` types where appropriate.
- Include fall back to `image` types.
- Include `twitter:card=summary` or `twitter:card=summary_large_image` where appropriate (closes https://codeberg.org/superseriousbusiness/gotosocial/issues/2776)
- Include avatar description where possible.
- Include mime type for media.
- Set `modified_time` properly based on latest edit time.

Examples

Status with one image attachment, that's been edited:

```html
<meta property="og:locale" content="en">
<meta property="og:type" content="article">
<meta property="og:title" content="Post by Kip Van Den Bos, salad enjoyer, @tobi@goblin.technology">
<meta property="og:url" content="https://goblin.technology/@tobi/statuses/01JE3BQPNHWNHSNM0KS78X321Q">
<meta property="og:site_name" content="goblin.technology">
<meta property="og:description" content="cowards: &#34;I&#39;ll be a few minutes late, sorry!&#34; me:">
<meta property="og:article:publisher" content="https://goblin.technology/@tobi">
<meta property="og:article:author" content="https://goblin.technology/@tobi">
<meta property="og:article:modified_time" content="2025-04-22T07:24:49.773Z">
<meta property="og:article:published_time" content="2024-12-02T09:37:58.449Z">
<meta property="og:image" content="https://goblin.technology/fileserver/016T5Q3SQKBT337DAKVSKNXXW1/attachment/original/01JE3BPJ1TGMV6H6E8VY0ED5XA.png">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="1224">
<meta property="og:image:height" content="368">
<meta property="og:image:alt" content="Screenshot of a signal conversation where I wrote &#34;Just gonna smash out a quick poo&#34; and my friend responded with a sad face.">
<meta property="og:image" content="https://goblin.technology/fileserver/016T5Q3SQKBT337DAKVSKNXXW1/attachment/original/01J4YBM16ES6C1ENKZC8MC04BD.gif">
<meta property="og:image:type" content="image/gif">
<meta property="og:image:width" content="38">
<meta property="og:image:height" content="49">
<meta property="og:image:alt" content="Avatar for tobi: A 90&#39;s style gif of a black and white skull chattering happily.">
<meta property="og:image" content="https://goblin.technology/fileserver/01BPSX2MKCRVMD4YN4D71G9CP5/attachment/original/01J387PFPNKQWWNY9YQM67WA1T.gif">
<meta property="og:image:type" content="image/gif">
<meta property="og:image:alt" content="Little green peglin goblin bouncing happily.">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="https://goblin.technology/fileserver/016T5Q3SQKBT337DAKVSKNXXW1/attachment/original/01JE3BPJ1TGMV6H6E8VY0ED5XA.png">
<meta name="twitter:image:alt" content="Screenshot of a signal conversation where I wrote &#34;Just gonna smash out a quick poo&#34; and my friend responded with a sad face.">
```

Status with one audio file (with thumbnail):

```html
<meta property="og:locale" content="en">
<meta property="og:type" content="article">
<meta property="og:title" content="Post by Kip Van Den Bos, salad enjoyer, @tobi@goblin.technology">
<meta property="og:url" content="https://goblin.technology/@tobi/statuses/01JSV5BQ585HB4R8NPK4ANTG91">
<meta property="og:site_name" content="goblin.technology">
<meta property="og:description" content="service top anthem imo">
<meta property="og:article:publisher" content="https://goblin.technology/@tobi">
<meta property="og:article:author" content="https://goblin.technology/@tobi">
<meta property="og:article:modified_time" content="2025-04-27T08:21:00.712Z">
<meta property="og:article:published_time" content="2025-04-27T08:21:00.712Z">
<meta property="og:audio" content="https://goblin.technology/fileserver/016T5Q3SQKBT337DAKVSKNXXW1/attachment/original/01JSV5AJ4RF3E6DATCSW8SAY93.mp3">
<meta property="og:audio:secure_url" content="https://goblin.technology/fileserver/016T5Q3SQKBT337DAKVSKNXXW1/attachment/original/01JSV5AJ4RF3E6DATCSW8SAY93.mp3">
<meta property="og:audio:type" content="audio/mpeg">
<meta property="og:audio:alt" content="Sanctified by Nine Inch Nails, from Pretty Hate Machine">
<meta property="og:image" content="https://goblin.technology/fileserver/016T5Q3SQKBT337DAKVSKNXXW1/attachment/small/01JSV5AJ4RF3E6DATCSW8SAY93.webp">
<meta property="og:image:type" content="image/webp">
<meta property="og:image:width" content="500">
<meta property="og:image:height" content="500">
<meta property="og:image:alt" content="Sanctified by Nine Inch Nails, from Pretty Hate Machine">
<meta property="og:image" content="https://goblin.technology/fileserver/016T5Q3SQKBT337DAKVSKNXXW1/attachment/original/01J4YBM16ES6C1ENKZC8MC04BD.gif">
<meta property="og:image:type" content="image/gif">
<meta property="og:image:width" content="38">
<meta property="og:image:height" content="49">
<meta property="og:image:alt" content="Avatar for tobi: A 90&#39;s style gif of a black and white skull chattering happily.">
<meta property="og:image" content="https://goblin.technology/fileserver/01BPSX2MKCRVMD4YN4D71G9CP5/attachment/original/01J387PFPNKQWWNY9YQM67WA1T.gif">
<meta property="og:image:type" content="image/gif">
<meta property="og:image:alt" content="Little green peglin goblin bouncing happily.">
<meta name="twitter:card" content="summary">
```

## Checklist

Please put an x inside each checkbox to indicate that you've read and followed it: `[ ]` -> `[x]`

If this is a documentation change, only the first checkbox must be filled (you can delete the others if you want).

- [x] I/we have read the [GoToSocial contribution guidelines](https://codeberg.org/superseriousbusiness/gotosocial/src/branch/main/CONTRIBUTING.md).
- [x] I/we have discussed the proposed changes already, either in an issue on the repository, or in the Matrix chat.
- [x] I/we have not leveraged AI to create the proposed changes.
- [x] I/we have performed a self-review of added code.
- [x] I/we have written code that is legible and maintainable by others.
- [x] I/we have commented the added code, particularly in hard-to-understand areas.
- [ ] I/we have made any necessary changes to documentation.
- [x] I/we have added tests that cover new code.
- [x] I/we have run tests and they pass locally with the changes.
- [x] I/we have run `go fmt ./...` and `golangci-lint run`.

Reviewed-on: https://codeberg.org/superseriousbusiness/gotosocial/pulls/4154
Reviewed-by: Daenney <daenney@noreply.codeberg.org>
Co-authored-by: tobi <tobi.smethurst@protonmail.com>
Co-committed-by: tobi <tobi.smethurst@protonmail.com>
2025-05-08 11:11:25 +00:00
..
2fa.tmpl [feature/frontend] add autocomplete + other helpful attributes to auth html pages (#4029) 2025-04-20 17:46:25 +02:00
404.tmpl [chore] Refactor HTML templates and CSS (#2480) 2023-12-27 11:23:52 +01:00
about.tmpl [chore] Fix minor typo in About template (#3502) 2024-10-31 00:26:26 +01:00
authorize.tmpl [feature] New user sign-up via web page (#2796) 2024-04-11 11:45:53 +02:00
confirm-email.tmpl [feature] Add page-specific class per template (#3814) 2025-02-20 15:09:28 +01:00
confirmed-email.tmpl [feature] Add page-specific class per template (#3814) 2025-02-20 15:09:28 +01:00
domain-blocklist.tmpl [chore] Refactor HTML templates and CSS (#2480) 2023-12-27 11:23:52 +01:00
email_confirm.tmpl [feature] Self-serve email change for users (#2957) 2024-06-06 14:43:25 +01:00
email_new_report.tmpl [feature] Email notifications for new / closed moderation reports (#1628) 2023-03-19 13:11:46 +01:00
email_new_signup.tmpl [feature] New user sign-up via web page (#2796) 2024-04-11 11:45:53 +02:00
email_report_closed.tmpl [feature] Admin accounts endpoints; approve/reject sign-ups (#2826) 2024-04-13 13:25:10 +02:00
email_reset.tmpl [feature] Admin accounts endpoints; approve/reject sign-ups (#2826) 2024-04-13 13:25:10 +02:00
email_signup_approved.tmpl [chore] fixed email template to align with the new "Log in" button + separate page (#3871) 2025-03-04 09:46:33 +01:00
email_signup_rejected.tmpl [feature] Admin accounts endpoints; approve/reject sign-ups (#2826) 2024-04-13 13:25:10 +02:00
email_test.tmpl [feature/frontend] Let admins send test email to validate SMTP config (#2934) 2024-05-27 17:03:54 +00:00
error.tmpl [chore] Refactor HTML templates and CSS (#2480) 2023-12-27 11:23:52 +01:00
finalize.tmpl [bugfix] Suggest lowercase username when creating via OIDC (#3780) 2025-02-11 09:42:35 +01:00
index.tmpl [feature] Added an extra CSS class name to the About This Instance and Register an Account sections in the root index template to allow for easier targeting with custom CSS. (#3843) 2025-02-27 10:26:55 +01:00
index_register.tmpl [feature] Added an extra CSS class name to the About This Instance and Register an Account sections in the root index template to allow for easier targeting with custom CSS. (#3843) 2025-02-27 10:26:55 +01:00
index_what_is_this.tmpl [chore/frontend] rejig server picker recommendations (#4042) 2025-04-22 17:00:46 +02:00
login-info.tmpl [feature] Add page-specific class per template (#3814) 2025-02-20 15:09:28 +01:00
login_button.tmpl [bugfix] Fix a couple accessibility issues with :focus elements (#3979) 2025-04-09 14:14:20 +02:00
maintenance.tmpl [feature] Move to code.superseriousbusiness.org 2025-04-26 15:38:43 +02:00
nollamas.tmpl [chore] more NoLLaMas proof-of-work tweaking (#4096) 2025-05-03 16:45:25 +00:00
oob.tmpl [feature] New user sign-up via web page (#2796) 2024-04-11 11:45:53 +02:00
page.tmpl [bugfix] Fix indentation on multi-line alt text in web view (#4149) 2025-05-07 11:48:21 +00:00
page_footer.tmpl [chore/docs] add symmetry to the politics (#4081) 2025-04-28 18:20:09 +00:00
page_header.tmpl [chore] Change "federating with" to "knows of" (#4014) 2025-04-15 10:19:06 +02:00
page_ogmeta.tmpl [feature] Add extra opengraph meta tags (#4154) 2025-05-08 11:11:25 +00:00
page_stylesheets.tmpl [bugfix] Load instance-wide custom css in page stylesheets template (#3601) 2024-12-18 10:47:17 +01:00
profile-gallery.tmpl [chore/frontend] Fix id on recent posts/media heading (#4015) 2025-04-15 10:20:29 +02:00
profile.tmpl [chore/frontend] Fix id on recent posts/media heading (#4015) 2025-04-15 10:20:29 +02:00
profile_about_user.tmpl [feature] Allow user to choose "gallery" style layout for web view of profile (#3917) 2025-03-26 15:59:39 +00:00
profile_fields.tmpl [chore] Refactor HTML templates and CSS (#2480) 2023-12-27 11:23:52 +01:00
profile_header.tmpl [chore] render avatar in photoswipe slide, remove repeated alt text (#3985) 2025-04-11 12:05:26 +02:00
settings.tmpl [chore] Rename frontend.tmpl to settings.tmpl, remove unused "lightgray" class (#2674) 2024-02-21 16:11:11 +01:00
sign-in.tmpl [feature/frontend] add autocomplete + other helpful attributes to auth html pages (#4029) 2025-04-20 17:46:25 +02:00
sign-up.tmpl [frontend] Better autocapitalize/spellcheck settings on forms (#3077) 2024-07-08 09:38:27 +02:00
signed-up.tmpl [feature] New user sign-up via web page (#2796) 2024-04-11 11:45:53 +02:00
status.tmpl [feature/frontend] Hide "engagement" stats, edits, and other info under a little drop down to unclutter status info bar (#4021) 2025-04-18 17:36:26 +02:00
status_attachment.tmpl [feature] Update attachment format, receive + send focalPoint prop + use it on the frontend (#4052) 2025-04-26 15:03:05 +02:00
status_attributes.tmpl [chore/performance] Reuse Intl.DateTimeFormat for formatting times (#4013) 2025-04-15 10:04:47 +02:00
status_header.tmpl [feature] add microformat support (#3848) 2025-03-01 13:06:08 +01:00
status_info.tmpl [feature/frontend] Hide "engagement" stats, edits, and other info under a little drop down to unclutter status info bar (#4021) 2025-04-18 17:36:26 +02:00
status_poll.tmpl [chore] little frontend tweaks (#3852) 2025-03-02 11:27:30 +01:00
tag.tmpl [chore] Refactor HTML templates and CSS (#2480) 2023-12-27 11:23:52 +01:00
thread.tmpl [feature/frontend] Hide "engagement" stats, edits, and other info under a little drop down to unclutter status info bar (#4021) 2025-04-18 17:36:26 +02:00