Scaricato in locale (sul proprio pc) un quadro CSS-JS ad es. da qui, bisogna renderlo funzionante.
Per utilizzare tali modelli precompilati ProcessWire non ci chiede di ristrutturarli in base alle forme di un linguaggio terzo (da aggiungere alla lista di quelli che dovremmo imparare - html, php, css) ma di caricarli nella sezione giusta del sito. Vediamo qual è.
- Aprire il sito in remoto (quindi tramite ftp - filezilla).
- Posizionarsi su .../site/templates. Qui troverete 3 cartelle ("errors", "scripts", "styles") + 8 file singoli (alla versione 2.7 di PW).
- Bisogna aggiungere a questa lista le altre cartelle ed eventualmente gli altri file che abbiamo scaricato sul nostro pc prelevandoli da internet. Solitamente i quadri CSS-JS si compongono di 3-4 cartelle principali (con un nome da scegliere affinchè non entrino in conflitto con le altre cartelle di programma): "css", "img", "js", "images".
- Selezionarle nel proprio pc tramite filezilla e spostarle nella cartella .../site/templates.
Per rendere funzionante questa "struttura" in 4 cartelle appena impiantata, è necessario modificare MANUALMENTE codice di riferimento di ciascun file (css /js/font) nei template.
Se non avete alcun modello , allora si dovrebbe almeno crearne uno e utilizzarlo per ogni pagina (mi riferisco al modello di base-page per esempio trovato nell'installazione predefinita) quindi creare l'albero di pagine.
Ma alcune volte i creatori del quadro CSS-JS includono nel pacchetto delle NOTE SPECIALI su come impostare il codice html del sito in riferimento alle porzioni css e js da aggiungere.
Seguite pedissequamente l'eventuale guida fornita su quanto và aggiunto dopo il tag <head> di ogni pagina html del nostro sito e alla fine, appena prima del tag </body>.
Ma con una accortezza.
Il set API di processwire fornisce una stringa di codice:
$config->urls->templates che serve a nominare direttamente la cartella "templates" del sito PW.
Perciò, bisogna utilizzare questa stringa tutte le volte che le istruzioni Q.CSS-JS fornite dal creatore del quadro, si riferiscono a tale cartella.
In particolare, per il css nella sezione <head> bisognerà eventualmente utilizzare:
<link rel="stylesheet" type="text/css" href="<?php
echo $config->urls->templates; ?>css/bootstrap.min.css" />
Mentre per il js:
<script type="text/javascript" src="<?php echo $config->urls->templates; ?>js/bootstrap.min.js"></script>
<script type="text/javascript" src="<?php echo $config->urls->templates; ?>js/bootstrap.min.js"></script>
Qualora un quadro CSS-JS utilizzi o crei proprie testate ("head") e propri piè di pagina ("footer"), bisognerà rimuovere quelli predefiniti da processwire, cioè i file head.inc e foot.inc che trovate nella cartella "templates" in mezzo agli altri file.
Viceversa, se noi stiamo ancora utilizzando i suddetti file, laddove il quadro CSS-JS faccia in qualche parte riferimento a tali sezioni del sito, bisognerà naturalmente sovrascriverne la dicitura con le espressioni esatte, proprie di PW: "head.inc" e "foot.inc".
Nessun commento:
Posta un commento
Grazie per la collaborazione!