Transformer des liens en QR-Code

Transformer vos liens en QR-Code automatiquement

Tout d'abord voici ce que ressemble un QR-code :

QR-Code
Ciquez dessus pour voir la définition...

Logiquement pour en insérer un sur votre site, vous devez utiliser un générateur tel que celui que j'ai mis ici et ensuite récupérer le lien de son image pour l'insérer sur votre site.

Ce que je vous propose, c'est de transformer directement votre lien en QR-Code sans passer par un générateur.


Fonctionnement

Il suffit simplement que lorsque vous créer votre lien, celui qui sera transformer en QR-Code, de lui attribuer une classe.

Cette classe devra se nommer par exemple :
"qrcode100" pour une taille de 100px;
"qrcode120" pour une taille de 120px;
"qrcode150" pour une taille de 150px;
etc.

Voici par exemple comment se présente le lien pour un QR-Code de 120px contenant l'adresse du site :
<a class="qrcode120" href="http://scriptsdegiga24.e-monsite.com/">Les Scripts de Giga 24</a>

Les Scripts de Giga 24


Mise en place

Insérez ce script en zones éditables dans la partie : "Scripts javascripts supplémentaires"

$(function() {
$("a[class^='qrcode']").each(function() {
$(this).html('<img src="http://chart.apis.google.com/chart?cht=qr&chs='+$(this).attr('class').replace('qrcode','')+'x'+$(this).attr('class').replace('qrcode','')+'&chl='+escape($(this).attr("href"))+'" />');
});
});

Pour créer le lien :
soit vous le créer en HTML comme dans l'exemple ci-dessus,
ou avec l'éditeur visuel comme ceci :

  • Faire un clic droit sur le lien
  • Choisir "Insérer / éditer un lien"
  • Aller sur l'onglet "Avancé"
  • Sur la ligne "Classes", noter "qrcode120" ou autre suivant la taille (sans les guillemets).
  • Cliquez sur "Insérer"


2 votes. Moyenne 5.00 sur 5.

Ajouter un commentaire

×