Guida templating Selfcomposer 3

Benvenuti nella guida per la creazione e la modifica di temi per SelfComposer 3, questo manuale è indirizzato ai programmatori front-end che intendono realizzare o modificare temi per il CMS. Le spiegazioni e la struttura dei file fanno riferimento a un ipotetico tema di base, senza moduli aggiuntivi, che vengono approfonditi separatamente nella sezione dedicata.

Cos'è un tema

I temi di SelfComposer permettono di mostrare i contenuti creati nel pannello, con una grafica e una disposizione personalizzata. L'amministratore del sito può scegliere di attivarne uno, che verrà subito applicato anche in front-end. Il cambio di un tema non compromette nessuna cancellazione dei contenuti, che rimangono comuni per tutti i temi, ad eccezione delle posizioni di vetrine e menu, e delle impostazioni specifiche del tema, che vengono comunque tutte salvate nel database per un riutilizzo futuro.

Come creare un tema

Per realizzare un tema è consigliabile partire da una struttura di file base per poi modificarne le varie viste e lo stile grafico, si raccomanda di scegliere come nome della cartella principale una dicitura diversa dai temi standard più diffusi. Inserite quindi la cartella del tema in cms-contents/themes/ , aprite il pannello di SelfComposer e troverete il nuovo tema in Impostazioni > Temi da dove è possibile attivarlo.

Le informazioni mostrate in questa schermata sono contenute in theme.php.

I linguaggi

I temi di SelfComposer utilizzano un template engine per il PHP: TWIG. Il suo utilizzo permette di eseguire diverse operazioni utili per il front-end: richiamare contenuti del pannello, includere file HTML, suddividere il tema in blocchi, eseguire operazioni di base (variabili, for, if ecc). Per sviluppare temi e comprendere questa guida, è necessario conoscere il funzionamento di TWIG, inoltre in SelfComposer sono stati aggiunti alcuni filtri aggiuntivi.

Gli altri linguaggi utilizzati nei file del tema sono HTML, CSS, JavaScript e PHP.

Questa guida è divisa in 4 macro-aree: funzionalità, file del tema, filtri e componenti aggiuntivi.

Le funzionalità

SelfComposer gode di molteplici funzionalità, nella guida vengono riportate tutte quelle che interagiscono con il front-end. Le pagine di questa sezione contengono tutti i tag e le funzioni disponibili per creare e modificare i vari elementi che compongono il tema, oltre ad esempi specifici.

I file

Questa sezione contiene l'albero dei file di un ipotetico tema base di SelfComposer, sono in gran parte obbligatori se non diversamente specificato. Ogni pagina di questa sezione descrive lo scopo di quel file (o cartella) e contiene una copia scaricabile del file.

I filtri

TWIG permette l'utilizzo di filtri per compiere operazioni specifiche sulle variabili. SelfComposer aggiunge alcuni filtri aggiuntivi elencati di seguito.

Nelle pagine di questa sezione viene descritto l'utilizzo di ogni filtro con esempi specifici.

I componenti aggiuntivi

SelfComposer permette l'integrazione di componenti aggiuntivi come moduli e plugin che aggiungono nuove viste e funzionalità al CMS. Le pagine di questa sezione contengono i file e le funzionalità che si aggiungono a quelli di base descritti nelle sezioni descritte in precedenza.