Dummy-X

Informatica a portata di tutti

Aggiungere codici QR nelle pagine HTML

6 Ottobre 2017 / DEV / 882 visualizzazioni
Scritto da  

Utilizzeremo le API di Google per inserire facilmente dei codici QR all’interno delle nostre pagine HTML

Russian Pavilion QR Code

I codici QR, sempre più presenti a causa della loro enorme utilità, sono diventati quasi essenziali per permettere ad un utente di ricevere informazioni sul proprio smartphone senza dover digitare nulla, basta un puntamento con la fotocamera, e via.

Che sia un e-commerce, un blog, o un sito informativo, avere un codice QR nella propria pagina è sempre utile per essere raggiunti facilmente anche da mobile.

Per inserire questi codici all’interno della nostra pagina web, è possibile utilizzare il tag HTML <img>, e le API di Google, senza installare nulla e senza richiedere nessun token per il suo utilizzo.

La stringa che andremo ad utilizzare è la seguente

https://chart.googleapis.com/chart?chs={larghezza}x{altezza}&cht=qr&chl={link}

Ci basta modificare l’altezza, la larghezza e il link della pagina che vogliamo venga raggiunta dall’utente, e inserirla nel tag img, sull’attributo src, come nell’esempio

<img src="https://chart.googleapis.com/chart?chs=400x400&cht=qr&chl=http://blog.selectallfromdual.com" />

Il risultato sarà questo

Non è necessario installare nessuna libreria, ma solo utilizzare quel link fornito gratuitamente.

Condividi se l'articolo ti è piaciuto, ci aiuterai a crescere
Francesco
Fondatore e amministratore di Dummy-X dal 2007, condivido interessi, idee, progetti, e soluzioni informatiche. Non vendo prodotti, mi limito a descrivere tecnologie e a mettere a disposizione gli strumenti adatti per poter realizzare idee. Tutto ciò che scrivo è frutto della mia esperienza lavorativa e della mia voglia di imparare. Da sempre studio l'informatica in tutte le sue angolazioni (software, hardware, reti e sicurezza) e negli ultimi anni mi sono specializzato nello sviluppo di web applications. Sono sempre aperto a nuove sfide e alla ricerca e conoscenza delle nuove tecnologie.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *