Search code examples
facebooksymfonyseosymfony-sonata

Symfony2 / Sonata SEO Bundle / og:image


Can't for the life of me seem to work this one out. I have added the following to my 'base' twig's head:

  <html {{ sonata_seo_html_attributes() }}>
<head {{ sonata_seo_head_attributes() }}>
    {{ sonata_seo_title() }}
    {{ sonata_seo_metadatas() }}
    {{ sonata_seo_link_canonical() }}
    {{ sonata_seo_lang_alternates() }}

Which works great, but running Facebook debug, It is telling me I need to explicitly define og:image.

og:image is missing. The og:image meta tag is necessary for Facebook to render a News Feed story that generates a high click-through rate.

Now I've looked through the code and on Google but can't seem to find any mention of it, but I can't believe this is just an issue I am experiencing.

I'm trying to use it from within SonataNewsBundle / Media Bundle, and my images are loaded onto the page using:

   <img data-interchange="[{% path post.image, 'small' %}, (small)], [{% path post.image, 'big' %},(large)]">

I have tried adding a Meta block to News/View and putting this:

   {% block meta %}
   <meta property="og:image" content="{% media post.image, 'big' %}" />
   {% endblock meta %}

But get this when debugging:

Object at URL 'http://www."mysite".com/news/2014/6/17/woop-just-testing' 
of type 'article' is invalid because the given value 
'<img alt=' for property 'og:image:url' 
could not be parsed as type 'url'.

So then I tried:

 {% block meta %}
 <meta property="og:image" content="{% path post.image, 'big' %}" />
 {% endblock meta %}

But get this instead:

Object at URL 'http://www."mysite".com/news/2014/6/17/woop-just-testing' of type 
'article' is invalid because the given value 
'/uploads/media/news/0001/01/thumb_3_news_big.jpeg' for property 
'og:image:url' could not be parsed as type 'url'.

Any help greatly appreciated. Doug.


Solution

  • Managed to sort it, possibly not the best way but works...

    In config,yml I have added the complete path to the Sonata_media section:

    cdn:
        server:
            path: http://www.--mywebsite--.com/uploads/media/
    

    Instead of:

    cdn:
        server:
            path: /uploads/media/
    

    And use this to set the Meta:

    {% block meta %}
    <meta property="og:image" content="{% path post.image, 'big' %}" />
    {% endblock meta %}