Open Graph Information

Hosting on Micro.blog
1

I’ve been struggling with the Opengraph information shared with the mb plugin.

I’m either going mad or the only way it works if for the image to be in an <img> tag but doesnt work if the post is in markdown using ![](url)

My head meta data is as follows:

<!-- Open Graph -->
		<meta name="twitter:card" content="summary" />
 
    <!-- Titles -->
        {{ with .Site.Params.title }}
			<meta property="og:site_name" content="{{ . }}" />
		{{ end }}
		{{ with .Title }}
			<meta name="twitter:title" content="{{ . }}" />
        	<meta property="og:title" content="{{ . }}" />
		{{ else }}
 			<meta name="twitter:title" content="{{ .Site.Title }}" />
        	<meta property="og:title" content="{{ .Site.Title }}" />
		{{ end }}
			<meta name="twitter:description" content="{{ .Summary }}" />
			<meta property="og:description" content="{{ with .Description }}{{ . }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end }}" />
			<meta property="og:type" content="{{ with .Title }}article{{ else }}website{{ end }}" />
			<meta property="og:url" content="{{ .Permalink }}" />
	<!-- Images -->
			{{ with .Params.images }}
   				{{ range first 6 . }}
       				<meta property="og:image" content="{{ . | absURL }}" />
        			<meta name="twitter:image" content="{{ . }}" />
    			{{ end }}
			{{ else }}
				<meta property="og:image" content="https://www.gr36.com/uploads/2021/a2b5ba7293.png" />
        		<meta name="twitter:image" content="https://www.gr36.com/uploads/2021/a2b5ba7293.png" />
			{{ end }}

			{{ with .Params.audio }}
    			<meta property="og:audio" content="{{ . }}" />
			{{ end }}

     <!-- Video -->
			{{ with .Params.videos }}
  				{{ range first 1 . }}
        			<meta property="og:video" content="{{ . | absURL }}" />
    			{{ end }}
			{{ end }}

Is there a way to make this work, or am I missing something?

3

At least I’m not going crazy!

1 Like
5

I wouldn’t mind so much but publishing from Ulysses does so in markdown with no way to change it.

I thought the tag would be pulled from the HTML published page?

6

The tag, when pulling from Params, is happening at the same time the HTML is being generated. So the <img> does not exist when the template is being processed.

This is all just another vote for some kind of frontmatter access on custom themes, at least.

1 Like
9

Has this problem been fixed of the og plugin with the Markdown og code?

And can we use tag also while writing in Markdown to make sure the image goes in the og tag via this plugin without such errors?