Come inserire direttamente nel modello di Blogger i file CSS e javascript caricati in un dominio esterno.

Come caricare i file js e css esterni direttamente nel modello di Blogger per velocizzare il caricamento della pagina e per non dipendere da disservizi di altri domini.

Quando si scaricano i modelli di Blogger da internet o quando si installano dei widget spesso diventiamo dipendenti da file esterni al nostro sito che possono smettere di funzionare da un momento all'altro perché il servizio su cui erano caricati ha cessato di esistere come per esempio Google Code o perché il dominio in cui il webmaster creatore del template o del widget li aveva hostati non è stato rinnovato.

In realtà si possono caricare file CSS e javascript esterni direttamente nel modello di Blogger con dei vantaggi evidenti. Innanzitutto non avremo più il problema di domini o siti esterni che vanno fuori servizio anche per poche ore e inoltre ne sarà avvantaggiata la velocità di caricamento perché il browser dovrà effettuare meno richieste HTTP.

I file CSS e javascript esterni vengono di solito caricati con una sola riga di codice

<link rel='stylesheet' href='URL_CSS_ESTERNO.css'>  per un CSS esterno
<script src='URL_JAVASCRIPT_ESTERNO.js' type='text/javascript'/> per un js esterno

in cui è presente l'indirizzo del file esterno la cui estensione termina rispettivamente con .css e .js. I file javascript possono avere la chiusura del tag con la slash finale / prima del tag > oppure averla in modo esplicito con </script>. Per caricare questi file nel modello innanzitutto vanno scaricati. Per farlo si copia il loro indirizzo, si incolla nel browser e si clicca su Invio. Si possono verificare due situazioni. La prima è che il file venga scaricato senza ulteriori passaggi. Questo succede per esempio per i file caricati su Google Sites. La seconda invece è che si visualizzi la pagina con tutto il codice del file in questione 

In questo caso si clicca sulla pagina con il destro del mouse e si sceglie Salva con nome con Chrome e Salva pagina con nome con Firefox. Controllate che la pagina abbia la stessa estensione del file

COME CARICARE I FILE CSS NEL MODELLO

Se non lo avete ancora fatto scaricate e installate l'Editor Notepad++ (Download Notepad++). Fate doppio click sulla icona dell'Editor quindi nella sua interfaccia andate su File > Apri e selezionate il file CSS che avete scaricato nel vostro PC e che avrà un codice simile a questo

Andate all'inizio del file e subito prima del resto del codice incollate questa riga

<style type="text/css">

quindi andate alla fine del file e incollate quest'altra riga

</style>

in questo modo

Adesso cliccate sull'Editor con il destro del cursore e scegliete Seleziona tutto quindi ricliccate sul destro del cursore e selezionate Copia. Tutto questo codice va incollato su Modello > Modifica HTML subito sopra alla riga </head>. Contestualmente va naturalmente cancellata la riga evidenziata di giallo che inseriva i CSS con il file esterno. 

SECONDO METODO PER I CSS

Invece di aggiungere il tag <style> all'inizio e alla fine si può andare subito su Seleziona tutto quindi su Copia per poi incollare il codice senza modifiche stavolta però sopra alla riga ]]></b:skin>.

COME CARICARE I FILE JAVASCRIPT NEL MODELLO

Dopo aver scaricato il file in oggetto nel nostro computer con la stessa modalità che abbiamo seguito con il file CSS, si apre sempre con Notepad++ andando su File > Apri.

All'inizio del codice vanno incollate queste due righe

<script type='text/javascript'>
//<![CDATA[

mentre alla fine si incollano queste altre due righe

//]]>
</script>

in questo modo

Dopo questa operazione si va sul destro del mouse e si sceglie Seleziona tutto quindi nuovamente sul destro del cursore e si va su Copia. Tale codice va quindi incollato su Modello > Modifica HTML subito sopra alla riga </head>. Si cancella la riga evidenziata di verde che inseriva il javascript con un file esterno quindi si salva il modello. Come detto in precedenza i file javascript esterni possono avere una chiusura del tag <script> con una slash finale / o con un tag esplicito </script> quindi va considerato questo fatto altrimenti non si riuscirà a salvare il modello di Blogger. Ricordo che prima di ogni procedura di questo tipo va salvato il template andando su Modello > Backup / Ripristino.