Mese: Maggio 2013

Settare CakePHP per il multilingua

Spesso mi sono trovato nella situazione di realizzare dei progetti multilingua, per Cake c’è un plug-in che potete utilizzare, sviluppato dal CakeDC, che personalmente uso in tutti i nuovi progetti.

Il vostro sito passerà dall’indirizzo http://www.miosito.it/articoli all’URL http://www.miosito.it/eng/articoli.
Questa modifica da diversi benefici al vostro progetto:

  1. gli URL sono seguibili dai motori di ricerca e vengono indicizzate tutte le pagine con URL diversi per ogni lingua
  2. quando un utente condivide la pagina che sta visionando passa un URL completo e nella lingua corretta

Il plug-in i18n lo trovate nel repository https://github.com/CakeDC/i18n

Vediamo come installarlo ed iniziare ad utilizzare il multi lingua.

Prima di tutto dovete scaricare o clonare la repo nella cartella app/Plugin, verificate di creare la cartella i18n e che tutti i file siano presenti al suo interno.

Ora bisogna aprire il file app/Config/bootstrap.php ed inserire queste righe:

define('DEFAULT_LANGUAGE', 'ita'); // le 3 lettere che definiscono la vostra lingua di default
Configure::write('Config.languages', array('ita','eng', 'deu', 'fre', 'jpn', 'spa', 'rus')); //lista delle lingue che volete utilizzare nel sito
CakePlugin::load('I18n', array('routes' => true)); //caricamento del plugin

Queste righe servono per definire la lingua di default usata, le lingue usate nel sito e dice a CakePHP di caricare il plugin i18n ed utilizzare la classe I18nRoute che si trova nel plugin.

Bene, spieghiamo a CakePHP come deve utilizzare i nostri nuovi URL. Aprite il file app/Config/routes.php e modificatelo in questo modo:

App::uses('I18nRoute', 'I18n.Routing/Route');
Router::connect('/', array('controller' => 'pages', 'action' => 'display', 'home'), array('routeClass' => 'I18nRoute'));
Router::connect('/pages/*', array('controller' => 'pages', 'action' => 'display'), array('routeClass' => 'I18nRoute'));

Ricordate che ogni nuova direttiva che andrete ad aggiungere in questo file dovrà avere come parametro array(‘routeClass’ => ‘I18nRoute’).

Assicurati di avere questa riga:

CakePlugin::routes();

dovresti trovarla verso la fine della pagina, e commenta o cancella la riga:

require CAKE . 'Config' . DS . 'routes.php';

Abbiamo quasi finito, ora insegniamo a come creare i nuovi URL, apri il file app/View/Helper/AppHelper.php e modificalo così:

class AppHelper extends Helper {
public function url($url = null, $full = false) {
if (empty($url) || (is_array($url) && !array_key_exists('lang', $url))) {
$url['lang'] = Configure::read('Config.language');
}
return parent::url($url, $full);
}
}

Ottimo, abbiamo finito, ora ti spiegherò ancora due cosette.

Come creare lo switcher per le lingue

Se vuoi creare in modo semplice uno switcher per cambiare la lingua, CakePHP ha già “tutto pronto”. Nel tuo layout devi solamente inserire queste poche righe e magicamente vedrai comparire le bandiere per la selezione della lingua.

Aggiungi nell’AppController l’helper dell’i18n, apri app/Controller/AppController.php e modifica così:

class AppController extends Controller {
public $helpers = array('I18n.I18n', ...);
}

nel tuo layout, in questo caso quello di default, app/View/Layouts/default.ctp

<?php echo $this->I18n->flagSwitcher(array('class' => 'languages', 'id' => 'language-switcher')); ?>

Come usare il requestAction

Ti capiterà di utilizzare il requestAction all’interno del tuo progetto, cerca di usarlo quando è strettamente necessario, quando fai una chiamata con questa funziona purtroppo CakePHP ha bisogno di un aiuto, gli devi specificare in che lingua ti servono i risultati, questo si fa così:

&lt;?=$this-&gt;requestAction('/'.Configure::read('Config.language').'/menus/generate/1',array('return'));?&gt;

oppure, questo è il metodo che uso io, in AppController:

public function beforeFilter() {
$this-&gt;set('language',Configure::read('Config.language'));
}

così ho la lingua disponibile in tutto il sito e per il requestAction:

&lt;?=$this-&gt;requestAction('/'.$language.'/menus/generate/1',array('return'));?&gt;

tutto questo naturalmente nella view.

Aumentare le prestazioni, Javascript alla fine del codice HTML

Per aumentare le prestazioni di una pagina HTML ci sono varie tecniche che si possono utilizzare, dall’utilizzo della cache alla compressione delle pagine lato server con gzip, all’ottimizzazione delle immagini, ed altre ancora che se applicate con criterio possono ridurre in modo consistente il caricamento e la visualizzazione della pagina web.

Una tecnica che sta prendendo sempre più piede è di spostare tutto o quasi il codice Javascript a fondo pagina, prima della chiusura dei tag </body></html>. Questa tecnica porta diversi vantaggi:

  1. nel caso ci sia un errore nel vostro Javascript la pagina viene comunque caricata completamente senza essere interrotta
  2. si crea all’utente l’illusione di aver caricato la pagina molto velocemente perché gli script devono essere ancora scaricati ed eseguiti

Spostare il Javascript a fondo pagina ha anche anche degli aspetti negativi:

  1. tutti gli script che inserite “inline” dovranno essere eseguiti al caricamento di tutto
  2. le eventuali modifiche grafiche fatte tramite Javascript saranno eseguite “solamente” a caricamento completato

Un esempio pratico:

<html>
<head>
<link rel="stylesheet" href="css/main.css" type="text/css" media="screen" />
</head>
<body>
<div id="content">Hello World!</div>
<script type="text/javascript" src="js/script1.js"></script>
<script type="text/javascript" src="js/script2.js"></script>
<script >function abc(){ alert(&#039;ready&#039;);} abc()</script>
</body>
</html>