Bouton Facebook valide W3C : Tuto phpBB3

Si vous avez une astuce informatique sympa sur un sujet divers ou sur les logiciels en général (bureautique, photos, son...) partagez vos connaissance ici.

Modérateur: Modérateur

Règles du forum
.
Merci de consulter la charte du forum avant de poster.
Rappel : Le langage SMS n'est pas toléré sur ce forum. Les demandes d'aide écrites en SMS ou formulées dans un français trop approximatif ne seront pas traitées.

Bouton Facebook valide W3C : Tuto phpBB3

Messagepar Renard » 12 Aoû 2011, 10:06

****************************************************************************************************************
Mise à jour au 19 juillet 2012 Facebook ayant supprimé le bouton Share ou rencontrant des difficultés avec.

Pour le bouton "Partager" voici un script aux normes W3C.
Ici un exemple d'intégration mais vous pouvez placer ce script où bon vous semble.


Ajout du bouton j'aime de facebook via AddThis :

Dans viewtopic_body, trouver :

Code: Tout sélectionner
   <p class="author"><!-- IF S_IS_BOT -->{postrow.MINI_POST_IMG}<!-- ELSE --><a href="{postrow.U_MINI_POST}">{postrow.MINI_POST_IMG}</a><!-- ENDIF -->{L_POST_BY_AUTHOR} <strong>{postrow.POST_AUTHOR_FULL}</strong> &raquo; {postrow.POST_DATE} </p>


Ajouter après :

Code: Tout sélectionner
            <!-- AddThis Button BEGIN -->         
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_facebook_like" title="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_button_pinterest_pinit"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
<script type="text/javascript" src="https:////s7.addthis.com/js/250/addthis_widget.js#pubid=ra-501027a709e97612"></script>
<br /><br />
<!-- AddThis Button END -->


Rafraîchir le cache.

*****************************************************************************************************************************



Il est surprenant de constater que les boutons "Facebook" et "+1" de Google se moquent carrément de la norme W3C. :pct:
Leurs boutons fleurissent un peu partout, comment y échapper, mais ils rendent votre site invalide au test W3C.
Voici comment régler le problème.

Prenons l'exemple d'un forum phpBB3 et intégrons le bouton Google en même temps que le bouton Facebook.
Les propriétaires de forums dotés d'un module de réécriture de PHPBB SEO sont également concernés, il suffit juste de modifier une variante comme expliqué sur le site de DCZ. (Nous y reviendrons dans ce tuto)
Pour les propriétaires de site en php (hors forum phpBB) la solution est encore plus simple, seule la partie de l'affichage du bouton vous concerne.

Mise à jour du 31 août 2011
Testé avec IE 7/8/ et 9, Firefox et Google Chrome.


Les fichiers à modifier sont :

viewtopic.php,
styles/prosilver/template/overall_header.html,
styles/prosilver/template/viewtopic_body.html

Ce MOD est très facile à mettre en place, cela prendra environ 3 minutes.


[surligne]Ouvrir viewtopic.php[/surligne]

Trouver (vers la ligne 690) :

Code: Tout sélectionner
'FORUM_ID'       => $forum_id,


Ajouter après : (pour les forums phpBB3 sans module SEO)

Code: Tout sélectionner
   // Bouton plus un Google Facebook
   'U_FB'    => urlencode(generate_board_url() . "/viewtopic.$phpEx?f=$forum_id&t=$topic_id"),
   // Bouton plus un Google Facebook


Ajouter après : (pour les forums phpBB3 avec module SEO)

Code: Tout sélectionner
   // Bouton plus un Google Facebook
   'U_FB'    => append_sid("{$phpbb_root_path}viewtopic.$phpEx", "f=$forum_id&amp;t=$topic_id"),
   // Bouton plus un Google Facebook

:ok:) Merci à Forge pour la réécriture de l'URL : http://www.phpbb-seo.com/fr/forum-phpbb/sujet5817.html


[surligne]Ouvrir styles/prosilver/template/overall_header.html[/surligne]

Trouver :

Code: Tout sélectionner
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9" />


Ajouter après :

Code: Tout sélectionner
<!-- Bouton Facebook -->
<?php
function is_facebook(){
   if(stristr($_SERVER["HTTP_USER_AGENT"],'facebook'))
   return true;
}
if(is_facebook()){
echo '
<meta property="og:title" content="{TOPIC_TITLE}" />
<meta property="og:site_name" content="{SITENAME}" />'
;}
?>
<!-- Bouton Facebook -->
<!-- +1 Google -->
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<!-- Fin + 1 Google -->

:ok:) Merci à Grégoire Panverne pour l'astuce permettant de contourner la balise "Property" : http://gregoire-penverne.fr/1574-facebo ... dation-w3c


[surligne]Ouvrir styles/prosilver/template/viewtopic_body.html[/surligne]

Trouver :

Code: Tout sélectionner
<!-- IF S_FORUM_RULES -->


Ajouter avant :

Code: Tout sélectionner
   <!-- Bouton plus un Google Facebook -->
           <ul class="linklist leftside">   
             <li><div class="g-plusone"></div></li>
             <li><object type="application/xhtml+xml" data="https:////www.facebook.com/plugins/like.php?href={U_FB}&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;height=21" style="width:100px; height:21px;">
<!--[if IE]>
<iframe src="https:////www.facebook.com/plugins/like.php?href={U_FB}&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;height=21" style="width:100px; height:21px;" allowtransparency="true" frameborder="0"></iframe>
<![endif]-->
               </object>
           </li>
          </ul>     
   <div class="clear"></div>     
   <!-- Fin bouton plus un Google Facebook -->


Trouver (vers la ligne 285) :

Code: Tout sélectionner
   <!-- IF PAGINATION or TOTAL_POSTS -->
      <div class="pagination">
         {TOTAL_POSTS}


Ajouter avant :

Code: Tout sélectionner
<!-- Bouton plus un Google Facebook -->
           <ul class="linklist leftside">   
                 <li><div class="g-plusone"></div></li>
                 <li><object type="application/xhtml+xml" data="https:////www.facebook.com/plugins/like.php?href={U_FB}&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;height=21" style="width:100px; height:21px;">
<!--[if IE]>
<iframe src="https:////www.facebook.com/plugins/like.php?href={U_FB}&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;height=21" style="width:100px; height:21px;" allowtransparency="true" frameborder="0" ></iframe>
<![endif]-->
               </object>
             </li>
         </ul>
<!-- Fin bouton plus un Google Facebook -->


Rafraîchir le cache de votre forum.



En fait l'idée est de remplacée la balise [surligne]iframe src=[/surligne] fournie par Facebook par une balise [surligne]object type="application/xhtml+xml" data=[/surligne]. Au passage on vire aussi quelques balises obsolètes style [surligne]scrolling="no" frameborder="0[/surligne].
On notera que sur ce coup Google est quand même bien meilleur élève que Facebook, même si son code demande aussi une légère modification.
Mise en garde
Ne vous faites pas aider par plusieurs forums en même temps, les différentes consignes de réparation pouvant entrer en interaction.
Avatar de l’utilisateur
Renard
Webmaster - Site admin
Webmaster - Site admin
 
Messages: 11597
Enregistré le: 07 Mar 2006, 05:17
Localisation: Carcassonne

Publicité

Ajouter le Bouton Facebook à la liste des forums

Messagepar Renard » 31 Aoû 2011, 10:31

On me demande aujourd'hui s'il est possible d'ajouter le bouton Google et Facebook, toujours en liens dynamiques, à la liste des forums.


Les fichiers à modifier sont :
viewforum.php,
styles/prosilver/template/viewforum_body.html

Ce MOD est très facile à mettre en place, cela prendra environ 1 minute.



[surligne]Ouvrir viewforum.php[/surligne]

Trouver (vers la ligne 385) :

Code: Tout sélectionner
   'U_MARK_TOPICS'      => ($user->data['is_registered'] || $config['load_anon_lastread']) ? append_sid("{$phpbb_root_path}viewforum.$phpEx", 'hash=' . generate_link_hash('global') . "&amp;f=$forum_id&amp;mark=topics") : '',


Ajouter après : (pour les forums phpBB3 sans module SEO)

Code: Tout sélectionner
        // Bouton plus un Google Facebook
        'U_FB'    => urlencode(generate_board_url() . "/viewforum.$phpEx?f=$forum_id"),
        // Bouton plus un Google Facebook



Ajouter après : (pour les forums phpBB3 avec module SEO)

Code: Tout sélectionner
        // Bouton plus un Google Facebook
        'U_FB'    => append_sid("{$phpbb_root_path}viewforum.$phpEx", "f=$forum_id"),
        // Bouton plus un Google Facebook


[surligne]Ouvrir viewforum_body.html[/surligne]

Trouver :

Code: Tout sélectionner
<!-- IF S_FORUM_RULES -->


Ajouter avant :

Code: Tout sélectionner
      <!-- Bouton plus un Google Facebook -->
           <ul class="linklist leftside">   
             <li><div class="g-plusone"></div></li>
             <li><object type="application/xhtml+xml" data="https:////www.facebook.com/plugins/like.php?href={U_FB}&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;height=21" style="width:100px; height:21px;">
<!--[if IE]>
<iframe src="https:////www.facebook.com/plugins/like.php?href={U_FB}&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;height=21" style="width:100px; height:21px;" allowtransparency="true" frameborder="0"></iframe>
<![endif]-->
               </object>
           </li>
          </ul>      
   <div class="clear"></div>    
   <!-- Fin bouton plus un Google Facebook -->


Rafraîchir le cache de votre forum.
Mise en garde
Ne vous faites pas aider par plusieurs forums en même temps, les différentes consignes de réparation pouvant entrer en interaction.
Avatar de l’utilisateur
Renard
Webmaster - Site admin
Webmaster - Site admin
 
Messages: 11597
Enregistré le: 07 Mar 2006, 05:17
Localisation: Carcassonne

Re: Bouton Facebook valide W3C : Tuto phpBB3

Messagepar Renard » 02 Sep 2011, 16:33

Et pour finir, voici comment ajouter le bouton Google et Facebook à l'index de votre forum.


Le fichier à modifier est :
styles/prosilver/template/index_body.html



[surligne]Ouvrir index_body.html[/surligne]

Trouver :

Code: Tout sélectionner
<!-- IF S_DISPLAY_SEARCH or (S_USER_LOGGED_IN and not S_IS_BOT) -->


Ajouter après (pensez à renseigner l'URL de votre forum) :

Code: Tout sélectionner
   <!-- Bouton plus un Google Facebook -->
         <ul class="linklist">
         <li><div class="g-plusone"></div></li>
           <li><object type="application/xhtml+xml" data="https:////www.facebook.com/plugins/like.php?href=URL_DE_VOTRE_FORUM/&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;height=21" style="width:100px; height:21px;">
         <!--[if IE]>
<iframe src="https:////www.facebook.com/plugins/like.php?href=URL_DE_VOTRE_FORUM/&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;height=21" style="width:100px; height:21px;" allowtransparency="true" frameborder="0"></iframe>
<![endif]-->
           </object>
         </li>
       </ul>
           <!-- Fin bouton plus un Google Facebook -->


Rafraîchir le cache de votre forum.
Mise en garde
Ne vous faites pas aider par plusieurs forums en même temps, les différentes consignes de réparation pouvant entrer en interaction.
Avatar de l’utilisateur
Renard
Webmaster - Site admin
Webmaster - Site admin
 
Messages: 11597
Enregistré le: 07 Mar 2006, 05:17
Localisation: Carcassonne

Re: Bouton Facebook valide W3C : Tuto phpBB3

Messagepar gigoudelin » 19 Avr 2012, 13:44

Bonjour et merci pour ce superbe tutoriel, fonctionne à merveille sur mon forum.
en outre, j'ai un petit problème que je ne sais expliquer lorsque je clic sur un sujet j'ai les boutons de google et FB en double.
au dessus du champ de recherche et les autre juste a coté du bouton rechercher.
par avance merci pour votre aide.
si vous le souhaitez je peux vous envoyer l'url en MP.
cordialement,
Gilles Goudelin
gigoudelin
Membre
Membre
 
Messages: 3
Enregistré le: 19 Avr 2012, 13:39

Re: Bouton Facebook valide W3C : Tuto phpBB3

Messagepar Renard » 19 Avr 2012, 13:51

Bonjour,

Oui fais voir l'url, mets-là directement ici.
Tu as bien rafraîchit le cache ?
Mise en garde
Ne vous faites pas aider par plusieurs forums en même temps, les différentes consignes de réparation pouvant entrer en interaction.
Avatar de l’utilisateur
Renard
Webmaster - Site admin
Webmaster - Site admin
 
Messages: 11597
Enregistré le: 07 Mar 2006, 05:17
Localisation: Carcassonne

Re: Bouton Facebook valide W3C : Tuto phpBB3

Messagepar gigoudelin » 19 Avr 2012, 19:33

bonsoir Renard,
oui j'ai bien purgé le cache.
tu trouveras ci-après l'url :
http://www.forum.gg-prod.fr/

par avance te remerciant pour ton analyse
gigoudelin
Membre
Membre
 
Messages: 3
Enregistré le: 19 Avr 2012, 13:39

Re: Bouton Facebook valide W3C : Tuto phpBB3

Messagepar gigoudelin » 19 Avr 2012, 21:38

bonsoir Renard,
j'ai trouvé j'avais fait un doublon dans le fichier viewtopic_body.html.
tout marche parfaitement maintenant.
gigoudelin
Membre
Membre
 
Messages: 3
Enregistré le: 19 Avr 2012, 13:39

Re: Bouton Facebook valide W3C : Tuto phpBB3

Messagepar Renard » 20 Avr 2012, 07:30

Je m'en doutais un peu, dsl pas eu le temps de regarder hier soir. :H)
Mise en garde
Ne vous faites pas aider par plusieurs forums en même temps, les différentes consignes de réparation pouvant entrer en interaction.
Avatar de l’utilisateur
Renard
Webmaster - Site admin
Webmaster - Site admin
 
Messages: 11597
Enregistré le: 07 Mar 2006, 05:17
Localisation: Carcassonne

Re: Bouton Facebook valide W3C : Tuto phpBB3

Messagepar Charlotte57 » 16 Oct 2012, 10:20

Merci beaucoup pour l'astuce :)
Charlotte57
Membre
Membre
 
Messages: 10
Enregistré le: 15 Oct 2012, 15:50


Retourner vers Astuces en vrac

 


  • Articles en relation
    Réponses
    Vus
    Dernier message

Qui est en ligne

Utilisateurs parcourant ce forum : Aucun utilisateur enregistré et 0 invités

cron

Ce site utilise des pages PHP entièrement recyclables