Applicare lo stile Gradient al template YOOmaster 2

Immagine da Joomla

È destino che ad ogni aggiornamento di Joomla o del template YOOmaster 2 sorgano nuovi problemi.

Dopo l'installazione della versione 3.4.5 di Joomla, che già non è indolore poichè richiede necessariamente anche l'aggiornamento contestuale del template, come descrivo nell'articolo Aggiornamento a Joomla 3.4.5, avrete notato su questo sito un cambiamento nello stile di menu, pulsanti ed altro, che non presentavano più l'effetto "bombato" (o "gradiente" per gli iniziati) solito ma avevano invece un aspetto piatto, piuttosto anonimo.

La causa è semplice da individuare, è stato molto meno immediato correggere il problema.

Procedura per applicare il tema Gradient al template YOOmaster 2

• Fare una copia della cartella

  <%cartella sito%>\templates\yoo_master2\less

  allo stesso livello, assegnandole un nome diverso p.e. less-custom
• Aprire il file

  <%cartella sito%>\templates\yoo_master2\config.php

  e modificare le righe

  		'path' => array(
  			'theme'   => array(__DIR__),
  			'js'      => array(__DIR__.'/js'),
  			'css'     => array(__DIR__.'/css'),
  			'less'    => array(__DIR__.'/less'),
  			'layouts' => array(__DIR__.'/layouts')
  		),

  in (notare il grassetto)

  		'path' => array(
  			'theme'   => array(__DIR__),
  			'js'      => array(__DIR__.'/js'),
  			'css'     => array(__DIR__.'/css'),
  			'less'    => array(__DIR__.'/less-custom'),
  			'layouts' => array(__DIR__.'/layouts')
  		),

• Aprire il file

  <%cartella sito%>\templates\yoo_master2\less-custom\theme.less

  e aggiungere all'inizio:

  @import "../less/theme.less";

• Cancellare la cartella

  <%cartella sito%>\templates\yoo_master2\less-custom\bootstrap;

• Scaricare il uikit-master.zip da http://getuikit.com/docs/documentation_project-structure.html
• Cancellare il contenuto della cartella

  <%cartella sito%>\templates\yoo_master2\less-custom\uikit

• Decompattare la cartella

  uikit-master\themes\gradient

  presente nel file zip in

  <%cartella sito%>\templates\yoo_master2\less-custom\uikit

• Accertarsi che esista la cartella

  <%cartella sito%>\templates\yoo_master2\styles\custom\css;

  dove custom è il nome del vostro stile personalizzato. Se non presente, crearla; qui vengono copiati i file css risultanti dalla compilazione degli elementi less
• Aprire l'interfaccia di amministrazione del sito e selezionare Estensioni - Template; fare clic su yoo_master2 - Default; selezionare la scheda Options e fare clic su Customizer
• Fare clic su Copy e alla richiesta inserire un nome corrispondente allo stile personalizzato creato, in questo caso custom; questo serve per assegnare come target di compilazione less le cartelle corrette. Uscire dal Customizer facendo clic su Save. Questo avvia la compilazione dei file Less e la successiva creazione dei necessari.
• Non dimenticate di definire come stile da caricare all'avvio quello personalizzato, cioè custom, in Layouts - Style e quindi salvare.