Το Odyssey CMS διαθέτει ένα απλό templating σύστημα το οποίο μας επιτρέπει να έχουμε περισσότερες εκδόσεις τρόπου εμφάνισης του site μας.
Λόγω της φύσης του όμως (μη σταθερή δομή ώστε να καλύπτει οποιαδήποτε ανάγκη του developer), θα πρέπει να καταστεί σαφές πως κάθε template θα πρέπει να αντιστοιχεί σε μια γνωστή δομή του περιεχομένου.
Σε προηγούμενες εκδόσεις, αυτό σήμαινε πως τα views θα έπρεπε να αντιστοιχούν σε υφιστάμενους controllers ώστε να καλύπτουν όλες τις εγκατεστημένες ενότητες του site μας. Αυτό άλλαξε πλέον με την νέα δυνατότητα αυτόματων controllers & views που προσθέσαμε στην έκδοση 2.8.
Ο τρόπος με τον οποίο διαχειριζόμαστε αυτό το νέο αυτοματισμό, περιγράφεται στο video που ακολουθεί στο τέλος του άρθρου.
Όλα τα templates (πρότυπα εμφάνισης) στο Odyssey, αποθηκεύονται στον φάκελο «templates». Το κάθε template πρέπει να έχει ένα system name και κατά την εγκατάστασή του θα δημιουργηθεί ένας φάκελος με αυτό το όνομα μέσα στον φάκελο «templates».
Θα πρέπει να συνοδεύεται από ένα manifest XML file με όνομα «install.xml». Το αρχείο αυτό περιέχει όλες τις παραμέτρους που χρειάζεται το Odyssey για να εγκαταστήσει το template.
Η δομή του είναι η ακόλουθη:
Όλα τα αρχεία της εγκατάστασης θα πρέπει να συμπεριλαμβάνονται σε ένα αρχείο zip που θα περιέχει και την δομή των φακέλων του.
Οι απαραίτητοι φάκελοι είναι:
- images
- css
- js
- modules
Στον φάκελο modules θα πρέπει να συμπεριλαμβάνουμε σε μορφή zip, όλα τα modules που θα χρησιμοποιεί το template μας. Εκτός από τα zip αρχεία, θα πρέπει το κάθε module να συνοδεύεται και από το κατάλληλο parameters txt file. Το αρχείο αυτό μπορείτε πολύ εύκολα να το δημιουργείτε από την σελίδα παραμετροποίησης του εγκατεστημένου ενθέματος, μέσω του συνδέσμου «export module settings» στο κάτω δεξί τμήμα της σελίδας.
Επίσης προεραιτικά μπορείτε να δημιουργήσετε και ένα φάκελο «mediabank» ο οποίος θα πρέπει να περιέχει όσα αρχεία απαιτούνται από κάποια modules και πρέπει να εγκατασταθούν στην Βιβλιοθήκη Αρχείων του Odyssey CMS. Τα filenames αυτών των αρχείων θα πρέπει να είναι ίδια με αυτά που αναφέρονται στο αρχείο παραμέτρων του module που τα χρειάζεται.
Ένα δείγμα template σε zip επισυνάπτεται στο τέλος αυτού του άρθρου. Μπορείτε να το χρησιμοποιείτε σαν βάση για την δημιουργία ενός νέου προτύπου εμφάνισης.
Το XML της εγκατάστασης αναφέρεται στους τομείς name, title, protected, files και slots.
Το name προσδιορίζει το system name του template και θα πρέπει να αποτελείται από λατινικούς χαρακτήρες χωρίς κενά, αφού το όνομα αυτό θα πάρει ο φάκελος εγκατάστασης.
Το title προσδιορίζει τον εμφανιζόμενο τίτλο στον πίνακα διαχείρισης.
Το protected αν έχει τιμή 1 προσδιορίζει το template ως system template και δεν επιτρέπει την απεγκατάστασή του. Συνήθως πρέπει να έχει τιμή 0.
Στον τομέα files ορίζουμε όλα τα αρχεία του template εκτός από τις εικόνες που θα πρέπει να βρίσκονται μέσα σ' ένα φάκελο με όνομα images (εξαίρεση αποτελούν τα sprite images και θα αναφερθούμε παρακάτω σε αυτά). Κάθε εγγραφή περιέχεται στο tag <file> και μπορεί να συμπεριλάβει τρία attributes, το type, το role και το condition.
Το type παίρνει τιμές root, css, js, sprite και ορίζει αντίστοιχα:
- Root files οποιουδήποτε τύπου
Τα αρχεία αυτά εγκαθίστανται στο root folder του template - CSS files
Πρέπει να είναι αρχεία με επέκταση "css" και αποθηκεύονται μέσα στο φάκελο «css» του template - Javascript files
Πρέπει να είναι αρχεία με επέκταση "js" και αποθηκεύονται μέσα στο φάκελο «js» του template - Sprite images
Πρόκειται για αρχεία εικόνας που το Odyssey θα αντιμετωπίσει ως sprite images. Αν και εικόνες θα αποθηκευθούν ξεχωριστά στην διαδρομή του συστήματος /mediabank/icons/
Το condition χρησιμοποιείται για να οριστεί μια συγκεκριμένη συνθήκη που θα καθορίζει αν πρέπει να φορτωθεί κάποιο js ή css αρχείο. Για παράδειγμα το condition="if lt IE 9" θα φορτώσει το αρχείο μόνο αν η έκδοση του Internet Explorer είναι προγενέστερη του IE9.
Στον τομέα slots ορίζουμε όλες τις θέσεις (positions) του template, στις οποίες μπορούν να φορτωθούν αργότερα τα κατάλληλα ενθέματα (modules). Κάθε εγγραφή περιέχεται στο tag <slot> και συνοδεύεται από το attribute title. Το κάθε <slot> περιέχει το system name (πρέπει να αποτελείται από λατινικούς χαρακτήρες χωρίς κενά) και το attribute title προσδιορίζει τον τίτλο του slot μέσα στον πίνακα διαχείρισης του Odyssey.
Υπάρχουν κάποιες συμβάσεις στην ονοματολογία των αρχείων, που καθορίζουν συγκεκριμένη συμπεριφορά:
- Κάθε αρχείο που αντιστοιχεί σε view κάποιας ενότητας, πρέπει νε έχει όνομα τύπου "view_" + Section System Name + "_" + View Name + ".php". Αν για παράδειγμα η ενότητα (section) ονομάζεται products και θέλουμε να δημιουργήσουμε το view της αναζήτησης προϊόντων, τότε το αρχείο θα είναι view_products_search.php.
Αν θέλουμε να δημιουργήσουμε ένα view που θα παρουσιάζει ένα κατάλογο εγγραφών της ενότητας, το όνομα του θα πρέπει να είναι list.
Αντίστοιχα το view που θα παρουσιάζει μια επιλεγμένη εγγραφή, θα πρέπει να ονομάζεται node. - Αν ένα css ή js αρχείο, έχει ως όνομα το όνομα μιας ενότητας (section) του Odyssey, τότε θα φορτωθεί αυτόματα όταν κληθεί η ομώνυμη ενότητα. Για παράδειγμα αν υπάρχει το articles.js θα φορτωθεί αυτόματα σε όλες τις σελίδες που σχετίζονται με παρουσίαση άρθρων.
- Αν ένα js αρχείο, έχει ως όνομα την λέξη ready (ready.js), θα φορτωθεί το περιεχόμενό του σε τμήμα on document ready της javascript, και αυτό θα ισχύει για όλες τις σελίδες του template.
- Αν ένα js αρχείο, έχει ως όνομα το όνομα μιας ενότητας (section) του Odyssey, και ως επίθεμα το _ready.js, τότε θα φορτωθεί το περιεχόμενό του σε τμήμα on document ready της javascript, όταν κληθεί η ομώνυμη ενότητα. Για παράδειγμα αν υπάρχει το articles_ready.js θα εκτελεσθεί ο κώδικας του κατά την ολοκλήρωση της φόρτωσης του DOM, σε όλες τις σελίδες που σχετίζονται με παρουσίαση άρθρων.
- Μπορούμε αν θέλουμε να συμπεριλάβουμε κώδικα javascript που θα παράγεται δυναμικά από αρχείο php με δύο τρόπους:
Για χρήση αποκλειστικά από το τρέχον template
Τοποθετούμε στο root φάκελο του Odyssey ένα αρχείο με όνομα "template_" + Template System Name + ".js.php". Αν για παράδειγμα το template μας ονομάζεται phoenix τότε το αρχείο θα είναι template_phoenix.js.php
Για κοινή χρήση από ολα τα εγκατεστημένα templates
Δημιουργούμε javascript κώδικα μέσα στο αρχείο συστήματος "js/common.js.php"
- meta.txt
Μπορεί να περιέχει όλα τα meta tags που θέλουμε να συμπεριλαμβάνονται στο τμήμα <head> της html κάθε σελίδας του template. - globalCSSFiles.txt
Πρέπει να περιέχει όλα τα css αρχεία της βιβλιοθήκης του συστήματος που θέλουμε να συμπεριλαμβάνονται στο τμήμα <head> της html κάθε σελίδας του template.
Παράδειγμα:
js/fancybox/jquery.fancybox-1.3.4.css
css/odyssey.css
css/ui/jquery-ui.css - globalJsFiles.txt
Πρέπει να περιέχει όλα τα js αρχεία της βιβλιοθήκης του συστήματος που θέλουμε να συμπεριλαμβάνονται στο τμήμα <head> της html κάθε σελίδας του template.
Παράδειγμα:
js/odyssey.js
js/swfobject/swfobject.js
js/fancybox/jquery.fancybox-1.3.4.pack.js
js/jquery-ui.js