Questo sito contribuisce alla audience di Il Messaggero
Salvatore Aranzulla Day
Evento di formazione SEO con Salvatore Aranzulla. Scopri il programma

Come includere codice esterno nelle pagine Web

di

Ti sei avvicinato da poco al mondo della creazione di siti Internet e non sai ancora come includere codice esterno nelle pagine Web? Se vuoi, posso darti qualche dritta sulle strade più semplici da percorrere per acquisire dimestichezza con l’argomento ma, mi raccomando, non credere che bastino cinque minuti per imparare tutto.

Dopo aver letto il post avrai sicuramente le idee più chiare sul da farsi ma se vuoi diventare un professionista del settore devi esercitarti e, soprattutto, studiare molto. Vediamo dunque come incorporare degli oggetti esterni nelle pagine Web usando codici generi ideali per muovere i primi passi nella giusta direzione senza “inciampare”. Buon divertimento!

Cominciamo questa breve guida su come includere codice esterno nelle pagine Web parlando di JavaScript, uno sistema che permette di includere menu, header ed altri elementi comuni in tutte le pagine di un sito Internet senza dover inserire materialmente l’oggetto in ciascuna di esse.

L’adozione di JavaScript ha numerosi vantaggi, come la possibilità di modificare lo script di origine e vedere le modifiche applicate immediatamente a tutte le pagine del sito e la velocità ridotta dei caricamenti (gli elementi JavaScript vengono salvati nella cache del browser e quindi risultano già caricati in tutte le pagine che l’utente visita), ma anche qualche svantaggio, come la mancata indicizzazione del loro contenuto da parte dei motori di ricerca e la mancata visualizzazione sui browser su cui è stata disattivata la riproduzione di JavaScript da parte degli utenti.

Detto questo, per creare uno script con questo linguaggio basta attenersi a poche regole chiave convertendo il codice HTML di base in stringhe che si aprono e chiudono con virgolette e che non permette di andare accapo per indicare il contenuto delle variabili (anche se a ciò si può ovviare inserendo un ; alla fine di ciascuna stringa). Sembra complicato ma ti assicuro che basta poco per prenderci la mano. Cerca su Google guide su come creare menu o header in JavaScript per il tuo sito e te ne renderai conto.

Una volta ottenuto il codice dello script, devi salvarlo come un file con estensione js (es. Menu.js) ed incorporarlo nelle pagine del tuo sito Internet inserendo la stringa <script language=”javaScript” src=”percorso/menu.js”></script> nella sezione HEAD di queste ultime. Naturalmente, a percorso/menu.js devi sostituire l’indirizzo esatto e il nome dello script.

Successivamente, recati nel punto della pagina in cui richiamare gli elementi dello script ed utilizza il seguente codice. La voce menu va sostituita con la parte di script da richiamare, mentre la parte che comincia con noscript permette di inserire un avviso per coloro che hanno disattivato JavaScript nelle impostazioni del browser.

 

<script language=”javaScript”>

document.write(menu);

</script>

<noscript>

<strong>Se non visualizzi correttamente il menu, attiva JavaScript nelle impostazioni del tuo browser.</strong>

</noscript>

 

Decisamente meno articolata è la procedura per includere codice esterno nelle pagine Web di un sito o un blog quando il codice da inserire è fornito direttamente da servizi come YouTube (per l’incorporamento di video) o Google Drive (per l’incorporamento di documenti). Basta infatti copiare il codice da inserire nel sito/blog (detto codice di embed) dalla pagina con il video o il documento da incorporare e incollarlo dove si desidera usando, ovviamente, l’editor HTML. Facciamo un esempio pratico.

Se vuoi incorporare un video di YouTube sul tuo blog, non devi far altro che collegarti alla pagina del video, cliccare sul pulsante Condividi, e selezionare la voce Codice da incorporare dal riquadro che si apre. Indica quindi le dimensioni che deve avere il video (in pixel) nel campo Larghezza o Altezza e copia il codice che compare automaticamente nel box in alto.

Apri quindi l’editor HTML del tuo blog ed incolla nella parte del post che desideri il codice per la riproduzione del video. Finito! E puoi anche decidere di centrare il player di YouTube usando il classico codice <div align=”center”></div> all’inizio e alla fine del codice di embed del video. Più facile di così?