blogger sharing animation gif on facebook not working

Question

I am trying to add a gif to my blogger post and want to share the animated gif to Facebook with an external link. the problem I am facing that the blogger is generating a custom thumbnail for og:image property. instead, I want to use a CDN link of gif which should be shared on Facebook.

Here is my post: I want to use this url instead of the auto generated thumbnail.

  <img src ="https://thumbs.gfycat.com/QualifiedHilariousBufflehead-size_restricted.gif">

Here is my header code

<meta content="https://gifs.blogspot.com" name="og:site_name " />
<meta expr:content="data:view.title.escaped" property="og:title" />
<meta expr:content="data:view.description.escaped" property="og:description" />
<b:if cond="data:view.featuredImage">
  <meta
    expr:content='resizeImage(data:view.featuredImage, 1200, "1200:630")'
    property="og:image"
  />
  <b:elseif cond="data:widgets" />
  <b:loop
    reverse="true"
    values="data:widgets.Blog.first.posts where (p =&gt; p.featuredImage) map (p =&gt; p.featuredImage)"
    var="imageUrl"
  >
    <meta
      expr:content='resizeImage(data:imageUrl, 1200, "1200:630")'
      property="og:image"
    />
  </b:loop>
  <b:elseif cond="data:blog.postImageUrl" />
  <meta
    expr:content='resizeImage(data:blog.postImageUrl, 1200, "1200:630")'
    property="og:image"
  />
</b:if>
<meta
  content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1"
  name="viewport"
/>
<title><data:view.title.escaped/></title>
<b:include data="blog" name="all-head-content" />

Answer 1

Try to delete the resize operator

<b:if cond="data:view.featuredImage">
  <meta
    expr:content='data:view.featuredImage'
    property="og:image"
  />
  <b:elseif cond="data:widgets" />
  <b:loop
    reverse="true"
    values="data:widgets.Blog.first.posts where (p =&gt; p.featuredImage) map (p =&gt; p.featuredImage)"
    var="imageUrl"
  >
    <meta
      expr:content='data:imageUrl'
      property="og:image"
    />
  </b:loop>
  <b:elseif cond="data:blog.postImageUrl" />
  <meta
    expr:content='data:blog.postImageUrl'
    property="og:image"
  />
</b:if>

Answer 2

I think it can not be done using blogger. As I see to share a playable GIF on facebook from a link you shared the open graph tags should be like this:

og:image: The link to GIF file

og:url: The same link from og:image

so in blogger you can't do it, unless i guess id you store all the GIF images in a subdomain with the same domain of your blog