[FEATURE REQUEST] Discord embedding / customizable Open Graph tags

[bobbywibowo]

[FEATURE REQUEST] Discord embedding / customizable Open Graph tags

[BobbyWibowo]

I need more details about this one. Which pages specifically that you want to have their Open Graph tags better?

Like, right off the bat, Open Graph tags are only applicable to HTML pages, meaning pages such as the homepage, auth page, FAQ, or album public pages.
For those examples above, we already have pretty decent Open Graph tags support built-in.

The following screenshots are taken on Discord:

Homepage:

A public album:

Those are intended to be customized from within views/_globals.njk, and optionally views/_layout.njk for even more direct control.

lolisafe/views/_layout.njk

Lines 32 to 58 in 13afe9a

	{% block opengraph %}
	<!-- Open Graph tags -->
	<meta property="og:url" content="{{ url }}" />
	<meta property="og:type" content="website" />
	<meta property="og:title" content="{{ title }}" />
	<meta property="og:description" content="{{ metaDesc or globals.description }}" />
	{%- if metaImage %}
	<meta property="og:image" content="{{ metaImage }}" />
	{%- endif %}
	<meta property="og:image" content="{{ root }}/icons/600px.png{{ versions[2] }}" />
	<meta property="og:image:width" content="600" />
	<meta property="og:image:height" content="600" />
	<meta property="og:image" content="{{ root }}/images/fb_share.png{{ versions[2] }}" />
	<meta property="og:image:width" content="1200" />
	<meta property="og:image:height" content="630" />
	<meta property="og:locale" content="en_US" />
	<!-- Twitter Card tags -->
	<meta name="twitter:card" content="summary_large_image">
	<meta name="twitter:title" content="{{ title }}">
	<meta name="twitter:description" content="{{ metaDesc or globals.description }}">
	{%- if metaImage %}
	<meta name="twitter:image" content="{{ metaImage }}">
	{% else %}
	<meta name="twitter:image" content="{{ root }}/icons/600px.png{{ versions[2] }}">
	{%- endif %}
	{% endblock %}

Making them to be customizable from the config file would be too cumbersome, so I was never against making changes directly to those two files, or more. After all, git stash is plenty reliable to stash your changes prior to pulling updates, then popping them back in.

[soren11]

I was actually referring to OG tags for the images themselves.

Which would be customizable by the user uploading the image.
The viewer would be an HTML page including that'd include
<meta name="twitter:card" content="summary_large_image">
<meta id="discord" name="twitter:image" content="https://example.com/linktotherawimage.png">

[BobbyWibowo]

Unfortunately something like that would require having a landing page for uploads, which we do not have.
The concept with this safe in particular is instead to share direct links to each uploads.

[soren11]

Alright, thanks