Forums Webou.net - Hébergement gratuit et sans publicités avec PHP/MySQL

Hébergement Webou.net => Tutoriels => Discussion démarrée; par: jom006 le 19 Mai 2010, 15:14:25



Titre: Bouton "J'aime" de Facebook
Posté par: jom006 le 19 Mai 2010, 15:14:25
Bonjour,

On commence à le voir un peu près par tout, il a conquis les blogs, les sites et surtout les TV sites de partage de vidéos comme Youtube ou Dailymotion, c'est bien évidemment le bouton "J'aime" de Facebook.

(http://www.stouny.com/blog/image/jaime_facebook_dailymotion.gif)

Comme vous pouvez le constater, moi aussi je l'ai ajouter sur mon site ! et je vais vous expliquer comment faire.

Première étape :

Voila le lien de la page qui fourni ce service http://developers.facebook.com/docs/reference/plugins/like, je croix pas qu'il y a une version française...ne vous inquiétez pas, je suis là !

Si vous descendez tout en bas de la page, vous allez trouver une petit application qui va vous fournir le code a insérer sur votre site. Dans le but de la remplir correctement je vais vous expliquer tous les champs, le 1er est celui de URL (lien) de votre site/web, le 2eme est un champ afin choisir si vous voulais une vue simple du bouton, ou une phrase accoter disant le nombre des personnes qui aime, le 3eme est une case que si vous la cocher, elle va montrer l'image de chaque utilisateur facebook qui a cliquer sur le bouton devant cette élément C'est à dire dans votre site, le 4eme c'est pour définir sa largeur (pas le bouton mais tout l'élément, la phrase y inclus) personnellement je l'ai changer à 400px, le 5eme est pour choisir ce qu'il va apparaitre à l'intérieure du bouton soit "J'aime" ou "Recommande", le 6eme représente le style d'écriture et le 7eme et dernier est pour choisir le style ou la couleur du bouton.

Après que vous remplissez correctement tous les champs cliquer sur le bouton "Get code", une fenêtre apparaitra avec 2 codes différents, le premier est en langage HTML et le 2eme est en XFBML qui à besoin du script sur cette page http://developers.facebook.com/docs/reference/javascript/. Copiez celui qui vous parer bien et coller le à une place confortable sur votre site.

Mais, mais...

Oui, oui, comme vous pouvez voir ce bouton n'est pas bien utile si on a plusieurs articles, alors on veux faire un bouton pour chaque articles mais on va quand même pas mettre un code spécifique a chacun, on aura donc besoin d'un peu du PHP.

Comment procéder ?

Ce qu'on doit faire au juste, c'est juste changer l'URL dans le bouton, et heureusement qu'une fonction PHP existe déjà, bref voila le code :
Code:
<iframe src="http://www.facebook.com/plugins/like.php?href=<?php 
echo urlencode($_SERVER['PHP_SELF'].?.$_SERVER['QUERY_STRING']); 
?>
&layout=standard&show_faces=false&width=400&action=like&font=arial&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:400px; height:25px">
</iframe>

Ce que j'ai fait c'est juste mettre :

Code:
<?php echo urlencode($_SERVER['PHP_SELF'].?.$_SERVER['QUERY_STRING']); ?>

devant le src="http://www.facebook.com/plugins/like.php?href= et j'ai aussi mit 25 comme valeur pour height, facile, nan ?!

Ce code PHP va apporter l'URL qui ce trouve dans la barre d'adresse et le coller.

Voila c'est tout !

Cordialement,
Jom006.


Titre: Re: Bouton "J'aime" de Facebook
Posté par: nabil-y le 20 Août 2010, 15:43:26
merci ça dois être utile  ;D


Titre: Re: Bouton "J'aime" de Facebook
Posté par: jom006 le 20 Août 2010, 16:25:18
Bien sûr que ça peut servir, déjà il permet de promouvoir votre site et lui donner une touche a la mode puisque maintenant tous les sites intègre cette fonction.

Je me permet aussi d'ajouter une petite info, pour ceux qui veulent que au lieu du mot "j'aime" apparait "recommander" il faut juste changer un petit détail dans le script fourni ci-dessus :

Code:
<iframe src="http://www.facebook.com/plugins/like.php?href=<?php 
echo urlencode($_SERVER['PHP_SELF'].?.$_SERVER['QUERY_STRING']); 
?>
&layout=standard&show_faces=false&width=400&action=recommend&font=arial&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:400px; height:25px">
</iframe>

Pour ceux qui n'ont rien vu passé, j'ai simplement modifier cela :

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php
echo urlencode($_SERVER['PHP_SELF'].’?’.$_SERVER['QUERY_STRING']);
?>&layout=standard&show_faces=false&width=400&
action=recommend&font=arial&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:400px; height:25px">
</iframe>


Vous pouvez toutefois switcher entre "recommend" ou "like"
Cordialement :)


Titre: Re: Bouton "J'aime" de Facebook
Posté par: le hollandais volant le 12 Septembre 2010, 00:44:42
Notons que ceci, c'est pour un bouton "j'aime".
Pour un bouton "partager le lien", il suffit d'un simple lien :

http:/ /www.facebook.com/sharer.php?u=mon_url_ici


Titre: Re: Bouton "J'aime" de Facebook
Posté par: jom006 le 12 Septembre 2010, 01:17:55
Et pour un bouton partager plus personnaliser il faut importer le script comme ceci

Code:
<a name="fb_share" type="button_count" class="fb_share_s" share_url=" VOTRE URL "></a>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>


ça donne un truc comme ça : (http://www.jarodxxx.com/public/Tutoriels/facebook/Share_buttonCount.png)

Y en a d'autre modèles sur http://www.jarodxxx.com/index.php?post/2009/12/01/Tuto%3A-Creer-un-bouton-de-partage-a-facebook  (http://www.jarodxxx.com/index.php?post/2009/12/01/Tuto%3A-Creer-un-bouton-de-partage-a-facebook)