Forum Rank Seo

Forum SEO pour webmasters et blogueurs !

 


  • Publicités

[W3C] Boutons de Partages

Les techniques des membres sur les réseaux sociaux, Facebook, Twitter, Google Plus etc...

[W3C] Boutons de Partages

Message par YannOuch » 11 Avr 2014, 16:01

Bonjour à tous,

Suite au commentaire de Gloubi sur concernant les audits de sites web et les partages sur les réseaux sociaux je me permet de créer ce petit topic pour vous proposer ma solution de partage maison valide W3C et clean aux yeux des audits comme dareboost.

N'hésitez pas à me suggérez toute améliorations et compagnie.

Pur ce faire vous aurez donc besoin d'avoir votre propre pack d'images de partage et savoir utiliser les sprites css.
Merci à Juliano en passant pour son aide sur le sprite. ;)

En premier lieu il vous faudra créer votre sprite.
Code : Tout sélectionner
.iconesRSH{ width: 16px;  height: 16px; display: inline; background: url("../images/sprites/reseaux.png") no-repeat; color:#666666; background-color:transparent;float:left;  }
.iconRSH-1 {  background-position: left top;}
// etc .. vos autres class.


Ensuite on commence par placer notre sprite css, en affichant les images.

Code : Tout sélectionner
   <div class="iconesRSH iconRSH-1"></div>
   <div class="iconesRSH iconRSH-2"></div>
   <div class="iconesRSH iconRSH-3"></div>
   <div class="iconesRSH iconRSH-4"></div>
   <div class="iconesRSH iconRSH-5"></div>
   <div class="iconesRSH iconRSH-6"></div>
   <div class="iconesRSH iconRSH-7"></div>
   <div class="iconesRSH iconRSH-8"></div>



Et on continue avec nos liens de partages qui viendront se positionner juste en dessous de chaque image par exemple.

Code : Tout sélectionner
         
<a target="_blank" href="http://www.linkedin.com/shareArticle?mini=true&amp;url=<?php echo urlencode("http://www.votresite.com".$_SERVER['REQUEST_URI'].""); ?>&amp;title=<?php echo urlencode("Titre du site"); ?>" title="Partage par LinkedIn">LinkedIn</a>
               
<a target="_blank" href="https://plus.google.com/share?url=<?php echo urlencode("http://www.votresite.com".$_SERVER['REQUEST_URI'].""); ?>" title="Partage par Google+">Google+</a>
               
<a target="_blank" href="http://www.facebook.com/sharer.php?u=<?php echo urlencode("http://www.votresite.com".$_SERVER['REQUEST_URI'].""); ?>&amp;t=<?php echo urlencode("Titre du site"); ?>" title="Partage par Facebook">Facebook</a>
               
<a target="_blank" href="http://twitter.com/home?status=<?php echo urlencode("Votre tweet | via @VotreSite http://www.votresite.com".$_SERVER['REQUEST_URI'].""); ?>" title="Partage par Twitter">Tweet</a>   
               
<a target="_blank"  href="http://pinterest.com/pin/create/button/?url=<?php echo urlencode("http://www.votresite.com".$_SERVER['REQUEST_URI'].""); ?>&amp;media=<?php echo urlencode("http://www.votresite.com/images/votreimage.png"); ?>" title="Partage par Pinterest">Pint It</a>
               
<a href="http://del.icio.us/post?url=<?php echo urlencode("http://www.votresite.com".$_SERVER['REQUEST_URI'].""); ?>&amp;title=<?php echo urlencode("Titre de Votre site"); ?>" target="_blank" title="Partage par del.icio.us">Delicious</a>
               
<a href="http://www.stumbleupon.com/submit?url=<?php echo urlencode("http://www.votresite.com".$_SERVER['REQUEST_URI'].""); ?>" target="_blank" title="Partage par stumbleupon">Stumble</a>
               
<a href="http://digg.com/submit?url=<?php echo urlencode("http://www.votresite.com".$_SERVER['REQUEST_URI'].""); ?>&amp;title=<?php echo urlencode("Titre de votre site"); ?>" target="_blank" title="Partage par digg">Digg</a>


Ce qui vous donnera quelque chose comme ceci :

Image

ici il s'agit bien de combiner de bons résultats et sur le validateur w3c et sur les audits comme dareboost.
Côté esthétique c'est pas super. ;)

Pour ceux qui se fiche de dareboost, et ne regarde que le validateur w3c, vous pouvez placer vos images au niveau du lien tout simplement.

Si par contre, quelqu'un sait comment combiner les deux plus l'esthétique, là je suis prenneur. :mrgreen:

Amicalement, Yann.
Tu aimes les rencontres en ligne, vient donc découvrir mon blog j'y parle rencontre !
Avatar de l’utilisateur
YannOuch
Modérateur
Modérateur
 
Message(s) : 890
Enregistré le: 23 Août 2013, 18:20
Localisation : Toulouse
A remercié: 107 fois
Remercié: 162 fois

Publicités

Re: [W3C] Boutons de Partages

Message par BrunoT » 11 Avr 2014, 18:51

Merci Yannouch pour tes explications, mais question bête: on les met où tous ces bouts de code?
Mon blog sur WordPress!
Avatar de l’utilisateur
BrunoT
V.I.P
V.I.P
 
Message(s) : 3758
Enregistré le: 08 Juin 2013, 18:43
Localisation : Rethel
A remercié: 490 fois
Remercié: 360 fois

Re: [W3C] Boutons de Partages

Message par YannOuch » 11 Avr 2014, 20:24

re,

Dans le code directement.
après pour les blogs je ne m'y suis pas penché (car j'en ai pas).
Mais il suffit de trouver le bon fichier.
Enfile ton costume de Noob et viens découvrir mon petit Blog SEO pour les amateurs !
Avatar de l’utilisateur
YannOuch
Modérateur
Modérateur
 
Message(s) : 890
Enregistré le: 23 Août 2013, 18:20
Localisation : Toulouse
A remercié: 107 fois
Remercié: 162 fois

Re: [W3C] Boutons de Partages

Message par BrunoT » 11 Avr 2014, 20:30

YannOuch a écrit:Mais il suffit de trouver le bon fichier.


La bonne blague! :tu:
Utiliser intelligemment la signature alternée sur les forums?
Avatar de l’utilisateur
BrunoT
V.I.P
V.I.P
 
Message(s) : 3758
Enregistré le: 08 Juin 2013, 18:43
Localisation : Rethel
A remercié: 490 fois
Remercié: 360 fois

Re: [W3C] Boutons de Partages

Message par YannOuch » 12 Avr 2014, 08:54

Quand je me mettrais à WP (prochainement), je mettrais à jour comme il le faut pour la plateforme et le noms des ficheirs qui vont avec.
Tu aimes les rencontres en ligne, vient donc découvrir mon blog j'y parle rencontre !
Avatar de l’utilisateur
YannOuch
Modérateur
Modérateur
 
Message(s) : 890
Enregistré le: 23 Août 2013, 18:20
Localisation : Toulouse
A remercié: 107 fois
Remercié: 162 fois

Re: [W3C] Boutons de Partages

Message par BrunoT » 12 Avr 2014, 09:59

YannOuch a écrit:Quand je me mettrais à WP (prochainement), je mettrais à jour comme il le faut pour la plateforme et le noms des ficheirs qui vont avec.


Je vois que comme moi tu as une légère tendance à la dyslexie des doigts :lol: :peur
Super Raymond, le blog anti Raymond!
Avatar de l’utilisateur
BrunoT
V.I.P
V.I.P
 
Message(s) : 3758
Enregistré le: 08 Juin 2013, 18:43
Localisation : Rethel
A remercié: 490 fois
Remercié: 360 fois

Re: [W3C] Boutons de Partages

Message par mbouchaud » 12 Avr 2014, 11:23

Bonjour,
Merci beaucoup pour le partage du code.
Récemment, j'ai supprimé les objets de mes pages à cause des erreurs w3c et des performances.
Je vais tester tout cela très rapidement.
Je vous présente mon site de fleurs
Avatar de l’utilisateur
mbouchaud
Membre Certifié
Membre Certifié
 
Message(s) : 617
Enregistré le: 15 Sep 2013, 07:24
Localisation : Pornichet
A remercié: 89 fois
Remercié: 76 fois


Retour vers Les Réseaux Sociaux



Qui est en ligne

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 1 invité

  • Publicités

Webmaster Jimcail.fr

Propulsé par phpBB® Forum Software © phpBB Group • Traduit par phpBB-fr.com
phpBB SEO
Theme created by StylerBB.net