Bonjour !
Après moulte recherche, je galère vraiment à mettre ça en place. J'ai un blog, et l'idée est évidemment d'avoir un bouton [Facebook | Twitter | G+] sur chaque article.
J'ai farfouillé sur les tutos du web, sur les API des réseaux concernés, mais j'arrive pas à déchiffrer.
Evidemment, je veux des boutons personnalisés, c'est là où je bloque. Je n'utilise pas Wordpress ou autre CMS, j'ai le mien perso.
Alors j'ai réussi pour Twitter mais c'est de la bidouille :
$('.tweet').click(function(event) {
var width = 575,
height = 400,
left = ($(window).width() - width) / 2,
top = ($(window).height() - height) / 2,
url = this.href,
opts = 'status=1' +
',width=' + width +
',height=' + height +
',top=' + top +
',left=' + left;
window.open(url, 'twitter', opts);
return false;
});Et le code :
<a class="tweet" href="https://twitter.com/share?text=<?= $datas['title']; ?>&hashtags=Blog">
<span class="fa-stack fa-lg">
<i class="tw fa fa-circle fa-stack-2x"></i>
<i class="fa fa-twitter fa-stack-1x fa-inverse"></i>
</span></a>Donc considérons Twitter comme fonctionnel, mais pour Facebook, impossible de faire la même. Il parle de méta à mettre dans le head, cependant, là où ça coince pour moi c'est que en fonction de la page, c'est le contenu qui change, pas tout l'entête. Du coup, comment réinjecter des métas dans l'entête pour chaque article ?
A noter que le code pour Google et Facebook et le même, sauf que le href est vide à défaut d'avoir une autre solution.
Merci de votre aide :)
8 réponses
Tuto fait, si ça intéresse, je lock :)
http://www.grafikart.fr/tutoriels/javascript/boutons-partage-social-697
Les différentes API tels que :
https://developers.facebook.com/docs/plugins/share-button
https://dev.twitter.com/web/tweet-button
Etc.
Te donne leur code avec LEUR bouton. Des boutons tout moche, qui colle pas avec mon blog. Ce que j'aimerai c'est juste créer mes propres boutons, mais qui effectuent la même action, à savoir partager.
Comme ci-dessus :
<span class="fa-stack fa-lg">
<i class="tw fa fa-circle fa-stack-2x"></i>
<i class="fa fa-facebook fa-stack-1x fa-inverse"></i>
</span>Ca, c'est le bouton que j'utilise pour Facebook, j'aimerai que quand je clique dessus, le pop-up de Facebook pour partager l'article associé s'ouvre, avec les infos de l'article, L'image de l'article en guise d'image de référence etc.. Facebook etc.. te donne tous les outils pour manipuler leur API et pouvoir partager ce qu'il faut, mais t'oblige à utiliser leur propre bouton de partage. Je trouve de tout et de rien sur google, et ça m'aide pas au final :/
Salut, est ce que c'est ce genre de truc que tu cherche?
http://korben.info/bouton-partage-twitter-facebook-sans-tracking.html ?
Perso c'est ce que j'utilise par contre, attention avec les bloqueur de pub qui cherche un peu tout et n'importe quoi meme si c'est du coder a la mano. Ce que je fais pour les garder afficher :
display: block !important;
visibility: initial !important;
orphans: initial !important;@StanislasP
J'avais déjà vu la page de Korben, bizarrement j'avais testé et il me bloquait les popup par Chrome. Je viens de réessayer et il ne le fait plus. J'ignore pour quelle raison.
Le code que tu as donné, il faudrait que je le relie à quoi ? C'est du CSS qui correspond à quelle classe dans le code ?
Et deuxième chose, comme je le pensais pour facebook, il se base sur les métas, hors n'ayant pas Wordpress ou autre, chaque article de mon blog ne possède pas ses propres métas. Donc quand il ouvre la pop-up pour partager sur facebook, je me retrouve avec le titre de mon site et la description de mon site, rien de plus, rien en rapport avec l'article, et surtout pas d'image.
Comment pourrais-je faire ? Même si je dois rajouter les métas, j'affiche le contenu en fonction de l'url avec des includes, je ne recharge jamais le header :/
Merci !