Inserire un javascript in e107

http://www.e107italia.org/e107_plugins/content/content.php?content.28
Pagina 1/3
Inserire un javascript in e107
Inserire un javascript in e107
Maurizio, lun 28 settembre 2009 - 00:00
1. INTRODUZIONE
Oggi è sempre più sentita l'esigenza di inserire javascript esterni in e107. Questo tutorial intende fornire un esempio di come ciò sia
possibile.
e107 è predisposto per poter essere integrato con javascript esterni, occorre semplicemente eseguire in modo corretto determinate
operazioni che andremo ad illustrare, prestando attenzione ai path e alle sintassi dei comandi dei contenuti esterni.
2. COSA OCCORRE
a. Un editor testuale (ad esempio Notepad ++ o altro che usate regolarmente)
b. Il nostro theme.php che si trova all'interno della directory del tema che stiamo utilizzando
c. Il file di esempio dello script che normalmente viene fornito in download.
3. VERIFICHE PRELIMINARI
Per prima cosa osserviamo con attenzione il contenuto di esempio che viene fornito in download e che deve essere integrato nel
nostro CMS. Normalmente è un index.html o qualcosa di simile.
Una volta aperto con un editor il file scaricato, la nostra attenzione deve ricadere nella sezione head dello stesso. E' in questo punto
che lo script (o javascript) viene caricato in memoria e l'inserimento corretto nel nostro CMS è di fondamentale importanza.
Apriamo il nostro theme.php col nostro editor e cerchiamo la funzione
»
» function theme_head() {
» return " ";
» }
»
Dentro a questa funzione e107 elabora gli stessi contenuti che troviamo nella sezione head di un foglio html, pertanto è qui che
dobbiamo operare.
Normalmente in tutti i temi la funzione esiste, se dovesse succedere che tale funzione sia stata omessa dal creatore del tema, occorre
inserire il codice riportato sopra nel theme.php stesso, e l'inserimento deve essere fatto prima della variabile:
»
» $HEADER = "codice.... ";
»
Verificato ciò passiamo all'inserimento del javascript nel nostro tema.
http://www.e107italia.org/e107_plugins/content/content.php?content.28
Pagina 2/3
4. INSERIMENTO DEGLI SCRIPT
Il primo passo importante consiste nel creare una sottodirectory all'interno della cartella del nostro tema dove inserire gli script
dell'applicazione che ci interessa. Pertanto immaginiamo di creare una cartella che chiameremo mioscript e di copiare all'interno tutti i
file che ci interessano.
Normalmente i file sono più di uno e prevedono file CSS (fogli di stile) e file JS (Javascript veri e propri).
Supponiamo quindi di avere tre files: principale1.js, principale2.js, script1.js, script2.js e foglio.css; supponiamo inoltre che il foglio html
di esempio richiami nella sezione head solo i files principale1.js, principale2.js.
Copieremo nella nostra cartella mioscript tutti i files presenti, ma dovremo richiamare solo quello che l'esempio che abbiamo
scaricato ci indica. Per fare ciò dovremo scrivere delle istruzioni sintatticamente corrette nella funzione theme_head che abbiamo
citato al punto 3.
Scriveremo quindi:
»
» function theme_head() {
» return "<link rel='stylesheet' media='all' type='text/css' href='".THEME_ABS."mioscript/foglio.css'/><script src= '".THEME_ABS.
"mioscript/principale1.js' type='text/javascript'></script><script src= '".THEME_ABS."mioscript/principale2.js'
type='text/javascript'></script>";
» }
»
IMPORTANTE:
» all'interno della funzione abbiamo riportato il richiamo al foglio di stile;
» abbiamo sostituito tutti gli apici doppi con apici singoli, questo è fondamentale perchè siamo all'interno di una funzione
php;
» abbiamo usato la variabile di sistema ".THEME_ABS." più il nome della sottocartella per indicare il percorso in cui sono
contentui i files. La variabile di sistema MANTIENE gli apici doppi!
A questo punto se il foglio html di esempio non riporta nessuna altra istruzione nella sezione head, possiamo inserire le istruzioni di
esecuzione (sempre riportate nel foglio di esempio) in qualsiasi punto del nostro theme.php e il tutto dovrebbe funzionare senza
problemi.
4. ECCEZIONI
Può anche succedere, per determinati script che richiedano l'istruzione
http://www.e107italia.org/e107_plugins/content/content.php?content.28
Pagina 3/3
»
» <body onload=" ">
Anche in questo caso e107 fornisce gli strumenti per realizzare quanto desideriamo.
Tra la funzione theme_head e la variabile &#036;HEADER del nostro theme.php inseriamo questo codice:
»
» define("THEME_ONLOAD","QUELLO CHE DOVETE INSERIRE");
»
Attenzioni ad eventuali apici ed il gioco è fatto.
5. CONCLUSIONI
Questo tutorial non è assolutamente completo, fornisce però una indicazione importante per l'integrazione di javascript in e107. Per
qualsiasi problema che non è contemplato in questa breve esposizione, vi invitiamo a postare nel forum.