Advertisement:

Author Topic: [TUTO] Tell Facebook HOW to share your site's URLS  (Read 10761 times)

pixellegolas

  • Full Member
  • ***
  • Posts: 224
  • zwappa.se
Re: [TUTO] Tell Facebook HOW to share your site's URLS
« Reply #15 on: February 03, 2015, 12:57:50 pm »
I am using twitterfeed and it always seem to choose wrong image. It is always and image from another ad. Will this help. What exactly is it that makes it choose the right image?

ajolo2ky

  • Newbie
  • *
  • Posts: 8
Re: [TUTO] Tell Facebook HOW to share your site's URLS
« Reply #16 on: April 03, 2015, 11:06:14 am »
You want to add this in the <head> section, so (in item.php and/or main.php):

Code: [Select]
    function itemCustomHead(){
        echo '<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# website: http://ogp.me/ns/website#">';
        echo '<meta property="fb:app_id" content="YOURAPPID" />';
        echo '<meta property="og:type"   content="website" />';
        echo '<meta property="og:url" content="' . osc_item_url() . '" />';
        echo '<meta property="og:title" content="' . osc_item_title() . ' (' . osc_item_city() . ') '. '" />';
        echo '<meta property="og:description" content="<pre>'. htmlspecialchars(osc_item_description()) . '</pre>" />';

        if( osc_count_item_resources() > 0 ) {
                echo '<meta property="og:image" content="' . osc_resource_url() . '" />';
        }

    }
    osc_add_hook('header','itemCustomHead');
« Last Edit: April 10, 2015, 09:11:36 am by ajolo2ky »

pixellegolas

  • Full Member
  • ***
  • Posts: 224
  • zwappa.se
Re: [TUTO] Tell Facebook HOW to share your site's URLS
« Reply #17 on: April 08, 2015, 02:21:34 am »
Is it only the app-id that needs to be changed in above code?

By the way I see no HEAD in either item.php or main.php in theme osclasswizard
« Last Edit: April 08, 2015, 02:23:48 am by pixellegolas »

pixellegolas

  • Full Member
  • ***
  • Posts: 224
  • zwappa.se
Re: [TUTO] Tell Facebook HOW to share your site's URLS
« Reply #18 on: April 10, 2015, 02:58:41 am »
Getting a little random results now. When I dont do this hack everything works with twitterfeed except it chooses a low res picture to the post in facebook. When I add the "hack" it sometimes show a full res picture or an empty box where the picture should be

ajolo2ky

  • Newbie
  • *
  • Posts: 8
Re: [TUTO] Tell Facebook HOW to share your site's URLS
« Reply #19 on: April 10, 2015, 09:12:43 am »
Is it only the app-id that needs to be changed in above code?

By the way I see no HEAD in either item.php or main.php in theme osclasswizard


Yes, you should only change the APP ID (and any other fields you want to edit).
I'm using realestate theme so I can't help you with osclasswizard, sorry :/

akosijared

  • Newbie
  • *
  • Posts: 16
Re: [TUTO] Tell Facebook HOW to share your site's URLS
« Reply #20 on: July 05, 2015, 12:40:28 pm »
Not sure if this is already in the forum, did a quick search and didn't find it.

When someone shares your base url link on Facebook you can choose what image facebook will use by adding this to your theme's main.php

Code: [Select]
<meta property="og:image" content="http://www.yousite.com/oc-content/themes/youtheme/images/logo.jpg" />
Facebook scrapes pages every 24hs so you won't see a change immediately but can see it on: https://developers.facebook.com/tools/debug by entering your URL

If in Object Properties/og:image (result from fb debugger tool) you see the image you want job done, it will be working soon :)

Facebook does a good job picking the right thumbnail to share in item.php so no need to modify that.


Extras: if you want to change or add a longer text for your site title/description that the one you specified in the admin panel options, you can go for the following metas for fb

Code: [Select]
<meta property="og:title" content="Whatever title" />
<meta property="og:description" content="description of your site"/>

EXAMPLE FOR ITEM.PHP
Code: [Select]
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# website: http://ogp.me/ns/website#">
<meta property="fb:app_id" content="YOUR FB APP ID HERE" />
<meta property="og:type"   content="website" /> 
<meta property="og:url" content="<?php echo osc_item_url() ; ?>" />
<meta property="og:title" content="<?php echo osc_item_title(); ?>" />
<meta property="og:image" content="<?php echo osc_resource_url(); ?>" />

EXAMPLE FOR MAIN.PHP
Code: [Select]
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# website: http://ogp.me/ns/website#">
<meta property="fb:app_id" content="YOUR FB APP ID" />
<meta property="og:type"   content="website" /> 
<meta property="og:url" content="http://www.yoursite.com/" />
<meta property="og:title" content="what ever you like, can be different from general settings in your admin panel" />
<meta property="og:description" content="what ever you like"/>
<meta property="og:image" content="http://your_logo_at_least_200x200.jpg" />

hope it helps someone. cheers!

Can i just post the codes anywhere in main.php?

pixellegolas

  • Full Member
  • ***
  • Posts: 224
  • zwappa.se
Re: [TUTO] Tell Facebook HOW to share your site's URLS
« Reply #21 on: July 09, 2015, 01:00:57 pm »
This is scrape info from debugger. I always get the wrong picture in the post. I have tried placing in item.php in the top where there is no header. I tried in header.php within <head> tag

Code: [Select]
When and how we last scraped the URL
Time Scraped för 2 sekunder sedan
Response Code 206
Fetched URL http://www.zwappa.se/for-hemmet/mobler-heminredning/ikea-kivik_i99
Canonical URL http://www.zwappa.se/for-hemmet/mobler-heminredning/ikea-kivik_i99 (0 likes, 0 shares)
Server IP 2a00:16d8:2:200::20
Notice
Warnings That Should Be Fixed
Inferred Property The 'og:description' property should be explicitly provided, even if a value can be inferred from other tags.
og:image could not be downloaded or is too small og:image was not defined, could not be downloaded or was not big enough. Please define a chosen image using the og:image metatag, and use an image that's at least 200x200px and is accessible from Facebook. Image 'http://www.zwappa.se/oc-content/uploads/0/26_thumbnail.jpg' will be used instead.
These are the raw tags that we found
Meta Tag <meta property="fb:app_id" content="XXXXXXXXXXXXXXXXXXX" />
Meta Tag <meta property="og:type" content="website" />
Meta Tag <meta property="og:url" content="http://www.zwappa.se/for-hemmet/mobler-heminredning/ikea-kivik_i99" />
Meta Tag <meta property="og:title" content="IKEA kivik" />
Meta Tag <meta property="og:image" content="http://www.zwappa.se/0." />
Based on the raw tags, we constructed the following Open Graph properties
fb:app_id XXXXXXXXXXXXXXX
og:url http://www.zwappa.se/for-hemmet/mobler-heminredning/ikea-kivik_i99
og:type website
og:title IKEA kivik
og:image
og:description Möbler & heminredning Huddinge, Fin soffa med schäslong. Fint skick - KIVIK är en rymlig soffserie där du sitter mjukt, djupt och med bekvämt stöd för ..., Möbler & heminredning Huddinge
og:updated_time 1436432463


Using this code:

Code: [Select]
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# website: http://ogp.me/ns/website#">
<meta property="fb:app_id" content="XXXXXXXXXXXX" />
<meta property="og:type"   content="website" /> 
<meta property="og:url" content="<?php echo osc_item_url() ; ?>" />
<meta property="og:title" content="<?php echo osc_item_title(); ?>" />
<meta property="og:image" content="<?php echo osc_resource_url(); ?>" />

pixellegolas

  • Full Member
  • ***
  • Posts: 224
  • zwappa.se
Re: [TUTO] Tell Facebook HOW to share your site's URLS
« Reply #22 on: October 09, 2015, 01:12:36 am »
I am still only getting text with no image when it posts to facebook. The scraper is telling me:

Warnings That Should Be Fixed

Inferred Property   The 'og:description' property should be explicitly provided, even if a value can be inferred from other tags.

og:image could not be downloaded or is too small   og:image was not defined, could not be downloaded or was not big enough. Please define a chosen image using the og:image metatag, and use an image that's at least 200x200px and is accessible from Facebook. Image 'http://www.zwappa.se/oc-content/uploads/0/26_thumbnail.jpg' will be used instead. Consult http://developers.facebook.com/docs/sharing/webmasters/crawler for more troubleshooting tips.

Switching from symnel theme to osclasswizard works like a charm so something is happening in the header files or something
« Last Edit: October 09, 2015, 02:14:01 am by pixellegolas »

uve

  • Newbie
  • *
  • Posts: 26
Re: [TUTO] Tell Facebook HOW to share your site's URLS
« Reply #23 on: April 23, 2016, 01:24:12 pm »
Nice tutorial.
« Last Edit: May 17, 2017, 12:14:43 am by uve »