Add Open Graph meta tags to site

[p-shahi]

Done Criteria

Add these basic metadata tags

og:title - The title of your object as it should appear within the graph, e.g., "The Rock".
og:type - The [type](https://ogp.me/#types) of your object, e.g., "video.movie". Depending on the type you specify, other properties may also be required.
og:image - An image URL which should represent your object within the graph.
og:url - The canonical URL of your object that will be used as its permanent ID in the graph, e.g., "https://www.imdb.com/title/tt0117500/".
og:description - A one to two sentence description of your object.

See: https://ogp.me/#metadata and https://ahrefs.com/blog/open-graph-meta-tags/#which-open-graph-tags-to-use

Why Important

This will increase the chances of more traffic and viewers, better SEO.
See quote from: https://ahrefs.com/blog/open-graph-meta-tags/#why-are-open-graph-tags-important

People are arguably more likely to see and click shared content with optimized OG tags, which means more social media traffic to your website.

There are three reasons for this:

They make content more eye-catching in social media feeds.
They tell people what the content is about at a glance.
They help Facebook understand what the content is about, which can help increase your brand visibility through search.

Without meta tags, specifically og:image, the site preview looks lackluster when shared on social media

cc: @2color thanks for flagging this necessary enhancement

[dhuseby]

@p-shahi and this one?