Dopo l'articolo sui trucchi per Contao, ho deciso di scriverne uno che parli degli insert tags e di alcune funzioni e variabili presenti in Contao, probabilmente poco note. Inutile dire che queste si rivelano estremamente utili nel manipolare i template.
In questa pagina non riporto tutti i codici, se li volete consultate la pagina del sito ufficiale, poi per ulteriori informazioni sui potenziamenti degli insert tags consultate l'articolo che avevo scritto sulle novità di Contao 3.1.
Di seguito proporrò invece alcuni esempi pratici tratti da situazioni reali, solo per capire alcuni utilizzi possibili.
Gli insert tags sono una serie di comandi scritti all'intero di doppia parentesi graffa, un formato simile a Smarty Code, li possiamo usare nei template, nei moduli ed elementi HTML custom, nell'editor TinyMCE, nei campi delle form. Attenzione: nei codici seguenti ho distanziato le due parentesi per evitare che Contao esegua i comandi, se li copiate dovete riavvicinarle.
Tralascio gli insert tag usati per creare link conoscendo già "id" o "alias" (mi sembrano banali e poco utili). Poi quelli per mostrare le informazioni dell'utente autenticato si spiegano da soli.
Sono interessanti invece quelli che riguardano le proprietà della pagina corrente, infatti potrebbe essere utile conoscere il titolo, l'alias o il codice id, sia della pagina che vedo sia di quella madre, o della root. Per esempio potrei voler mettere un link per tornare indietro alla pagina madre (attenzione, non il link "back" del browser, ma proprio indietro nella struttura ad albero del sito). Ecco il codice.
<a href="{ {page::parentAlias} }.html">{ {page::parentTitle} }</a>
Inoltre potrei riportare il titolo della pagina corrente nell'intestazione di un modulo. Per esempio immaginate un sito con tutte le regioni d'Italia, e per ogni regione ci sono altre pagine per le città. In ogni pagina regionale ho bisogno di un menu che elenchi le città. Basta farne uno solo, che mostri sempre il secondo livello, ovunque si trovi nel sito. Lo posso distinguere nelle varie pagine dandogli un titolo specifico, ad esempio "Menu Lombardia" o "Menu Veneto". Il campo intestazione del modulo quindi lo rendo automatico grazie ad un codice come il seguente: la regione è una variabile assegnata dalla pagina stessa.
Menu { {page::pageTitle} }
Ci sono anche delle variabili di ambiente, io le considero sempre proprie della pagina, mi possono essere utili per creare dei link con path assoluto, o per comporre dei link che considerino la lingua corrente.
/{ {page::language} }/{ {page::alias} }.html = /it/questapagina.html { {env::host} } = www.sito.com { {env::url} } = http://www.sito.com { {env::path} } = http://www.sito.com/cartellaroot/ { {env::request} } = questapagina.html Per conoscere l'URL della pagina vista in precedenza: { {env::referer} } Se ho voluto complicarmi la vita, ed in impostazioni generali ho cambiato i path per gli script e file, ho anche questi: Cartella dove si trova "files" { {env::files_url} } se siamo in un template possiamo usare anche <?php echo TL_FILES_URL; ?> Cartella dove si trova "plugins" { {env::plugins_url} } Cartella dove si trova "script" { {env::script_url} }
Anche questi insert tag sono molto interessanti, io uso spesso quello per includere moduli all'interno di un altro modulo di tipo HTML custom. Per esempio compongo l'header della pagina posizionando un menu, poi un modulo per il cambio lingua, forse una form per la ricerca o altri moduli.
Oppure uso l'insert tag per inserire articoli o contenuti, è un trucco utile nei casi in cui ci siano dei pezzi modificabili dal cliente, però posizionati in parti del sito per lui difficili o inaccessibili. Per esempio i testi nel modulo footer della pagina, o la porzione dell'informativa della Privacy presente alla fine delle form contatto o registrazione, ed altri casi particolari. Risolvo l'esigenza di permettere al cliente la modifica dei contenuti pur non dandogli permessi in determinate aree delicate del back end (come moduli, form o template).
Devo sapere l'id dell'articolo o del modulo per inserirlo { {insert_module::5} } { {insert_article::10} } Potrei anche inserire lo specifico contenuto di un determinato articolo { {insert_content::15} }
L'inclusione di file è ancora più particolare, infatti si tratta di codice PHP, quindi eseguibile con le più disparate elaborazioni, utile in casi abbastanza complessi e non risolvibili in altro modo con i template di Contao.
Il file php deve essere caricato nella cartella "templates".
{ {file::miofile.php} } Si possono anche inserire argomenti: { {file::miofile.php?arg1=val&arg2=val} }
Infine l'inclusione di immagini, altro insert tag molto interessante, in quanto permette di ridimensionare e/o tagliare la foto in base a determinati parametri, gli stessi che usa Contao per le gallerie fotografiche.
Posso usarlo nei moduli di HTML custom per inserire dei loghi, o anche nei template per forzare le misure di alcune foto presenti.
Le foto devo averle caricate ovviamente nel server. L'immagine che ottengo tramite l'insert tag è una elaborazione salvata nella cache di Contao, per vederla in HTML la devo chiamare normalmente con l'attributo src di un tag <img>
Per tagliare la foto ho molte opzioni, la lista completa:
Inserimento di una immagine con crop e resize { {image::path/to/img.jpg?width=100&height=100&mode=crop} } Lo stesso effetto lo posso ottenere via PHP (sempre a patto di essere in un template) <?php echo $this->getImage('path/to/img.jpg', 100, 100, 'crop'); ?>
Di seguito alcuni esempi per mostrare una data, o per mostrare delle porzioni di pagina in base alla lingua.
Inserimento di una data, formattata come si desidera, per esempio metto l'anno di copyright nel footer ©{ {date::Y} } Inserimento di stringhe di testo tradotte in lingua in base ad una verifica sulla pagina corrente { {iflng::en} }Testo in Inglese{ {iflng} } { {iflng::de} }Testo in tedesco{ {iflng} } Posso mettere un testo valido per ogni altra lingua eccetto quella che definisco { {iflng::de} }Testo in tedesco{ {iflng} } { {ifnlng::de} }Testo per i non Tedeschi { {iflng} }
Contao ha un metodo molto facile per scoprire che tipo di device possiede l'utente, e così possiamo agire di conseguenza apportando modifiche al CSS, oppure al codice HTML della pagina.
La documentazione completa del sistema di browser detection è a questa pagina. Nel class del <body> di ogni sito Contao infatti troviamo quanto riportano.
Però a me non basta, voglio di più, di seguito metto un piccolo script PHP che utilizza queste variabili, in modo da includere o meno determinate cose se il browser è Internet Explorer inferiore a versione 9 (lo stesso risultato è ottenibile tramite i commenti condizionali, ma con PHP la pagina risulta più pulita). Ovviamente potete cancellare gli "echo", sono solo per dimostrazione.
<?php $this->import('Environment'); $ua = $this->Environment->agent; echo "OS: " . $ua->os; echo "<br>browser: " . $ua->browser; echo "<br>short: " . $ua->shorty; echo "<br>version: " . $ua->version; echo "<br>mobile? " . $ua->mobile; echo "<br>class: " . $ua->class; if ($ua->shorty == "ie"): if ($ua->version < 9): ?> Attenzione! il tuo Internet Explorer è vecchio, aggiornalo! <?php endif; endif; ?>
Per sapere tutte le variabili presenti in un qualsiasi template basta inserire il seguente codice, avremo l'output dell'intero array.
<pre><?php $this->showTemplateVars(); ?></pre>
Se invece vogliamo l'array delle variabili globali, dobbiamo fare l'output di objPage.
<pre><?php global $objPage; print_r($objPage); ?></pre> Se non basta, faccio l'output di tutte le variabili definite <?php get_defined_vars(); ?> Posso cambiare al volo le variabili globali, o aggiungerne di nuove <?php $GLOBALS['objPage']->pageTitle = 'Il mio nuovo titolo ... '; ?> In questo esempio aggiungo la categoria di Catalog al titolo della pagina <?php if(strlen($this->Input->get('categorie'))) { global $objPage; $objPage->pageTitle = "".$entry['data']['categorie']['value']." - Sito X"; } ?>
Aggiungi un commento