diff options
Diffstat (limited to 'web')
| -rw-r--r-- | web/template/header.tmpl | 117 |
1 files changed, 79 insertions, 38 deletions
diff --git a/web/template/header.tmpl b/web/template/header.tmpl index 05e47991a..2759ab804 100644 --- a/web/template/header.tmpl +++ b/web/template/header.tmpl @@ -17,64 +17,105 @@ // along with this program. If not, see <http://www.gnu.org/licenses/>. */ -}} -<!DOCTYPE html> +{{- /* + NESTED TEMPLATE DECLARATIONS + If some if/else macro is used multiple times, declare it once here instead. + When invoking these nested templates, remember to pass in the values passed + to the executing template, ie., use '{{ template "example" . }}' not + '{{ template "example" }}', otherwise you'll end up with empty variables. +*/ -}} +{{ define "thumbnailType" }}{{ if .instance.ThumbnailType }}{{ .instance.ThumbnailType }}{{ else }}image/png{{ end }}{{ end }} +{{ define "instanceTitle" }}{{ if .ogMeta }}{{ .ogMeta.Title }}{{ else }}{{ .instance.Title }} - GoToSocial{{ end }}{{ end }} + +{{- /* + BOILERPLATE GOES HERE +*/ -}} +<!DOCTYPE html> <!-- header.tmpl --> <html lang="en"> - <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> + + {{- /* + ROBOTS META TAGS + If this template was provided with a specific robots meta policy, use that. + Otherwise, fall back to a default restrictive policy. + See: https://developers.google.com/search/docs/crawling-indexing/robots-meta-tag + */ -}} <meta name="robots" content="{{ if .robotsMeta }}{{ .robotsMeta }}{{ else }}noindex, nofollow{{ end }}"> - {{ if .ogMeta }}{{ if .ogMeta.Locale }} - <meta name="og:locale" content="{{ .ogMeta.Locale }}"> - {{ end }} - <meta property="og:type" content="{{ .ogMeta.Type }}"> - <meta property="og:title" content="{{ .ogMeta.Title }}"> - <meta property="og:url" content="{{ .ogMeta.URL }}"> - <meta property="og:site_name" content="{{ .ogMeta.SiteName }}"> - <meta property="og:description" {{ .ogMeta.Description | noescapeAttr }}> - {{ if .ogMeta.ArticlePublisher }} - <meta property="og:article:publisher" content="{{ .ogMeta.ArticlePublisher }}"> - <meta property="og:article:author" content="{{ .ogMeta.ArticleAuthor }}"> - <meta property="og:article:modified_time" content="{{ .ogMeta.ArticleModifiedTime }}"> - <meta property="og:article:published_time" content="{{ .ogMeta.ArticlePublishedTime }}"> - {{ end }}{{ if .ogMeta.ProfileUsername }} - <meta property="og:profile:username" content="{{ .ogMeta.ProfileUsername }}"> - {{ end }} - <meta property="og:image" content="{{ .ogMeta.Image }}"> - {{ if .ogMeta.ImageAlt }} - <meta property="og:image:alt" content="{{ .ogMeta.ImageAlt }}"> - {{ end }}{{ if .ogMeta.ImageWidth }} - <meta property="og:image:width" content="{{ .ogMeta.ImageWidth }}"> - <meta property="og:image:height" content="{{ .ogMeta.ImageHeight }}"> - {{ end }}{{ end }} - <link rel="shortcut icon" href="{{ .instance.Thumbnail }}" - type="{{ if .instance.ThumbnailType }}{{ .instance.ThumbnailType }}{{ else }}image/png{{ end }}"> - {{ if .rssFeed }} - <link rel="alternate" type="application/rss+xml" href="{{ .rssFeed }}" - title="{{ if .ogMeta }}{{ .ogMeta.Title }}{{ else }}{{.instance.Title}}{{ end }}">{{ end }} + + {{- /* + OPEN GRAPH META TAGS + To enable fancy previews of links to GtS posts/profiles shared via instant + messaging, or other social media, parse out provided Open Graph meta tags. + */ -}} + {{ if .ogMeta -}} + {{ if .ogMeta.Locale }}<meta name="og:locale" content="{{ .ogMeta.Locale }}">{{ end }} + <meta property="og:type" content="{{ .ogMeta.Type }}"> + <meta property="og:title" content="{{ .ogMeta.Title }}"> + <meta property="og:url" content="{{ .ogMeta.URL }}"> + <meta property="og:site_name" content="{{ .ogMeta.SiteName }}"> + <meta property="og:description" {{ .ogMeta.Description | noescapeAttr }}> + {{ if .ogMeta.ArticlePublisher }} + <meta property="og:article:publisher" content="{{ .ogMeta.ArticlePublisher }}"> + <meta property="og:article:author" content="{{ .ogMeta.ArticleAuthor }}"> + <meta property="og:article:modified_time" content="{{ .ogMeta.ArticleModifiedTime }}"> + <meta property="og:article:published_time" content="{{ .ogMeta.ArticlePublishedTime }}"> + {{ end }} + {{ if .ogMeta.ProfileUsername }}<meta property="og:profile:username" content="{{ .ogMeta.ProfileUsername }}">{{ end }} + <meta property="og:image" content="{{ .ogMeta.Image }}"> + {{ if .ogMeta.ImageAlt }}<meta property="og:image:alt" content="{{ .ogMeta.ImageAlt }}">{{ end }} + {{ if .ogMeta.ImageWidth }} + <meta property="og:image:width" content="{{ .ogMeta.ImageWidth }}"> + <meta property="og:image:height" content="{{ .ogMeta.ImageHeight }}"> + {{ end }} + {{- end }} + + {{- /* + ICON + For icon, provide a link to the instance thumbnail. If the instance admin has + set a custom thumbnail, use the type they uploaded, else assume image/png. + See: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel#icon + */ -}} + <link rel="icon" href="{{ .instance.Thumbnail }}" type="{{ template "thumbnailType" . }}"> + <link rel="apple-touch-icon" href="{{ .instance.Thumbnail }}" type="{{ template "thumbnailType" . }}"> + <link rel="apple-touch-startup-image" href="{{ .instance.Thumbnail }}" type="{{ template "thumbnailType" . }}"> + + {{- /* + RSS FEED + To enable automatic rss feed discovery for feed readers, provide the 'alternate' + link only if rss is enabled. + See: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel#alternate + */ -}} + {{ if .rssFeed -}} + <link rel="alternate" type="application/rss+xml" href="{{ .rssFeed }}" title="{{ template "instanceTitle" . }}"> + {{- end }} + + {{- /* + STYLESHEET STUFF + To try to speed up rendering a little bit, offer a preload for each stylesheet. + See: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preload. + */ -}} <link rel="preload" href="/assets/dist/_colors.css" as="style"> <link rel="preload" href="/assets/dist/base.css" as="style"> - {{range .stylesheets}} - <link rel="preload" href="{{.}}" as="style"> - {{end}} + {{ range .stylesheets }}<link rel="preload" href="{{ . }}" as="style">{{ end }} <link rel="stylesheet" href="/assets/dist/_colors.css"> <link rel="stylesheet" href="/assets/dist/base.css"> - {{range .stylesheets}} - <link rel="stylesheet" href="{{.}}"> - {{end}}<title>{{ if .ogMeta }}{{ .ogMeta.Title }}{{ else }}{{.instance.Title}} - GoToSocial{{ end }}</title> + {{ range .stylesheets }}<link rel="stylesheet" href="{{ . }}">{{ end }} + <title>{{ template "instanceTitle" . }}</title> </head> <body> <div class="page"> <header> - <a aria-label="{{.instance.Title}}. Go to instance homepage" href="/" class="nounderline header"> + <a aria-label="{{ .instance.Title }}. Go to instance homepage" href="/" class="nounderline header"> <img src="{{ .instance.Thumbnail }}" alt="{{ if .instance.ThumbnailDescription }}{{ .instance.ThumbnailDescription }}{{ else }}Instance Logo{{ end }}" /> <h1> - {{.instance.Title}} + {{ .instance.Title }} </h1> </a> </header> |