Title, meta tags and OG meta data are included in this theme. Sensible defaults are set for every page.
A pages front-matter title
, description
and image
will be used to generate meta tags.
<!-- layouts/default/_baseof.html -->
{{ block "meta_tags" . }}
{{ if .Params.description }}<meta name="description" content="{{ .Params.description }}" />{{ end }}
{{ if .Title }}<meta property="og:title" content="{{ .Title }}" />{{ end }}
<meta property="og:type" content="website" />
<meta property="og:url" content="{{ .Permalink }}" />
{{ if .Params.image }}<meta property="og:image" content="{{ .Params.image }}" />{{ end }}
{{ if .Params.description }}<meta property="og:description" content="{{ .Params.description }}" />{{ end }}
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="{{ .Site.Data.seo.og_meta.meta_twitter_site }}" />
<meta name="twitter:creator" content="{{ .Site.Data.seo.og_meta.meta_twitter_creator }}" />
{{ end }}
OG meta data is used to by Facebook & Twitter to display rich previews. Typically OG meta tags are used to optimise social media. There is a great CSS Tricks article which explains this stuff in detail.
Most of the OG meta data is taken from the pages front-matter.
You will need to update data/seo.yaml
# data/seo.yaml
og_meta:
meta_twitter_site: "@zerostaticio"
meta_twitter_creator: "@zerostaticio"
You can edit and add social media icons to the footer. This theme comes with font-awesome icons installed.
# data/seo.yaml
social:
- title: "Twitter"
fa_icon: "fab fa-twitter" # you can use any icon from font-awesome https://fontawesome.com/icons/twitter-square?style=brands
url: "https://www.zerostatic.io"
- title: "Github"
fa_icon: "fab fa-github"
url: "https://www.zerostatic.io"
- title: "Slack"
fa_icon: "fab fa-slack"
url: "https://www.zerostatic.io"