I am Nik Butler

Knowledge Knolling

Learning as I go fixing my media cards

One thing I noted when I was posting my content into social media was that the preview of the site was; frankly bland as you can see from the following example

ExampleOfBlankCard.png

Not the most idea example; some digging around as ever and I locate the idea that I need to add some content into the Head element of the pages. Which means considering if i can have a default as well and then determine how to make sure that my pages have a 'featured image' created but thats for later. Now whilst I learn lets grab an image from my site and store that in my Cloudflare r2 bucket

knowldgeknowlers_mediameta.png

Okay now lets describe my header section as follows

  <meta property="og:description" content="Knowledge Knolling">
  <meta property="og:image" content="https://assets.knowledgeniches.com/knowldgeknowlers_mediameta.png">
  <meta property="og:url" content="https://knowledgeniches.com/">
  <meta property="og:type" content="website">
  <meta property="og:site_name" content="Knowledge Niches">

Lets see how this looks.

Okay this is not idea, its there but I clearly need a better scaled image in the card example_media_card.png

Though Discord does a better job of it. example_media_card_discord.png

I'l come back to this as I tweak my way back to running and blogging my own site. including making the images live within the borders of this page.

One drawback in using markdown in page creation is in refining how it handles the css for images in terms of allowing me to finesse layout .

Whilst I was assembling this page I ahve been making use of our own product Image Storage Explorer for Visual Studio Code to move and copy and handle content in the page as Markdown pastes linking back to the content.