Jump to content

Problem with og:image and WhatsApp / Meta Share Debugger

Žarko Kuvalja

By Žarko Kuvalja
in General Support

 Share

Recommended Posts

Žarko Kuvalja Newbie

Žarko Kuvalja

Posted
Posted

Hi,

This is causing me headaches so I hope someone here might help me out and tell me I'm missing something dumb.

Using this: https://developers.facebook.com/tools/debug/?q=https%3A%2F%2Fzar.co.com%2Fwaypoint-agency-branding%2F
I keep getting the following error:

Quote

Provided og:image, http://zar.co.com/site/assets/files/1045/waypoint_og_image_optimized.png could not be downloaded. This can happen due to several different reasons such as your server using unsupported content-encoding. The crawler accepts deflate and gzip content encodings.

 

As far as I can tell, the only place where the og:image doesn't work is when trying to share a given link through WhatsApp Sharing via Facebook (share post) works as expected and loads the image.
I've tried using https for serving the image, switched now to http because some Stackexchange threads mentioned that as better. 
I've tried a more optimized .png, I've tried a .jpg.
I've enabled gzip on the server (shared hosting, cpanel).
I just can't figure out what is the issue here.

 

This is the actual code I'm using to generate the og:image link: 

       <meta property="og:image" content="<?php echo str_replace('https://', 'http://', $page->og_image_field->httpUrl); ?> "/>

The site in question - https://zar.co.com

 

Žarko Kuvalja Newbie

Žarko Kuvalja

Posted
  • Author
Posted
13 hours ago, poljpocket said:

Not that this will solve your problem or have anything to do with it, but I can see a <head> tag inside another <head> tag when looking at your source code.

W3C validity check brings some more problems to the surface, especially with your meta tags:

https://validator.w3.org/nu/?doc=https%3A%2F%2Fzar.co.com%2F

You could try fixing at least everything in <head> and try again.

Oh boy. Thanks, I'll comb through this.

AndZyk Hero Member

AndZyk

Posted
Posted

I can see the image when I enter your URL in WhatsApp.

But yes, it would probably be better to validate your HTML and remove the duplicate <head>-tag.
Also I would recommend using https for all your links, to avoid mixed content.
You also have a unnecessary space at the end of og:image content, but that should be no problem. 😉

Žarko Kuvalja Newbie

Žarko Kuvalja

Posted
  • Author
Posted (edited)
4 hours ago, AndZyk said:

I can see the image when I enter your URL in WhatsApp.

But yes, it would probably be better to validate your HTML and remove the duplicate <head>-tag.
Also I would recommend using https for all your links, to avoid mixed content.
You also have a unnecessary space at the end of og:image content, but that should be no problem. 😉

Thanks. Well, ok, then I can only guess that WhatsApp was not working primarily due to a too heavy image - the Waypoint agency branding page (one you tried) is the only one on which I have optimized the og:image PNG (down from over 1MB to about 500KB).

For the Meta share debugger errors - again, thanks to everyone for giving it a look.
I will clean up all errors you've pointed out and update the post in case any of those fixes end up also making the debugger error go away.

Edited by Žarko Kuvalja
  • Like 1
bernhard Hero Member

bernhard

Posted
Posted

Don't know if that's the issue, but you have a space at the end of your image path:

WP5o9jl.png

As I've had problems with getting og:image to work with WhatsApp + ProCache and the reason was ProCache removing quotes I'd bet it doesn't like your space at the end as well.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...