CODEWITHSUNDEEP
htmlfacebookfacebook-share
PabloM
PabloM

Reputation: 29

adding meta og:image property to share custom facebook links using boostrap and flask

I have a website called www.caminemosjuntos.com.ar and I add the facebook share link button but the default preview image is not what I want to show. So I try to add <meta og:image property inside the head to customize it but when I debug the page I notice that browser is rendering inside the body tag. I'm using python-flask with boostrap and templates. This is how start my header.html:

'''

    <!DOCTYPE HTML>
    <html lang="en">

    <head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes">
    <meta name="description" content="">
    <meta name="author" content="">
    <meta property="og:image"         content="https://www.caminemosjuntos.com.ar/static/img/pathway.jpeg" />

'''

and browser is rendering from post section: (post.html include header.html)

'''

    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes">
    <meta charset="utf-8"><meta name="description" content="">
    <meta name="author" content="">
    <meta property="og:image" content="https://www.caminemosjuntos.com.ar/static/img/pathway.jpeg">
    <title>Caminemos juntos</title>

'''

How can I do to fix this? Facebook is still saying that I don't have explicitly the og:image.

Thanks

Upvotes: -1

Views: 489

Answers (1)

Michael J. Gleeson
Michael J. Gleeson

Reputation: 1

I am guessing that your image could be too big try reducing the size or try a smaller image. Try different sizes and resolutions.

See: https://developers.facebook.com/docs/sharing/best-practices#images

Upvotes: 0

Related Questions