Afficher les boutons Facebook, Twitter et Google plus Valide aux normes XHTML WC3

Après quelques recherches je suis arrivé à faire passer les boutons des réseaux sociaux aux normes WC3 sur Dotclear mais cela marche partout ( normalement ). Le but est d'utiliser du Java script pour maquiller les erreurs et cela marche ;) ( Oui j'aime lorsque je passe passe la validation même si y'a de la triche :p ).
Pour voir le rendu normalement, il vous suffit de regarder en bas de chacun des billets posté. Mais reste toujours un petit problème ( Normal y'en a toujours ) je trouve pas de solution pour aligner les boutons à l'horizontal pour avoir un meilleur rendu donc si l'un d'entre vous trouve une solution je suis preneur et si vous pouviez la poster dans le forum à ce lien http://board.kipof.net/viewtopic.php?pid=117#p117 cela serait sympa :up:
Voici ce que j'ai pour avoir les boutons Valide:

<script type="text/javascript">
//<![CDATA[
(function() {
document.write('<fb:like width="450" layout="button_count"></fb:like>');
var s = document.createElement('SCRIPT'), 
s1 = document.getElementsByTagName('SCRIPT')[0];
s.type = 'text/javascript';
s.async = true;
s.src = 'http://connect.facebook.net/fr_FR/all.js#xfbml=1';
s1.parentNode.insertBefore(s, s1);
})();
//]]>
</script>
<a href="http://twitter.com/share" class="twitter-share-button">Tweet</a> 
<script type="text/javascript" src="http://platform.twitter.com/widgets.js">
</script>
<div id="plusone-div" class="plusone"></div> <script type="text/javascript">
gapi.plusone.render('plusone-div',{"size": "small", "count": "true"}); </script>

Et dans le head pour le bouton de Google ajouez :

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
{lang:'fr', parsetags:'explicit'} </script>

Commentaires

1. Le lundi 9 janvier 2012 à, 13:23 par frannuaire

Bonjour,

Je suis d'accord pour google+ et FB mais pour twitter Comment fais tu avec ta solution pour passer des paramètres?

Merci

2. Le dimanche 15 janvier 2012 à, 15:54 par kipof

Bonjour frannuaire,

Tu dois sûrement parler du fichier http://platform.twitter.com/widgets... non ?

3. Le mercredi 18 janvier 2012 à, 10:46 par ameli

merci, ça va m’être vraiment utile. 8) :p

4. Le dimanche 1 avril 2012 à, 00:27 par i_love_dc

Bonjour,
pour la solution de les mètres en place alignés a l’horizontal
il faut essayer de placer le javascript dans une DIV, exemple :
<div id="LE NOM DE LA DIV">...le code javascript ...</div>

En créant une DIV receptive par codes, exemple:

<div id="fblike">...</div> et <div id="gglike">...</div> etc

Ensuite dans le .css mettre des règles genre :

  1. fblike {

margin-left:10px
}

  1. gglike {

margin-left:60px
margin-top:-20px
}

a fin de pouvoir les placer au bon vouloir, à tester ;-)
A NOTER => (les regles .CSS ci dessus sont des exemples imaginaires lol)

5. Le dimanche 1 avril 2012 à, 01:40 par i_love_dc

la mise en page DIV + .CSS fonctionne
testé et approuvé :up:

Merci pour tes codes valides :up: :up:

6. Le dimanche 1 avril 2012 à, 12:56 par kipof

Bonjour i_love_dc, Je peux voir ce que cela donne ? puis avoir les modifications apporté pour pouvoir les partager ( si tu es ok ) ?

Merci d'avance.

7. Le vendredi 15 novembre 2013 à, 19:59 par Raoul

Vous pouvez donner la solution pour les installer car j'ai du mal avec le truc de i_love_dc :p

Merci

Ajouter un commentaire

Les commentaires peuvent être formatés en utilisant une syntaxe wiki simplifiée.

Fil des commentaires de ce billet