Twitter : Comment citer et afficher des tweets sur son site ou blog

10 mai 2012 - Classé dans OS & Social - Twitter - Wordpress

Grâce à Twitter, il est très simple de citer et afficher un tweet sur son site web. A l’instar de Youtube et du code fournis pour afficher une vidéo, le principe est le même sur Twitter.

La fonction Embeded Tweet permet de générer un code court a copier / coller sur la page HTML de votre site ou dans un article WordPress. Ce balisage présente le Tweet dans un joli cadre avec différentes options (retweeter, répondre, favori et suivre l’auteur). Voici un exemple ci-dessous :

Comment adopter la bonne #strategie sur #twitter 41mag.fr/conseils-pour-…
— 41Mag (@creatroyes) Mai 3, 2012

Plus besoin de se lancer dans un montage photoshop, un code hasardeux ou une extension WordPress qui alourdira votre page. Vous pourrez insérer et afficher tres simplement tous les tweets que vous désirez.

Comment citer et afficher des tweets sur son site ou blog

Pour commencer, il vous faut vous rendre sur la page dédiée au Tweet à afficher. Sur cette page, repérer le lien Insérer ce tweet. Il apparait en bas du cadre relatif à ce Tweet, comme sur l’image ci-dessous :

Twitter : Comment citer et afficher des tweets sur son site ou blog

Après avoir cliqué sur le lien Insérer ce tweet, un nouveau cadre ou fenêtre s’ouvrira.

Comment insérer, citer et afficher des tweets sur son site ou blog

Choisissez la façon d’insérer votre Tweet dans votre site web

Twitter vous propose trois manières d’insérer et d’afficher un Tweet sur votre page web. Vous pourrez choisir parmis les choix suivants :

HTML : Le code, ou balisage, peut être copié / collé directement dans une page HTML pour afficher le Tweet. Il sera encadré par les balises <blockquote comme dans l’exemple ci-dessous :

<blockquote class="twitter-tweet" lang="fr">
  <p>Comment adopter la bonne <a href="https://twitter.com/search/%2523strategie">#strategie</a> sur <a
  href="https://twitter.com/search/%2523twitter">#twitter</a> <a href="http://t.co/yKQaLLbO" 
  title="http://41mag.fr/conseils-pour-adopter-la-bonne-strategie-sur-twitter.html">41mag.fr/conseils-pour-…</a>
  </p>&mdash; 41Mag (@creatroyes) <a href="https://twitter.com/creatroyes/status/198014231252176897" 
  data-datetime="2012-05-03T11:40:46+00:00">Mai 3, 2012</a>
</blockquote>
<script src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

Code court : La notation raccourcie pour afficher un Tweet ne fonctionne que sur les plates-formes supportant les shortcodes Twitter, comme wordpress.com. Cela nous donnera le code suivant :