Christophe Mineau

La Belle Note

Partageons nos idées, partageons nos savoir-faire.

Fork Guppy 5 - Facebook Open Graph Meta tags

Fork Guppy 5 - Facebook Open Graph Meta tags

3-Minute Read

Table of contents :

/* (voir la traduction française dans la zone telechargement du site de l’auteur www.labellenote.fr)

Fork for Guppy 5.xx : FB_og_meta, by C.Mineau www.labellenote.fr
V2.1 : add news capability + bug fix
V2.2 : security script name check + install in inc/incpage + SDK install in inc/inchead
V2.3 : add og:image:width tag + fix image search pattern + refactoring Guppy 5.2.8
V2.4 : https
V2.5 : fix mime constant (deprecated)

This Fork is suitable for you if you want to share Guppy articles or news (only for the moment) on Facebook.
The aim is to introduce the meta tags required by the facebook Open Graph API in order to select what are the details to be shared
on a particular page :
title/ description / site name / picture …
These informations must appear in a meta tag with attribute property=“og:xxxx” in the tag.

Proposed mapping, for an Article or news :
og:site_name => the name of the site
og:url ==> url of article or news
og:type ==> article (constant)
og:title ==> The title of the Guppy article or news
og:image ==> First image in the page with alt field =“FB”
og:description == > First lines of the article or news + invitation to read the article or news on the site
og:locale ==> “fr_FR” or “en_US”
! take care for news to only display a single news before sharing on FB. !
*/

Installation instructions :
-————————-
First unzip the archive in a local folder
1- place the file Facebook_SDK.inc on your site in the inc/inchead folder.
2- open the file FB_og_meta.inc file
3- locate the line $FBdefault_image=“skins/skin01_LBN_2014/img/photo.jpg”; (should be line 72, the value here is an example)
4- Modify the value of the default image to be selected if nothing found in the article.
2- place the file FB_og_meta.inc on your site in the inc/incpage folder.

Use :
-—
1- You need first to introduce the FaceBook Share button at the bottom of your news and articles
In the Guppy “admin/structure/Social network code for the services” box, add the following code:

2- In your articles or news, you only have to select the picture you want to be displayed on Facebook as thumbnail for your share,
you do so by entering FB in the field “texte de remplacement”/“Replacement text”
That’s all, when clicking on the share button, your article or news should be given it’s true title, the url should be correct, and the description should be the beginning
of your article + “… read more …”""
Note, for the news, it will work only if you display a single news, not when displaying the list of the last news (just click on a title of news, then share it)

In case of difficulty, use the FB sharing debugger page :
https://developers.facebook.com/tools/debug/sharing/



Say Something


Older readers comments


Recent Posts

Categories

About

Site de partage et d'échange de Christophe Mineau.