Θέμα: «Σχεδιασμός και Ανάπτυξη Εφαρμογής Διαδραστικού Βιβλίου»

Transcript

1 ΣΧΟΛΗ ΤΕΧΝΟΛΟΓΙΚΩΝ ΕΦΑΡΜΟΓΩΝ ΤΜΗΜΑ ΜΗΧΑΝΙΚΩΝ ΠΛΗΡΟΦΟΡΙΚΗΣ ΤΟΜΕΑΣ ΥΠΟΛΟΓΙΣΤΙΚΩΝ ΣΥΣΤΗΜΑΤΩΝ Θέμα: «Σχεδιασμός και Ανάπτυξη Εφαρμογής Διαδραστικού Βιβλίου» ΠΤΥΧΙΚΗ ΕΡΓΑΣΙΑ ΑΘΑΝΑΣΙΑΔΟΥ ΑΙΜΙΛΙΑ Α.Ε.Μ : 1342 ΑΠΟΣΤΟΛΙΔΗΣ ΙΩΑΝΝΗΣ Α.Ε.Μ : 1271 ΒΛΑΧΟΥ ΜΑΡΙΑ Α.Ε.Μ. : 2270 ΚΑΡΑΓΙΑΝΝΗΣ ΠΑΝΑΓΙΩΤΗΣ Α.Ε.Μ : 1293 Επιβλέπων Καθηγητής: Δρ. Αύγουστος Τσινάκος ΚΑΒΑΛΑ 2014

2 ΕΥΧΑΡΙΣΤΙΕΣ Η παρούσα πτυχιακή εργασία με θέμα «Σχεδίαση και Ανάπτυξη Διαδραστικού Βιβλίου» πραγματοποιήθηκε στο πλαίσιο της πτυχιακής εργασίας στο τμήμα Μηχανικών Πληροφορικής του Τεχνολογικού Εκπαιδευτικού Ιδρύματος Καβάλας. Θα θέλαμε να απευθύνουμε τις ευχαριστίες μας στον επιβλέπων καθηγητή μας κ. Αύγουστο Τσινάκο, ο οποίος μας εμπιστεύτηκε την ανάθεση της εργασίας αυτής καθώς και την πολύτιμη καθοδήγηση του στα πλαίσια της αποπεράτωσής της. 1

3 ΠΡΟΛΟΓΟΣ Ο τίτλος της πτυχιακής εργασίας που μας έχει ανατεθεί είναι «Σχεδιασμός και ανάπτυξη διαδραστικού βιβλίου». Η υλοποίηση στηρίζεται σε πλατφόρμα ανοιχτού κώδικα και ως περιβάλλον ανάπτυξης του συστήματος επιλέχθηκε η πλατφόρμα CMS WordPress (Wordpress, 2013) το οποίο λόγω του υψηλού βαθμού παραμετροποίησης του δίνει την ευχέρεια τόσο στον σχεδιαστή όσο και στον χρήστη (καθηγητή / μαθητή) να χρησιμοποιήσει και να προσαρμόσει τις δυνατότητες σύμφωνα με τις ανάγκες που προκύπτουν κάθε φορά. Στην εργασία αυτή γίνεται προσπάθεια να προσδιοριστεί το κοινωνικό και οικονομικό πλαίσιο μέσα στο οποίο εξελίσσεται ο τομέας της εκπαίδευσης σε όλο της το φάσμα και να αποτυπωθούν οι διάφορες τάσεις σε σχέση με τις νέες τεχνολογικές προσεγγίσεις και ιδιαίτερα με τις τεχνολογίες παγκοσμίου ιστού και τον τρόπο με τον οποίο αυτές επηρεάζουν την εκπαίδευση. Συγκεκριμένα, στην ιστοσελίδα που έχουμε δημιουργήσει έχουμε προσθέσει αρχικά δύο βιβλία τα οποία είναι «Ανάπτυξη εφαρμογών σε προγραμματιστικό περιβάλλον», ένα βιβλίο της Γ Λυκείου και το δεύτερο «Ασύρματα Δίκτυα» του τμήματος της Βιομηχανικής Πληροφορικής. Ο χρήστης θα έχει τη δυνατότητα να διατυπώνει σχόλια και απορίες σε όλο το βιβλίο αλλά και σε κάθε κεφάλαιο ξεχωριστά. Υπάρχει επίσης και η δυνατότητα να αλλάξει την γλώσσα του μενού στα αγγλικά, να πραγματοποιήσει αναζήτηση με το κουμπί που έχουμε δημιουργήσει στην μπάρα του μενού. Με αυτό τον τρόπο μπορεί εύκολα και γρήγορα να βρει οτιδήποτε θελήσει μέσα στα βιβλία που έχουμε ανεβάσει. Επιπλέον, του δίνεται η δυνατότητα να το μοιράζεται και στα κοινωνικά δίκτυα (Facebook, Twitter, Google Plus), θα μπορεί να ανεβάζει αρχεία και εικόνες καθώς και να επικοινωνεί με τους διαχειριστές μέσω της φόρμας επικοινωνίας που έχουμε δημιουργήσει. Όλες οι παραπάνω λειτουργίες διαχειρίζονται από ένα σύστημα σχολιασμού το οποίο ενημερώνει τους διαχειριστές της ιστοσελίδας με ανάλογο , επιτρέπει την αποστολή αρχείων και την χρήση των τριών καταστάσεων όσον αφορά τα σχόλια δηλαδή έγκριση/αναμονή εγκεκριμένο απόρριψη. Στην πτυχιακή αυτή εργασία εξετάζονται και τεκμηριώνονται οι τρόποι με τους οποίους σχεδιάστηκαν, αναπτύχθηκαν και υλοποιήθηκαν όλα τα παραπάνω. 2

4 ΕΠΙΣΚΟΠΗΣΗ ΚΕΦΑΛΑΙΩΝ Το πρώτο κεφάλαιο περιέχει μία εισαγωγική αναφορά στην συγκέντρωση του υλικού που χρησιμοποιήθηκε, στο περιβάλλον υλοποίησης και τέλος, στον σχεδιασμό του διαδραστικού βιβλίου της συγκεκριμένης ιστοσελίδας. Στο δεύτερο κεφάλαιο γίνεται ανάλυση όλων των εργαλείων που υπάρχουν διαθέσιμα για την υλοποίηση της ιστοσελίδας, από τις γλώσσες προγραμματισμού μέχρι τα διαθέσιμα συστήματα διαχείρισης περιεχομένου. Στο τρίτο κεφάλαιο περιγράφονται όλα τα εργαλεία που χρησιμοποιήθηκαν και για τους λόγους για τους οποίους χρησιμοποιήθηκαν, αφού πρώτα γίνεται η ανάλυση των απαιτήσεων και των προδιαγραφών πάνω στις οποίες βασίστηκε ο σχεδιασμός της ιστοσελίδας και καταλήγει με τα σχεδιαγράμματα ροής ώστε να γίνει πιο κατανοητή η λειτουργία των απαιτήσεων και των προδιαγραφών. Το τέταρτο κεφάλαιο εμπεριέχει όλη την διαδικασία της υλοποίησης. Ξεκινώντας με τις ρυθμίσεις που έγιναν στον πίνακα ελέγχου, συνεχίζοντας με την εγκατάσταση του υλικού όπου περιέχει την διαδικασία δημιουργίας σελίδων καθώς και την εγκατάσταση όλων των πρόσθετων που χρησιμοποιήθηκαν. Τέλος, παρουσιάζονται κάποια αντιπροσωπευτικά κομμάτια κώδικα, όπου γράφτηκαν για την δημιουργία νέων προσθέτων. Τέλος, στο 5ο κεφάλαιο, γίνεται περιληπτικά μία ανασκόπηση όλης της εργασίας, κάποιες ιδέες που μπορούν να υλοποιηθούν μελλοντικά πετυχαίνοντας έτσι την επέκταση της ιστοσελίδας και τέλος κάποια συμπεράσματα γενικά που αφορούν την συγκεκριμένη πτυχιακή εργασία. 3

5 Πίνακας περιεχομένων ΕΥΧΑΡΙΣΤΙΕΣ... 1 ΠΡΟΛΟΓΟΣ... 2 ΕΠΙΣΚΟΠΗΣΗ ΚΕΦΑΛΑΙΩΝ... 3 ΠΙΝΑΚΑΣ ΠΕΡΙΕΧΟΜΕΝΩΝ... 4 ΠΙΝΑΚΑΣ ΕΙΚΟΝΩΝ... 6 ΚΕΦΑΛΑΙΟ ΕΙΣΑΓΩΓΙΚΑ Συγκέντρωση υλικού Περιβάλλον υλοποίησης Τι είναι διαδραστικότητα Σχεδιασμός και Ανάπτυξη Διαδραστικού Βιβλίου Σχεδιασμός Σύνοψη ΚΕΦΑΛΑΙΟ 2... Σφάλμα! Δεν έχει οριστεί σελιδοδείκτης. 2. ΔΙΑΘΕΣΙΜΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΗΝ ΑΝΑΠΤΥΞΗ ΤΗΣ ΕΦΑΡΜΟΓΗΣ Συστήματα διαχείρισης περιεχομένου (Content Management Systems CMS) Δυνατότητες συστήματος διαχείρισης περιεχομένου (CMS) Συστήματα διαχείρισης περιεχομένου ανοιχτού κώδικα (Open Source CMS) Διαθέσιμα συστήματα διαχείρισης περιεχομένου (CMS) Drupal Joomla WordPress Δημιουργία δικής μας εφαρμογής CMS Διαθέσιμες γλώσσες προγραμματισμού PHP HTML CSS Javascript Asp.net Σύγκριση Asp.net και PHP ΚΕΦΑΛΑΙΟ

6 3. ΣΧΕΔΙΑΣΜΟΣ ΚΑΙ ΕΡΓΑΛΕΙΑ ΠΟΥ ΧΡΗΣΙΜΟΠΟΙΗΘΗΚΑΝ ΣΤΗΝ ΕΦΑΡΜΟΓΗ Σχεδίαση και ανάλυση απαιτήσεων Απαιτήσεις Προδιαγραφές Διαγράμματα Ροής Σύνοψη σχεδίασης και ανάλυσης απαιτήσεων Επιλογή συστήματος διαχείρισης περιεχομένου (CMS) Εισαγωγή Γιατί WordPress; Πλεονεκτήματα του WordPress σε σχέση με άλλα CMS Δομή των αρχείων του WordPress Η Δομή των φακέλων Η δομή της Βάσης Δεδομένων Ο Πίνακας ελέγχου του WordPress ΚΕΦΑΛΑΙΟ ΥΛΟΠΟΙΗΣΗ ΤΗΣ ΕΦΑΡΜΟΓΗΣ Εισαγωγή Εγκατάσταση WordPress Εγκατάσταση Θέματος (Template) Ρυθμίσεις στον πίνακα ελέγχου του WordPress Εγκατάσταση υλικού Έτοιμα Πρόσθετα (Plugins) Δημιουργία του πρόσθετου «Δίγλωσσο μενού e-nteraction» Δημιουργία πρόσθετου «Απαραίτητες functions e-nteraction» Δυνατότητα του χρήστη για σχολιασμό του βιβλίου ΚΕΦΑΛΑΙΟ ΑΝΑΣΚΟΠΗΣΗ ΚΑΙ ΕΠΕΚΤΑΣΗ ΕΡΓΑΣΙΑΣ Γενική ανασκόπηση της εργασίας Επέκταση της ιστοσελίδας Συμπεράσματα Βιβλιογραφία ΠΑΡΑΡΤΗΜΑΤΑ... CD 5

7 Πίνακας εικόνων Εικόνα 1. Αρχική σελίδα ιστολογίου... 9 Εικόνα 2. Λογότυπο και κυρίως μενού ιστολογίου Εικόνα 3. Κυρίως περιεχόμενο και πλευρική μπάρα Εικόνα 4. Υποσέλιδο ιστοσελίδας Εικόνα 5. Διάγραμμα Ροής Επισκέπτη Εικόνα 6. Διάγραμμα Ροής Διαχειριστή Εικόνα 7. Δομή των φακέλων Εικόνα 8. Σύνδεση χρήστη στον Πίνακα Ελέγχου του Wordpress Εικόνα 9. Πίνακας Ελέγχου του Wordpress Εικόνα 10. Άρθρα Πίνακα Ελέγχου στο Wordpress Εικόνα 11. Πολυμέσα Πίνακα Ελέγχου στο Wordpress Εικόνα 12. Σελίδες Πίνακα Ελέγχου στο Wordpress Εικόνα 13. Σχόλια Πίνακα Ελέγχου στο Wordpress Εικόνα 14. Μονάδες Πίνακα Ελέγχου στο Wordpress Εικόνα 15. Μενού Πίνακα Ελέγχου στο Wordpress Εικόνα 16. Πρόσθετα Πίνακα Ελέγχου στο Wordpress Εικόνα 17. Μέλη Πίνακα Ελέγχου στο Wordpress Εικόνα 18. Εργαλεία Πίνακα Ελέγχου στο Wordpress Εικόνα 19. Ρυθμίσεις Πίνακα Ελέγχου στο Wordpress Εικόνα 20. Εγκατάσταση θέματος Εικόνα 21. Γενικές ρυθμίσεις του Wordpress Εικόνα 22. Ρυθμίσεις σύνταξης στον Πίνακα Ελέγχου του Wordpress Εικόνα 23. Ρυθμίσεις ανάγνωσης στον Πίνακα Ελέγχου του Wordpress Εικόνα 24. Ρυθμίσεις συζητήσεων στον Πίνακα Ελέγχου του Wordpress Εικόνα 25. Ρυθμίσεις πολυμέσων στον Πίνακα Ελέγχου του Wordpress Εικόνα 26. Μόνιμοι σύνδεσμοι στον Πίνακα Ελέγχου του Wordpress Εικόνα 27. Δημιουργία νέας σελίδας από τον Πίνακα Ελέγχου Εικόνα 28. Επεξεργασία φόρμας επικοινωνίας Εικόνα 29. Επεξεργασία φόρμας επικοινωνίας Εικόνα 30. Πρόσθετο Audit Trail Εικόνα 31. Πρόσθετο Contact Form Εικόνα 32. Πρόσθετο Exploit Scanner Εικόνα 33. Πρόσθετο Members Εικόνα 34. Πρόσθετο Δίγλωσσο μενού Εικόνα 35. Function δίγλωσσου μενού Εικόνα 36. Edit Menus στον Πίνακα Ελέγχου Εικόνα 37. Function δίγλωσσου μενού_ Εικόνα 38. Function pty_enqueue() Εικόνα 39. Function pty_social_menu () Εικόνα 40. Function pty_author_sxolia() Εικόνα 41. Ρόλοι διαχειριστών από τον Πίνακα Ελέγχου Εικόνα 42. Πεδίο σχολίων στην ιστοσελίδα Εικόνα 43. Εμφάνιση σχολίων από Πίνακα Ελέγχου Εικόνα 44. Εμφάνιση συνημμένου στο πεδίο των σχολίων Εικόνα 45. Φόρτωση αρχείου.docx σε προηγούμενο server

8 7

9 1. ΕΙΣΑΓΩΓΙΚΑ Στο πρώτο κεφάλαιο, θα αναφερθούν η έρευνα και η συγκέντρωση του υλικού, το περιβάλλον υλοποίησης και ο σχεδιασμός του. Μετά από έρευνα που πραγματοποιήθηκε υπάρχουν αρκετά παρόμοια ιστολόγια απλά το συγκεκριμένο είναι βασισμένο περισσότερο στο κομμάτι των σχολίων. 1.1 Συγκέντρωση υλικού Για την συγκέντρωση του κατάλληλου υλικού, κύρια πηγή πληροφοριών υπήρξε το διαδίκτυο. Χρησιμοποιώντας μηχανές αναζήτησης, forums πάρθηκαν πληροφορίες σχετικά με το απαιτούμενο λογισμικό και την χρήση του Περιβάλλον υλοποίησης Σύμφωνα με τις προδιαγραφές που δόθηκαν απαιτούσαν τη χρήση περιβάλλοντος Php και MySql. Για να μπορέσει να χρησιμοποιηθεί αυτή η πλατφόρμα, είναι απαραίτητο να είναι εγκατεστημένος στο σύστημα ένας Apache Server, ο οποίος υποστηρίζει Php και MySql. Ως προς το λειτουργικό σύστημα που πρέπει να χρησιμοποιηθεί στον server, δεν τίθεται περιορισμός. 1.2 Τι είναι διαδραστικότητα Σίγουρα οι περισσότεροι έχουν ακούσει τον όρο διαδραστικότητα. Άλλωστε όπως και να έχει, ζούμε στην εποχή της διαδραστικότητας ακόμα και στη καθημερινότητα μας, μα και σε πολλούς τομείς της ζωής. Τι σημαίνει όμως «διαδραστικότητα»; Πρόκειται για έναν όρο ασαφή και πολυχρησιμοποιημένο αλλά ταυτόχρονα πολυδιάστατο, όπως αποδεικνύεται από την πληθώρα των διαφορετικών ορισμών που δίνονται από τους μελετητές. Η γενική εκδοχή θέλει τη διαδραστικότητα να αποτελεί την «αμοιβαία ανταλλαγή» δράσης μεταξύ ανθρώπων ή μεταξύ ανθρώπων και άψυχων αντικειμένων ή καταστάσεων Σχεδιασμός και Ανάπτυξη Διαδραστικού Βιβλίου Στις μέρες μας υπάρχουν αρκετά ιστολόγια που προσφέρουν δυνατότητα στον επισκέπτη να ανεβάσει/κατεβάσει αρχεία, να δημιουργήσει λογαριασμό (username και password), να επικοινωνήσει μέσω άμεσων μηνυμάτων (chat), μέσω μιας ειδικής φόρμας ή απευθείας μέσω όπως επίσης και τη δυνατότητα σχολιασμού. Σε αυτή την εργασία δόθηκε περισσότερη βάση στο κομμάτι των σχολίων που είναι ουσιαστικά η διαδραστικότητα μεταξύ χρήστη και διαχειριστή. Υπάρχουν δύο ρόλοι διαχειριστών στα σχόλια ο Author και ο Editor. Ο Author είναι υπεύθυνος για τα κεφάλαια και τα υποκεφάλαια των βιβλίων ενώ ο Editor για όλο το βιβλίο. 8

10 Ο επισκέπτης μπορεί να σχολιάσει και να ανεβάσει αρχεία σε οποιοδήποτε κεφάλαιο/υποκεφάλαιο καθώς και στο γενικό βιβλίο. Στην συνέχεια, ανάλογα από το που έχει γίνει το σχόλιο, ο Author ή o Editor έχει τρεις επιλογές (έγκριση αποέγκριση - διαγραφή). Όλα τα παραπάνω διαχειρίζονται από ένα σύστημα σχολιασμού το οποίο ενημερώνει τους διαχειριστές της ιστοσελίδας με ανάλογο e- mail. Στόχος της είναι εκτός από τις βασικές υπηρεσίες που προσφέρουν οι παρόμοιες ιστοσελίδες και η ευκολία του διαχειριστή Σχεδιασμός Σκοπός της συγκεκριμένης ιστοσελίδας ήταν να απευθυνθεί σε όσο το δυνατό πλήθος ανθρώπων. Με αυτό το σκοπό ως οδηγό δημιουργήθηκε ένα εύχρηστο και φιλικό προς τον επισκέπτη ιστολόγιο που δεν χρειάζεται ιδιαίτερες γνώσεις ηλεκτρονικού υπολογιστή. Έτσι, η εξωτερική δομή της συγκεκριμένης ιστοσελίδας αποτελείται από τρία βασικά μέρη. Εικόνα 1. Αρχική σελίδα ιστολογίου 9

11 Αρχικά, από την κεφαλίδα (header), που περιέχει το λογότυπο (e-nteraction) και το κυρίως μενού (αρχική σελίδα, βιβλία, επικοινωνία, για εμάς, σύνδεση, μενού γλώσσας και αναζήτηση). Εικόνα 2. Λογότυπο και κυρίως μενού ιστολογίου Στη συνέχεια, έχουμε το περιεχόμενο (content) που αποτελείται από το κυρίως περιεχόμενο και την πλευρική μπάρα. Εικόνα 3. Κυρίως περιεχόμενο και πλευρική μπάρα Και τέλος, στο κάτω μέρος της σελίδας, το υποσέλιδο (footer) το οποίο αποτελείται από ένα πλαίσιο που περιέχει αναφορικά τα κεφάλαια των βιβλίων, επικοινωνία και την άδεια χρήσης της ιστοσελίδας. 10

12 Εικόνα 4. Υποσέλιδο ιστοσελίδας 1.3 Σύνοψη Συνοψίζοντας, για την εύρεση υλικού, τη δομή της ιστοσελίδας, το λογισμικό χρήσης και το μενού επιλογών που θα περιέχει, έγινε εκτεταμένος έλεγχος, ο οποίος βασίστηκε στο διαδίκτυο, σε μηχανές αναζήτησης και forums. Στο επόμενο κεφάλαιο θα αναφερθούν τα διαθέσιμα συστήματα διαχείρισης περιεχομένου που υπάρχουν καθώς και οι διαθέσιμες γλώσσες προγραμματισμού. 11

13 12

14 2. ΔΙΑΘΕΣΙΜΑ ΕΡΓΑΛΕΙΑ ΓΙΑ ΤΗΝ ΑΝΑΠΤΥΞΗ ΤΗΣ ΕΦΑΡΜΟΓΗΣ 2.1 Συστήματα διαχείρισης περιεχομένου (Content Management Systems CMS) Ένα Σύστημα Διαχείρισης Περιεχομένου (CMS) είναι ένα λογισμικό το οποίο έχει τη δυνατότητα να διαχειρίζεται το περιεχόμενο μιας διαδικτυακής εφαρμογής. Η διαχείριση αυτή αφορά τη δημιουργία, την επεξεργασία, την οργάνωση και τέλος την δημοσίευση ενός περιεχομένου. Ταυτόχρονα το σύστημα διαχείρισης περιεχομένου αυτοματοποιεί όλες τις τεχνικές διαδικασίες της ιστοσελίδας προς όλους τους χρήστες του διαδικτυακού τόπου. Αυτό αποτελεί ένα σημαντικό λόγο χρήσης του. Επιπλέον η συνεχής απαίτηση από τους ιδιοκτήτες για συχνή ενημέρωση των ιστοσελίδων αυτών κατέστησε απαραίτητη την ανάγκη για τη δημιουργία των CMS. Έτσι δίνει στους χρήστες του τη δυνατότητα να διαχειρίζονται την ιστοσελίδα τους εύκολα και ευέλικτα δίνοντας ταυτόχρονα και όλα τα απαραίτητα εργαλεία που απαιτούνται για την χρήση της. Τα CMS μπορούν να περιγραφούν και ως εφαρμογές στο διαδίκτυο οι οποίες είναι δυναμικές και η τροποποίησή τους γίνεται online. Η εφαρμογή είναι εγκατεστημένη σε έναν διακομιστή (server). Ο διαχειριστής έχει την δυνατότητα να διαχειρίζεται το περιεχόμενο της ιστοσελίδας με εύκολο και γρήγορο τρόπο και αυτό μπορεί να γίνει από οποιονδήποτε ηλεκτρονικό υπολογιστή που είναι συνδεδεμένος στο διαδίκτυο χωρίς να είναι εγκατεστημένο κάποιο ειδικό πρόγραμμα σε αυτόν. Το μόνο που χρειάζεται είναι ένας φυλλομετρητής (browser) και μπορεί να γίνει η ενημέρωση της ιστοσελίδας με τις απαιτούμενες αλλαγές. Όταν λέμε δυναμική ιστοσελίδα, εννοούμε να μπορεί ο διαχειριστής να προσθέσει, να αφαιρέσει ή να διορθώσει κάποιες εγγραφές στην βάση δεδομένων η οποία είναι συνδεδεμένη και εγκατεστημένη στον διακομιστή μαζί με την εφαρμογή CMS που έχουμε. Λόγω της ευκολίας αλλαγής περιεχομένου της ιστοσελίδας, η αύξηση της χρήσης CMS είναι αρκετά μεγάλη. Οι πιο διαδεδομένες εφαρμογές CMS που υπάρχουν είναι το WORDPRESS, το DRUPAL και το JOOMLA. Παρακάτω θα γίνει μια σύγκριση ανάμεσα στους τρείς κυρίαρχους στον τομέα του CMS. (CMS, 2013) 2.2 Δυνατότητες συστήματος διαχείρισης περιεχομένου (CMS) Μερικές από τις δυνατότητες του συστήματος διαχείρισης περιεχομένου (CMS) είναι: Δυνατότητα δημιουργίας, τροποποίησης και αφαίρεσης κειμένων και εικόνων. Δυνατότητα αλλαγών στην ιστοσελίδα μέσα από τον πίνακα ελέγχου χωρίς να απαιτούνται ειδικές γνώσεις προγραμματισμού. Δυνατότητα ανανέωσης της ιστοσελίδας οποιαδήποτε στιγμή. Δυνατότητα δημιουργίας νέου περιεχομένου από χρήστες (π.χ σχόλια) και έλεγχος του περιεχομένου από τον διαχειριστή. 13

15 Βασισμένο στο δυναμικό του περιεχόμενο δεν απαιτείται η δημιουργία πολλών ξεχωριστών ιστοσελίδων ώστε να δημοσιευθεί το περιεχόμενο που επιθυμεί ο διαχειριστής, αλλά αρκεί μόνο ένας ενιαίος σχεδιασμός εκεί όπου θέλει ο χρήστης να εμφανίζεται το περιεχόμενό του σε συνδυασμό βέβαια με την χρήση κάποιας συγκεκριμένης γλώσσας προγραμματισμού. Δεν απαιτούνται ειδικές τεχνικές γνώσεις για τους διαχειριστές του. 2.3 Συστήματα διαχείρισης περιεχομένου ανοιχτού κώδικα (Open Source CMS) Στην συγκεκριμένη εργασία επιλέχθηκε Διαχειριστής Περιεχομένου Ανοιχτού Κώδικα (Open Source CMS). Γενικότερα πρόκειται για μία κατηγορία CMS, όπου το λογισμικό δημιουργείται και συντηρείται από μία κοινωφελή κοινότητα χρηστών. Έπειτα, αυτό το λογισμικό διανέμεται στα μέλη αυτής της κοινότητας για συγκεκριμένο σκοπό. Να αναφερθεί ότι στο κόστος των λογισμικών ανοικτού κώδικα συμπεριλαμβάνονται τα έξοδα τεχνικής υποστήριξης που χρησιμοποιούνται για την συντήρηση του συστήματος από τους προγραμματιστές όταν χρειαστεί να εξελιχθεί το πρόγραμμα. Παρόλα αυτά, σε σύγκριση με του κλειστού κώδικα λογισμικά, χρησιμοποιούνται περισσότερο στην αγορά. Και οι λόγοι που οδήγησαν στην επιλογή ανοιχτού κώδικα CMS είναι οι εξής: Χαμηλό κόστος. Σαφώς και απαιτείται κάποιο κόστος όπως αναφέρθηκε παραπάνω, όμως σαν λογισμικό διανέμεται δωρεάν στην αγορά σε αντίθεση με τα λογισμικά κλειστού κώδικα. Εύχρηστα και ευέλικτα στην χρήση τους. Είναι γεγονός ότι τα πιο γνωστά CMS ανοικτού κώδικα, όπως είναι τα WordPress, Joomla και Drupal, έχουν χρησιμοποιηθεί παγκοσμίως από τους χρήστες με αποτέλεσμα να μένουν ικανοποιημένοι από τα αποτελέσματα αυτά. Βεβαίως ο κάθε χρήστης αναλόγως με τις απαιτήσεις του προσαρμόζεται και στα πλαίσια του κατάλληλου γι αυτόν CMS. Προσφέρουν πολλές δυνατότητες και επιλογές στον χρήστη σε συνδυασμό φυσικά με την επιλογή του κατάλληλου template. Εμφάνιση. Λόγω της συχνότατης χρήσης των open source CMS, οι σχεδιαστές ιστοσελίδων έχουν δημιουργήσει μεγάλο αριθμό έτοιμων θεμάτων (templates), προσαρμοσμένα πάνω σε αυτές τις εφαρμογές και έτσι ο χρήστης μπορεί με πολύ μικρό κόστος ή ακόμα και δωρεάν να τα εγκαταστήσει. Αυτοί είναι μερικοί λόγοι για τους οποίους έγινε η επιλογή του συστήματος διαχείρισης περιεχομένου και συγκεκριμένα ανοικτού κώδικα. (Open Source, 2013) 2.4 Διαθέσιμα συστήματα διαχείρισης περιεχομένου (CMS) Και οι τρεις εφαρμογές CMS (Drupal, Joomla, WordPress) είναι κυρίαρχοι στον τομέα τους με πολλά κοινά αλλά και αρκετές διαφορές. Για αυτούς που θέλουν να φτιάξουν μια δυναμική ιστοσελίδα χωρίς να έχουν ιδιαίτερες γνώσεις προγραμματισμού, θα επικεντρωθούν σε αυτές τις τρείς επιλογές. 14

16 2.4.1 Drupal Το Drupal ξεκίνησε το 2001 και είναι το πρώτο CMS που δημιουργήθηκε. Έχει πάνω από 15 εκατομμύρια λήψεις και είναι, όπως και τα υπόλοιπα CMS που θα δούμε, δωρεάν. Επίσης έχει πολλά δωρεάν θέματα (Themes) και πολλά δωρεάν πρόσθετα (plugins). Η εγκατάστασή του είναι γρήγορη και εύκολη αλλά οι απαιτήσεις του στο κομμάτι των γνώσεων προγραμματιστικών ικανοτήτων είναι πιο πολλές σε σχέση με τα υπόλοιπα. Είναι ένα πρόγραμμα ανοιχτού κώδικα (open source), το οποίο προτιμούν οι περισσότεροι χρήστες. Η πλατφόρμα του Drupal είναι ιδιαίτερα δυναμική. Μπορεί να χρησιμοποιηθεί σε απλές ιστοσελίδες μέχρι και επαγγελματικούς και εταιρικούς ιστοτόπους. Μπορούμε να διαμορφώσουμε την σελίδα μας, με πολλά διαφορετικά θέματα και πρόσθετα τα οποία υπάρχουν δωρεάν στο Drupal, αλλά μπορεί να τα διαμορφώσει και να τα προσαρμόσει ο καθένας όπως θέλει, χρησιμοποιώντας βέβαια τις προγραμματιστικές του ικανότητες σε PHP και HTML. Σε σχέση με τα άλλα δυο, στο συγκεκριμένο CMS θα χρειαστεί κάποιος να γράψει και κώδικα από την αρχή. Μοιάζει περισσότερο με μια πλατφόρμα ενός προγραμματιστή, παρά με ένα ολοκληρωμένο CMS. Βέβαια, το ότι είναι φιλικό για έναν προγραμματιστή δεν σημαίνει ότι είναι φιλικό και για τον χρήστη. Με λίγα λόγια, χρειάζεται αρκετή δουλειά από τον προγραμματιστή για να το φτάσει στα επιθυμητά αποτελέσματα. Στα μείον του μπορεί να προστεθεί το κομμάτι της λειτουργικότητας. Ο τρόπος επεξεργασίας ενός εγκατεστημένου θέματος δεν είναι και τόσο εύκολος και τα αποτελέσματα πολλές φορές δεν είναι τα επιθυμητά. Στα θετικά του μπορεί να προστεθεί ότι είναι φιλικό προς τον προγραμματιστή και υπάρχει ισχυρή κοινότητα για να βοηθήσει. (Drupal, 2013) Joomla Το Joomla Δημιουργήθηκε το 2005 και έχει πάνω από 30 εκατομμύρια λήψεις και αποτελείται από θέματα (templates), πρόσθετα (plugins) και ενθέματα (modules). Είναι και αυτό εύκολο στην εγκατάσταση του και δεν απαιτεί το ίδιο επίπεδο γνώσεων και εμπειρίας όσο το Drupal λόγω του ότι πολλές λειτουργίες υπάρχουν προεγκατεστημένες ή μπορούν να πραγματοποιηθούν απλά με την εγκατάσταση ενός από τα χιλιάδες πρόσθετα και ενθέματα που υπάρχουν με τα οποία κάποιος μπορεί να κατασκευάσει την ιστοσελίδα του χωρίς να χρειαστεί να γράψει ούτε μια γραμμή κώδικα. Φυσικά όμως υπάρχει η δυνατότητα να αναπτύξει κάποιος μια εφαρμογή και να την προσαρμόσει όπως αυτός θέλει. Υστερεί σε σχέση με το WordPress όσον αφορά τις έτοιμες λειτουργίες που προσφέρονται οι οποίες όμως είναι σαφώς περισσότερες από το Drupal. Το Joomla είναι ευρέως διαδεδομένο και για πολλά χρόνια αποτέλεσε τον κυρίαρχο στα συστήματα διαχείρισης περιεχομένου με αποτέλεσμα να υπάρχει μέχρι και σήμερα μια πολύ μεγάλη κοινότητα υποστήριξης όπου κάποιος που υστερεί σε γνώσεις να βοηθηθεί. (Joomla!, 2013) 15

17 2.4.3 WordPress To WordPress ξεκίνησε το 2003 ως μία πλατφόρμα ιστολογίων (blog) και εν καιρώ εξελίχθηκε στο πιο διαδεδομένο σύστημα CMS με πάνω από 150 εκατομμύρια λήψεις. Περισσότερο από το 40% των ιστοσελίδων που χρησιμοποιούν CMS έχουν το WordPress εγκατεστημένο. Είναι πλέον το πιο φιλικό προς τον χρήστη με πολύ περισσότερα θέματα (templates) και πρόσθετα (plugins) σε σχέση με τα υπόλοιπα. Είναι και αυτό εύκολο στην εγκατάσταση και οι γνώσεις απαιτήσεις που χρειάζονται για τη δημιουργία μίας βασικής ιστοσελίδας είναι πολύ λιγότερες από τα υπόλοιπα. Πολλές εταιρίες φιλοξενίας ιστοσελίδων προσφέρουν αυτόματη εγκατάσταση του WordPress, το οποίο σημαίνει ότι κάποιος μπορεί πολύ γρήγορα να εγκαταστήσει την εφαρμογή. Το WordPress έχει εκπληκτικά πολλά πρόσθετα και μια πάρα πολύ μεγάλη κοινότητα υποστήριξης. Αυτό σημαίνει ότι οι επιλογές που έχει ο καθένας για να δημιουργήσει την δική του ιστοσελίδα είναι πάρα πολλές. Χρησιμοποιώντας τις δυνατότητες του WordPress μπορεί κάποιος πολύ εύκολα να γράψει τα δικά του πρόσθετα και να δημιουργήσει το δικό του θέμα (template) ή να κάνει τις απαραίτητες αλλαγές σε κάποιο από τα υπάρχοντα που στην συντριπτική τους πλειοψηφία παρέχονται με την άδεια χρήσης ανοιχτού κώδικα, GPL. Μεγάλο πλεονέκτημα του WordPress σε σχέση με τα άλλα δύο CMS που αναφέρθηκαν, είναι η εύκολη εγκατάσταση ενημερώσεων χωρίς να χρειάζεται η επανεγκατάσταση της εφαρμογής, καθώς οι νέες εκδόσεις είναι συμβατές με τις προηγούμενες. Έτσι η ιστοσελίδα μπορεί να μένει πάντα ενημερωμένη με τις τελευταίες εκδόσεις που κυκλοφορούν χωρίς να απαιτείται πολυέξοδη τεχνική υποστήριξη. (WordPress, 2013) Δημιουργία δικής μας εφαρμογής CMS Στις επιλογές μας για το πως θα αναπτυχθεί το Διαδραστικό Βιβλίο υπήρχε και η ανάπτυξη μιας δικής μας εφαρμογής διαχείρισης περιεχομένου ιστοσελίδας από την αρχή. Σαφώς και η συγκεκριμένη επιλογή θα ήταν η καλύτερη, αλλά υπήρχαν κάποια προβλήματα που έπρεπε να αντιμετωπιστούν. Το κυριότερο πρόβλημα ήταν η ασφάλεια. Η ελάχιστη εμπειρία σε αυτό το κομμάτι και η ασφάλεια που προσφέρουν οι υπάρχουσες εφαρμογές CMS, οδηγούν στην επικέντρωση και χρησιμοποίηση αυτών ώστε να γίνει η υλοποίηση της εφαρμογής μας. Αν και χρησιμοποιήθηκαν αρκετά πρόσθετα (plugins) τα οποία ήταν έτοιμα, αναπτύχθηκαν και παραμετροποιήθηκαν πολλά από αυτά έτσι ώστε να ταιριάξουν στην εφαρμογή. Τα πρόσθετα που χρησιμοποιήθηκαν αναλύονται στο κεφάλαιο της υλοποίησης. 16

18 2.5 Διαθέσιμες γλώσσες προγραμματισμού PHP Η PHP είναι μια γλώσσα προγραμματισμού που σχεδιάστηκε για τη δημιουργία δυναμικών σελίδων στο διαδίκτυο και είναι επισήμως γνωστή ως: HyperText preprocessor. Η PHP εκτελείται στον διακομιστή (server side) και είναι συνήθως πλαισιωμένη από HTML, για μορφοποίηση των αποτελεσμάτων. Αντίθετα από μια συνηθισμένη HTML σελίδα η σελίδα PHP δεν στέλνεται άμεσα σε έναν πελάτη (client), αλλά πρώτα αναλύεται και μετά αποστέλλεται το παραγόμενο αποτέλεσμα. Τα στοιχεία HTML στον πηγαίο κώδικα μένουν ως έχουν, αλλά ο PHP κώδικας ερμηνεύεται και εκτελείται. Ο κώδικας PHP μπορεί να θέσει ερωτήματα σε βάσεις δεδομένων, να δημιουργήσει εικόνες, να διαβάσει και να γράψει αρχεία, να συνδεθεί με απομακρυσμένους υπολογιστές κ.ο.κ. Σε γενικές γραμμές οι δυνατότητες που μας δίνει είναι απεριόριστες. Αρχικά η ονομασία της ήταν PHP/FI από το Forms Interpreter η οποία δημιουργήθηκε το 1995 από τον Rasmus Lerdorf ως μια συλλογή από Perl scripts που τα χρησιμοποιούσε στην προσωπική του σελίδα. Δεν άργησε να τα εμπλουτίσει με λειτουργίες επεξεργασίας δεδομένων με SQL, αλλά τα σημαντικά βήματα που έφεραν και την μεγάλη αποδοχή της PHP ήταν αρχικά η μετατροπή τους σε C και μετέπειτα η δωρεάν παροχή του πηγαίου κώδικα μέσω της σελίδας του ώστε να επωφεληθούν όλοι από αυτό που είχε φτιάξει, αλλά και να τον βοηθήσουν στην περαιτέρω ανάπτυξή της. (PHP, 2013) HTML Τα αρχικά HTML προέρχονται από το ακρώνυμο Hyper Text Markup Language που σημαίνει γλώσσα χαρακτηρισμού υπερκειμένου. Η χρήση μιας γλώσσας χαρακτηρισμού σημαίνει ότι γράφεται πρώτα το κείμενο και έπειτα προσθέτονται ειδικά σύμβολα γύρω από τις λέξεις ή από ολόκληρες προτάσεις ώστε να καθοριστεί η εμφάνιση τους στην οθόνη. Τα ειδικά σύμβολα στην HTML λέγονται ετικέτες (tags). Η HTML διαθέτει ένα πεπερασμένο αριθμό ετικετών που μπορούμε να χρησιμοποιήσουμε. Ωστόσο ο αριθμός αυτός δεν παραμένει σταθερός. Κατά διαστήματα το W3 Consortium, το οποίο ανέπτυξε και διαχειρίζεται τα πρότυπα της HTML, δημοσιεύει νέα πρότυπα στα οποία προσθέτει καινούργιες ετικέτες που καλύπτουν ή διορθώνουν μια λειτουργία στο προηγούμενο πρότυπο. Η τελευταία αναθεώρηση του HTML προτύπου είναι η HTML5. Οι ετικέτες ελέγχουν την δομή και την μορφή του κειμένου της ιστοσελίδας. Επίσης παρέχουν πληροφορίες προς τον web browser για την σελίδα που πρόκειται να εμφανίσουν, όπως ο τίτλος της σελίδας ή ο συγγραφέας της, κ.α. 17

19 Οι HTML ετικέτες γράφονται ανάμεσα στα σύμβολα < και > πχ. <όνομα-ετικέτας> Οι περισσότερες HTML ετικέτες αποτελούνται από μια ετικέτα αρχής και μια ετικέτα τέλους και ανάμεσα σε αυτές υπάρχει το κείμενο που χαρακτηρίζεται από τις ετικέτες αυτές. Η ετικέτα τέλους περιέχει τον χαρακτήρα /πριν το όνομα της ετικέτας. Το αρχείο που περιέχει HTML ετικέτες λέγεται HTML αρχείο και έχει επέκταση.html ή.htm (εκτός βέβαια κι' αν η ιστοσελίδα είναι δυναμική οπότε έχει επεκτάσεις όπως.php. asp, jsp κτλ.). Τα αρχεία αυτά είναι απλά αρχεία κειμένου σε μορφή ASCII και δεν περιέχουν πληροφορίες για το περιβάλλον ή τα προγράμματα με τα οποία θα λειτουργήσουν. (HTML, 2013) CSS Η CSS (Cascading Style Sheets - Διαδοχικά Φύλλα Στυλ) ή ( αλληλουχία φύλλων στυλ ) είναι μια γλώσσα υπολογιστή που ανήκει στην κατηγορία των γλωσσών φύλλων στυλ που χρησιμοποιείται για τον έλεγχο της εμφάνισης ενός εγγράφου που έχει γραφτεί με μια γλώσσα σήμανσης. Χρησιμοποιείται δηλαδή για τον έλεγχο της εμφάνισης ενός εγγράφου που γράφτηκε στις γλώσσες HTML και XHTML, δηλαδή για τον έλεγχο της εμφάνισης μιας ιστοσελίδας και γενικότερα ενός ιστοτόπου. Η CSS είναι μια γλώσσα υπολογιστή προορισμένη να αναπτύσσει στιλιστικά μια ιστοσελίδα δηλαδή να διαμορφώνει περισσότερα χαρακτηριστικά, χρώματα, στοίχιση και δίνει περισσότερες δυνατότητες σε σχέση με την HTML. Για μια όμορφη και καλοσχεδιασμένη ιστοσελίδα η χρήση της CSS κρίνεται ως απαραίτητη. (CSS, 2013) Ποια πλεονεκτήματα έχει η χρήση CSS έναντι της μορφοποίησης μέσω HTML a ttributes; Πολύ μεγαλύτερη ευελιξία. Το CSS κατέστησε εφικτές μορφοποιήσεις οι οποίες ήταν αδύνατες ή πολύ δύσκολες με την κλασσική HTML. Ευκολότερη συντήρηση των ιστοσελίδων. Η εμφάνιση ενός ολόκληρου site μπορεί να ελέγχεται από ένα μόνο εξωτερικό αρχείο CSS. Έτσι, κάθε αλλαγή στο στυλ της ιστοσελίδας μπορεί να γίνεται με μια μοναδική αλλαγή σε αυτό το αρχείο, αντί για την επεξεργασία πολλών σημείων σε κάθε σελίδα που υπάρχει στο site. Μικρότερο μέγεθος αρχείου, δεδομένου ότι ο κάθε κανόνας μορφοποίησης γράφεται μόνο μια φορά και όχι σε κάθε σημείο που εφαρμόζεται. Καλύτερο SEO (Search engine optimization). Οι μηχανές αναζήτησης δεν «μπερδεύονται» ανάμεσα σε περιεχόμενο και τη μορφοποίηση του, αλλά έχουν πρόσβαση στο περιεχόμενο σκέτο, οπότε είναι πολύ ευκολότερο να το καταγράψουν και να το αρχειοθετήσουν (indexing). 18

20 Γρηγορότερες σελίδες Javascript Η JavaScript (JS) είναι μία διερμηνευμένη γλώσσα προγραμματισμού για ηλεκτρονικούς υπολογιστές. Αρχικά αποτέλεσε μέρος της υλοποίησης των φυλλομετρητών Ιστού, ώστε τα σενάρια από την πλευρά του πελάτη (client-side scripts) να μπορούν να επικοινωνούν με τον χρήστη, να ανταλλάσσουν δεδομένα ασύγχρονα και να αλλάζουν δυναμικά το περιεχόμενο του εγγράφου που εμφανίζεται. Η JavaScript είναι μια γλώσσα σεναρίων που βασίζεται στα πρωτότυπα (prototypebased), είναι δυναμική, με ασθενείς τύπους και έχει συναρτήσεις ως αντικείμενα πρώτης τάξης Η σύνταξή της είναι επηρεασμένη από τη C. Η JavaScript αντιγράφει πολλά ονόματα και συμβάσεις ονοματοδοσίας από την Java, αλλά γενικά οι δύο αυτές γλώσσες δε σχετίζονται και έχουν πολύ διαφορετική σημασιολογία. Οι βασικές αρχές σχεδιασμού της JavaScript προέρχονται από τις γλώσσες προγραμματισμού Self και Scheme. Είναι γλώσσα βασισμένη σε διαφορετικά προγραμματιστικά παραδείγματα (multi-paradigm), υποστηρίζοντας αντικειμενοστραφές, προστακτικό και συναρτησιακό στιλ προγραμματισμού Η JavaScript χρησιμοποιείται και σε εφαρμογές εκτός ιστοσελίδων τέτοια παραδείγματα είναι τα έγγραφα PDF, οι εξειδικευμένοι φυλλομετρητές (site-specific browsers) και οι μικρές εφαρμογές της επιφάνειας εργασίας (desktop widgets). Οι νεότερες εικονικές μηχανές και πλαίσια ανάπτυξης για JavaScript (όπως το Node.js) έχουν επίσης κάνει τη JavaScript πιο δημοφιλή για την ανάπτυξη εφαρμογών Ιστού στην πλευρά του διακομιστή (server-side). (Javascript, 2013) Asp.net Η asp.net είναι μία server-side γλώσσα προγραμματισμού, σχεδιασμένη για τη δημιουργία δυναμικών ιστοσελίδων. Αναπτύχθηκε από την Microsoft για να επιτρέπει στους προγραμματιστές να αναπτύξουν διαδικτυακές εφαρμογές και υπηρεσίες. Η πρώτη έκδοσή ήταν το (Asp.Net, 2013) Σύγκριση Asp.net και PHP Η PHP είναι σχετικά πιο εύκολη γλώσσα στη χρήση της από ότι η ASP.NET. Αρχικά η PHP γράφτηκε στην γλώσσα προγραμματισμού C για να αντικαταστήσει κάποια σενάρια εντολών της Perl. Για το λόγο αυτό η PHP εξακολουθεί να έχει απλό συντακτικό μέχρι σήμερα. Πολλοί προγραμματιστές είναι πιο άνετοι με την φιλική προς το χρήστη φύση της PHP κατά την ώρα του προγραμματισμού. Ωστόσο πολλές κριτικές θεωρούν αυτό το πλεονέκτημα της PHP ως μειονέκτημα. Άλλοι πάλι λένε πως η PHP δεν έχει αναβαθμιστεί και πολύ και πως εξακολουθεί να είναι αρχαία. 19

21 Από την άλλη η ASP.NET που είναι μια νέα γλώσσα, διαθέτει πολλά χαρακτηριστικά. Με την ASP.NET μπορείτε να χρησιμοποιήσετε την C#, J#, C++ και VB.NET. Ως εκ τούτου ο προγραμματιστής μπορεί να επιλέξει την γλώσσα προγραμματισμού με την οποία νοιώθει ποιο άνετα για να αρχίσει να προγραμματίζει. Υπό αυτή την έννοια η ASP.NET μπορεί να προσφέρει περισσότερα. Όμως η PHP δεν κάνει λιγότερα, αφού μπορεί να υλοποιήσει τις ίδιες εργασίες εξίσου καλά, ακόμα και με τα ελάχιστα προγραμματιστικά εργαλεία. Η PHP έχει καλύτερη υποστήριξη για το σύστημα διαχείρισης βάσεων δεδομένων της MySQL. Στην πραγματικότητα, το δημοφιλέστερο λογισμικό ιστολογιών, το WordPress, χρησιμοποιεί τον τρομερό συνδυασμό της PHP και της MySQL για τη διαχείριση του περιεχομένου του, το οποίο διαχειρίζεται καθημερινά εκατοντάδες χιλιάδες ιστολογιών καθημερινά. Ακόμα μια πολύ γνωστή υπηρεσία τεραστίων διαστάσεων που χρησιμοποιεί τον συνδυασμό της PHP και της MySQL είναι το WikiPedia. Η ASP.NET μπορεί επίσης να χρησιμοποιήσει την MySQL, αλλά η PHP είναι αυτή που κάνει τη διαφορά. Όσοι χρησιμοποιούν και PHP και ASP.NET επίσης υποστηρίζουν πως η PHP είναι καλύτερη από την ASP.NET σε ότι αφορά την υποστήριξη άλλων συστημάτων διαχείρισης βάσεων δεδομένων όπως είναι η SQLite. Η SQLite είναι χαρακτηρισμένη ως σύστημα διαχείρισης σχεσιακών βάσεων δεδομένων, και από όταν είναι διαθέσιμη στις βιβλιοθήκες της γλώσσας προγραμματισμού C, η PHP είναι σε θέση να την υποστηρίξει καλύτερα. Ένα άλλο χαρακτηριστικό της PHP είναι η καλύτερη υποστήριξη αντικειμενοστραφούς προγραμματισμού. Επίσης η ίδια η PHP στης μέρες είναι ολοκληρωτικά γραμμένη με αντικειμενοστραφή προγραμματισμό. Ωστόσο θα πρέπει να σημειώσουμε πως και η ASP.NET παρέχει πολύ ικανοποιητική υποστήριξη του αντικειμενοστραφούς προγραμματισμού. Όταν συζητάμε για υποστήριξη, η PHP κερδίζει και πάλι την ASP.NET. Ο βασικός λόγος για αυτό το λόγο είναι πως η PHP είναι λογισμικό ανοικτού κώδικα. Ως εκ τούτου η υποστηρίξει διανέμεται δωρεάν από όλο τον κόσμο. Στις περισσότερες περιπτώσεις, οι επιδιορθώσεις της PHP και των bug της επιδιορθώνονται άμεσα. Από την άλλη πλευρά η ASP.NET μπορεί να χρειαστεί πολύ χρόνο για να δημοσιεύσει μια αναβάθμιση για να βελτιώσει προηγούμενα bugs. Αυτό συμβαίνει γιατί η ASP.NET ανήκει στην Microsoft, και για την επίλυση του προβλήματος θα πρέπει η ομάδα προγραμματιστών να ανταποκριθεί στο πρόβλημα. Αυτό κάνει την όλη διαδικασία επίλυσης του προβλήματος ποιο αργή σε σχέση με το λογισμικό ανοικτού κώδικα που η επίλυση του προβλήματος είναι άμεση. 20

22 Ένα άλλο χαρακτηριστικό της PHP είναι πως μπορεί να χρησιμοποιήσει την γραμμή εντολών για να πραγματοποιήσει πολλές καθημερινές ενέργειες. Για παράδειγμα η PHP μπορεί να φανεί χρήσιμη χρησιμοποιώντας την γραμμή εντολών για να διαχειριστεί πολλά αρχεία και να τα τακτοποιήσει μέσα σε διάφορους υπόκαταλόγους μόνο με μία εντολή. Επίσης ένα ακόμα πολύ σημαντικό χαρακτηριστικό της PHP είναι πως διανέμεται ως λογισμικό ανοικτού κώδικα, το οποίο πολύ απλά σημαίνει πως είναι δωρεάν για όλους. Οι προγραμματιστές που γράφουν PHP κώδικα, μπορούν να αναπτύξουν εφαρμογές γραμμένες με μηδέν κόστος. Από την άλλη η ASP.NET δεν είναι δωρεάν, αλλά μπορείτε να βρείτε τις επεκτάσεις της δωρεάν. Επίσης η ASP.NET είναι γραμμένη μόνο για να λειτουργεί σε Windows, με αποτέλεσμα να έχει πολύ περιορισμένο κοινό. Η ASP.NET μεταφράζεται σε δυαδικό κώδικα στη μνήμη. Έτσι, όταν χρησιμοποιείτε την ASP.NET για να γράψετε μια εφαρμογή, είναι προφανές πως θα χρειαστεί πολύ περισσότερο χρόνο να επεξεργαστεί καθώς ο κώδικας θα πρέπει να ανακτηθεί από τη μνήμη. Από την άλλη η PHP δεν μεταφράζεται μέσα στη μνήμη όπως συμβαίνει με την ASP.NET. Η PHP απλά μεταγλωττίζεται κατά τον χρόνο εκτέλεσης. Αυτός είναι και ο λόγος που η PHP είναι ποιο αποδοτική σε σχέση με την ASP.NET. Σε αυτό το σημείο θα πρέπει να σημειώσουμε πως τόσο η PHP όσο και η ASP.NET μπορούν να εκτελεστούν σε πολύ καλούς χρόνους με σωστά και καλά αποτελέσματα όταν οι εφαρμογές έχουν γραφτεί σωστά. Σε ότι αφορά της χρεώσεις φιλοξενίας, τόσο η PHP όσο και η ASP.NET είναι οικονομικές. Ακόμα, επειδή η PHP είναι παλαιότερη, είναι και ποιο ασφαλείς από την ASP.NET σε ότι αφορά την κωδικοποίηση. Η ASP.NET είναι πολύ νέα, και οι επιλογές ασφαλείας μπορεί να μην έχουν ολοκληρωθεί ακόμα στο ακέραιο. Ωστόσο σε αυτό το σημείο πολύ προγραμματιστές θα δυσανασχετήσουν, καθώς πιστεύουν πως τα κενά ασφαλείας προκύπτουν από τον τρόπο που ο προγραμματιστής γράφει τον κώδικα. Ακόμα και έτσι όμως, στο διαδίκτυο μπορείτε να εντοπίσετε πάρα πολλά άρθρα που περιγράφουν πως οι εφαρμογές που είναι γραμμένες σε PHP είναι ποιο δύσκολο να δεχτούν την επίθεση κάποιου Hacker σε σχέση με αυτά που είναι γραμμένα σε ASP.NET. 21

23 22

24 3. ΣΧΕΔΙΑΣΜΟΣ ΚΑΙ ΕΡΓΑΛΕΙΑ ΠΟΥ ΧΡΗΣΙΜΟΠΟΙΗΘΗΚΑΝ ΣΤΗΝ ΕΦΑΡΜΟΓΗ 3.1 Σχεδίαση και ανάλυση απαιτήσεων Ο σχεδιασμός της ιστοσελίδας δημιουργήθηκε με βάση το θέμα που επιλέχθηκε, το οποίο είναι κατάλληλο για τον τύπο και τις απαιτήσεις του ιστοτόπου. Έτσι η εξωτερική δομή της συγκεκριμένης ιστοσελίδας αποτελείται βασικά από τρία κύρια μέρη. Αρχικά από την κεφαλίδα (header), το οποίο περιέχει το λογότυπο (enteraction) και το κυρίως μενού (αρχική σελίδα, βιβλία, επικοινωνία, για εμάς, μενού γλώσσας και αναζήτηση). Στη συνέχεια έχουμε το περιεχόμενο (content), που αποτελείται από το κυρίως περιεχόμενο και την πλευρική μπάρα (sidebar). Και τέλος, στο κάτω μέρος της σελίδας, το υποσέλιδο (footer), το οποίο αποτελείται από ένα πλαίσιο που περιέχει αναφορικά τα κεφάλαια των βιβλίων, την επικοινωνία και στο τέλος την άδεια χρήσης της ιστοσελίδας. 3.2 Απαιτήσεις Απαίτηση είναι το χαρακτηριστικό ενός συστήματος ή κάποιος περιορισμός αυτού, όπου το σύστημα λειτουργεί με τέτοιο τρόπο ώστε να ικανοποιεί τον σκοπό του. Είναι ιδιαίτερα σημαντικό, οι απαιτήσεις του συστήματος να ανήκουν αυστηρά στο πλαίσιο πλήρους κατανόησης, αποσαφήνισης και διαχείρισης, διότι όπως είναι αναμενόμενο, η οποιαδήποτε παρερμηνεία, ασάφεια και διαστρέβλωση των απαιτήσεων μπορεί να οδηγήσει σε προβλήματα που στη συνέχεια θα δημιουργήσουν και άλλα, με αποτέλεσμα να καταλήγει σε φαύλο κύκλο προβλημάτων οπότε σε λάθος project και αναπόφευκτα το κόστος θα είναι μεγάλο (Δρ. Θ. Παχίδης, 2012). Ως εκ τούτου, στην παρούσα εργασία οι προσφερόμενες λειτουργίες του συστήματος προς τον χρήστη της ιστοσελίδας, είναι οι εξής: - Λειτουργικά χαρακτηριστικά επισκέπτη: 1. Επιλογή βιβλίου από το μενού της ιστοσελίδας. 2. Επιλογή κάθε κεφαλαίου και υποκεφαλαίου από το μενού της ιστοσελίδας. 3. Επιλογή όλων των κεφαλαίων/υποκεφαλαίων και των δύο βιβλίων από το πλαϊνό μενού. 4. Δυνατότητα γρήγορης επιλογής (search) κεφαλαίων από το πλαίσιο αναζήτησης στο main menu και στο πλαϊνό μενού σε οποιοδήποτε κεφάλαιο και αν βρίσκεται ο χρήστης. 5. Δυνατότητα επιλογής κεφαλαίων στο footer της ιστοσελίδας. 6. Επιλογή γρήγορου πλήκτρου scroll top στο footer που παραπέμπει τον χρήστη κατευθείαν στο πάνω μέρος της σελίδας. 23

25 7. Επιλογή δίγλωσσου μενού (αλλαγή από ελληνικά σε αγγλικά και το αντίστροφο). 8. Δυνατότητα υποβολής σχολίου σε κάθε κεφάλαιο-υποκεφάλαιο, δίνοντας οποιοδήποτε σχόλιο αφορά το συγκεκριμένο κεφάλαιο. Καθώς και στο καθένα βιβλίο χωριστά εάν θέλει να γράψει το σχόλιό του γενικά για το βιβλίο. 9. Δυνατότητα επισύναψης και αποστολής αρχείου (jpg,pdf,doc,docx ) έως και 12MB εάν θέλει να συμπληρώσει οτιδήποτε αφορά το συγκεκριμένο κεφάλαιο όπου βρίσκεται ο χρήστης ή ολόκληρο το βιβλίο. Ταυτόχρονα μπορεί να προσθέσει και το σχόλιό του. 10. Δυνατότητα απάντησης του χρήστη σε προηγούμενο σχόλιο ενός άλλου χρήστη. 11. Εμφάνιση ιστορικού των σχολίων που υποβλήθηκαν (εμφάνιση ώρας και ημερομηνίας). 12. Δυνατότητα μοιράσματος οποιουδήποτε κεφαλαίου, υποκεφαλαίου ή και ολόκληρου του βιβλίου στα κοινωνικά δίκτυα Facebook, Twitter, google Εμφάνιση γενικών σχολίων που υποβλήθηκαν με την ένδειξη αριθμού πάνω από το πεδίο των σχολίων. 14. Εμφάνιση ονόματος (username) στην υποβολή σχολίων. 15. Δυνατότητα επιλογής (στο κεντρικό μενού) πάνω σε κάθε βιβλίο και εμφάνιση όλων των κεφαλαίων του κάθε βιβλίου χωρισμένα σε link ώστε πατώντας σε καθένα από αυτά να παραπέμπει τον χρήστη κατευθείαν στο κεφάλαιο που επιθυμεί. 16. Δυνατότητα προσθήκης κειμένου ή αρχείου στα ήδη υπάρχοντα βιβλία. 17. Δυνατότητα λήψης σε περίπτωση συνημμένου αρχείου στο πεδίο των σχολίων από οποιονδήποτε χρήστη. 18. Να υπάρχει δυνατότητα επικοινωνίας με τους διαχειριστές της ιστοσελίδας. 19. Να υπάρχει στο κεντρικό μενού η δυνατότητα να επιστρέψει ο χρήστης στην αρχική σελίδα. Οι λειτουργίες που χρησιμοποιούνται δυναμικά από τον διαχειριστή είναι οι εξής: - Λειτουργικά χαρακτηριστικά διαχειριστή 1. Είσοδο με όνομα χρήστη και κωδικό πρόσβασης. 2. Διαχείριση βιβλίων (προσθήκη/επεξεργασία/διαγραφή). 3. Διαχείριση φωτογραφιών (προσθήκη/επεξεργασία/διαγραφή). 4. Διαχείριση κατηγοριών (προσθήκη/επεξεργασία/διαγραφή) μέσω άρθρων και σελίδων ώστε να εμφανίζεται στο κεντρικό μενού. 5. Δημιουργία Author και Editor. Δύο Author υπεύθυνοι για τα κεφάλαια του ενός βιβλίου και ένας υπεύθυνος Editor για ολόκληρο το βιβλίο. 6. Διαχείριση των υποβαλλόμενων σχολίων των χρηστών, μέσω του συστήματος διαχείρισης, με δυνατότητα τριών επιλογών κατάστασης από τον υπεύθυνο. Αποέγκριση, απάντηση/έγκριση, επεξεργασία/ταχυεπεξεργασία) 24

26 7. Διαχείριση των υποβαλλόμενων σχολίων των χρηστών με τη δυνατότητα ειδοποίησης (μέσω ) στον Author / Editor που είναι υπεύθυνος στο ανάλογο κεφάλαιο/υποκεφάλαιο ή βιβλίο όπου έγινε το σχόλιο. 8. Δυνατότητα εμφάνισης του υπεύθυνου για το υποβαλλόμενο σχόλιο στο σύστημα διαχείρισης. 9. Σε περίπτωση υποβολής σχολίου από τον χρήστη και όταν το σχόλιο αφορά μόνο συγκεκριμένο κεφάλαιο/υποκεφάλαιο για το οποίο είναι υπεύθυνος ο Author, τότε η ενημέρωση μέσω , εκτός από τον υπεύθυνο Author πηγαίνει και στον Editor του βιβλίου. 10. Αποσύνδεση από το σύστημα διαχείρισης. Απαραίτητος για την εγκατάσταση της ιστοσελίδας είναι η ύπαρξη ενός διακομιστή, με την υποστήριξη PHP και MySQL. 3.3 Προδιαγραφές Εφόσον οι απαιτήσεις αποτελούν το πρόβλημα σε ένα project κατά συνέπεια απαραίτητη είναι και η ύπαρξη λύσης του προβλήματος, η οποία ανήκει στο πλαίσιο των λεγομένων προδιαγραφών. Συμπερασματικά όπου υπάρχουν απαιτήσεις, υφίστανται επακόλουθα και οι προδιαγραφές, οι οποίες ανήκουν και αυτές στην σχεδίαση του project ώστε να καταλήξει στην σωστή ανάπτυξη και επίτευξή του. Οι προδιαγραφές χωρίζονται και αυτές, αντίστοιχα με τις απαιτήσεις, σε προδιαγραφές διεργασιών χρήστη και σε προδιαγραφές διεργασιών διαχειριστή. - Προδιαγραφές Διεργασιών Επισκέπτη 1. Στο κεντρικό μενού (navigator menu)της ιστοσελίδας, θα υπάρχει η δυνατότητα ο χρήστης να μπορεί να επιλέξει ένα από τα δύο βιβλία (ΑΕΠΠ και Ασύρματα Δίκτυα) καθώς και τις επιλογές ΑΡΧΙΚΗ η οποία τον παραπέμπει στην αρχική σελίδα, την επιλογή ΕΠΙΚΟΙΝΩΝΙΑ η οποία τον παραπέμπει σε μια φόρμα συμπλήρωσης στοιχείων καθώς και την δυνατότητα να στείλει μήνυμα στους διαχειριστές της ιστοσελίδας, την επιλογή ΓΙΑ ΕΜΑΣ και την επιλογή EN η οποία μετατρέπει το μενού από τα ελληνικά στα αγγλικά και αντίστροφα (με την επιλογή EL). 2. Όταν ο κέρσορας του ποντικιού βρεθεί πάνω από το κεντρικό μενού και βρίσκεται στην επιλογή ΑΕΠΠ ή Ασύρματα Δίκτυα, θα κατεβαίνουν όλα τα κεφάλαια του κάθε βιβλίου αντίστοιχα και όταν ο κέρσορας βρεθεί πάνω από κάποιο κεφάλαιο, θα δίνεται η δυνατότητα επιλογής των υποκεφαλαίων του κάθε βιβλίου. Αυτό θα γίνεται για να μπορεί να επιλέξει ο χρήστης σε ποιό κεφάλαιο ή υποκεφάλαιο θέλει να περιηγηθεί. 25

27 3. Εφόσον ο χρήστης έχει επιλέξει και περιηγείται σε κάποιο κεφάλαιο ή υποκεφάλαιο κάποιου βιβλίου, θα εμφανίζονται στο πλαϊνό μενού όλα τα κεφάλαια (όχι τα υποκεφάλαια) και των δύο βιβλίων, για να μπορεί ο χρήστης να παραπεμφθεί κατευθείαν σε κάποιο άλλο κεφάλαιο. 4. Δίπλα από το κεντρικό μενού και από την επιλογή ΕΝ, θα βρίσκεται η επιλογή για SEARCH για να μπορεί, ο χρήστης, σε οποιαδήποτε στιγμή να ψάξει και να παραπεμφθεί στο σημείο που αυτός επιθυμεί χρησιμοποιώντας αυτή την επιλογή. 5. Στο κομμάτι του footer, δηλαδή στο κάτω μέρος της σελίδας θα βρίσκονται όλα τα κεφάλαια και των δύο βιβλίων. 6. Εφόσον ο χρήστης έχει κατέβει μετά από κάποια συγκεκριμένα pixels, θα εμφανίζεται ένα κουμπί(button), το οποίο πατώντας το, θα μεταφέρει τον χρήστη στο πάνω μέρος της εκάστοτε σελίδας. 7. Κάτω από κάθε σελίδα του κάθε βιβλίου αλλά και κάτω από κάθε υποκεφάλαιο, θα δίνεται η δυνατότητα στον χρήστη να γράψει κάποιο σχόλιο, να απαντήσει σε ένα άλλο σχόλιο. Ταυτόχρονα, θα εμφανίζεται η ημερομηνία και η ώρα του κάθε σχολίου καθώς και όλα τα προηγούμενα σχόλια. Επίσης θα εμφανίζονται τα σχόλια αριθμημένα. Θα υπάρχει και μετρητής σχολίων κάτω από το κείμενο. 8. Ο χρήστης εκτός από το να μπορεί να σχολιάσει κάποιο κεφάλαιο ή υποκεφάλαιο, θα μπορεί να προσθέσει και κείμενο το οποίο θα είναι σχετικό με το εκάστοτε κεφάλαιο. Το συγκεκριμένο κείμενο θα δίνεται στους διαχειριστές σαν σχόλιο. Εφόσον εγκριθεί από τους διαχειριστές, θα προστίθεται μέσα στο κεφάλαιο. 9. Ο χρήστης θα έχει την δυνατότητα να επισυνάψει κάποιο αρχείο, εφόσον δεν επιθυμεί να προσθέσει κείμενο. Ο κάθε χρήστης θα μπορεί επίσης να κατεβάσει το συνημμένο αυτό αρχείο. Θα υπάρχει ένα κουμπί «ΕΠΙΣΥΝΑΨΗ ΑΡΧΕΙΟΥ» με το οποίο θα παραπέμπεται στα αρχεία του, έτσι ώστε να μπορεί να επιλέξει πιο εύκολα το αρχείο που θέλει να ανεβάσει. 10. Όταν ο χρήστης βρίσκεται σε κάποιο κεφάλαιο, κάτω από την επικεφαλίδα, θα υπάρχουν κουμπιά (buttons), με τα οποία θα μπορεί ο χρήστης να μοιράζεται το κάθε κεφάλαιο σε μέσα κοινωνικής δικτύωσης. Θα υπάρχουν τα κουμπιά του Facebook,Twitter και Google+. - Προδιαγραφές Διεργασιών Διαχειριστή 1. Ο κάθε διαχειριστής θα έχει όνομα και κωδικό (username και password), το οποίο θα είναι μοναδικό. Με τα συγκεκριμένα θα συνδέεται στον πίνακα ελέγχου. 2. Θα έχει την δυνατότητα να προσθέτει, να διαγράφει, να διαχειρίζεται κείμενα, εικόνες. 3. Δημιουργία Editor και Author.Ο Editor θα είναι υπεύθυνος για όλο το βιβλίο και δύο authors θα είναι υπεύθυνοι για τα κεφάλαια του ενός βιβλίου. Αυτό σημαίνει πως κάθε φορά που υποβάλλεται σχόλιο από τον επισκέπτη σε κάποιο από τα κεφάλαια, η ενημέρωση μέσω θα πηγαίνει στον υπεύθυνο Author που είναι για το συγκεκριμένο κεφάλαιο, καθώς και στον Editor που είναι υπεύθυνος για το συγκεκριμένο βιβλίο. Όταν όμως το σχόλιο αφορά ολόκληρο το βιβλίο τότε θα ειδοποιείται μόνο ο Editor. 26

28 4. Ο διαχειριστής εφόσον έχει τον ρόλο του author σε κάποιο από τα δύο βιβλία, θα έχει την δυνατότητα να επεξεργάζεται τα σχόλια. Θα μπορεί να εγκρίνει, να διαγράφει ή να αφήνει τα σχόλια σε κατάσταση αναμονής.εφόσον ένα σχόλιο είναι σε μορφή κειμένου και όχι σχολίου, ο διαχειριστής θα ελέγχει την εγκυρότητα του κειμένου και στην συνέχεια θα το προσθέτει στην σελίδα του εκάστοτε κεφαλαίου. 5. Κάθε φορά που υποβάλλεται κάποιο σχόλιο και γίνεται ενημέρωση στον υπεύθυνο τότε μέσα στο σύστημα διαχείρισης θα υπάρχει η δυνατότητα εμφάνισης του υπεύθυνου για το συγκεκριμένο σχόλιο έτσι ώστε να μπορεί να ελέγχεται και από όλους τους άλλους Authors και Editors. 3.4 Διαγράμματα Ροής Παρακάτω παρουσιάζονται τα διαγράμματα ροής στα οποία αποτυπώνονται οι απαιτήσεις του επισκέπτη καθώς και τα χαρακτηριστικά λειτουργίας του διαχειριστή. Διάγραμμα Ροής επισκέπτη Εικόνα 5. Διάγραμμα Ροής Επισκέπτη 27

29 Διάγραμμα Ροής Διαχειριστή Εικόνα 6. Διάγραμμα Ροής Διαχειριστή 3.5 Σύνοψη σχεδίασης και ανάλυσης απαιτήσεων Για τη σωστή δημιουργία της ιστοσελίδας είναι αναπόφευκτο να οργανωθούν και να σχεδιαστούν σωστά οι απαιτήσεις και οι προδιαγραφές που το απαρτίζουν, καθώς και το διάγραμμα ροής ώστε να δώσει τις απαραίτητες πληροφορίες για την ιστοσελίδα. Σε περίπτωση οποιασδήποτε τροποποίησης είναι απαραίτητη πρώτα η αλλαγή των απαιτήσεων και των προδιαγραφών και έπειτα οι αλλαγές στον επί μέρους κώδικα ώστε να μην υπάρχουν μελλοντικά προβλήματα. Έπειτα από την ανάλυση και τον έλεγχο των απαιτήσεων και των προδιαγραφών, παρακάτω θα γίνει ανάλυση των εργαλείων που χρησιμοποιήθηκαν για την υλοποίηση της ιστοσελίδας. 3.6 Επιλογή συστήματος διαχείρισης περιεχομένου (CMS) Εισαγωγή Έπειτα από την σχετική αναζήτηση σε διάφορες πηγές (διαδίκτυο) αλλά και από την εμπειρία προσωπικής χρήσης άλλων παρόμοιων συστημάτων διαχείρισης 28

30 περιεχομένου, επιλέχθηκε το WordPress, έτσι ώστε να είναι εφικτή η παραμετροποίηση της εφαρμογής και συγκεκριμένα της εφαρμογής διαδραστικού βιβλίου. Όπως αναφέρεται στο προηγούμενο κεφάλαιο, φαίνεται πως με βάση τις απαιτήσεις του κάθε χρήστη, κάθε CMS μπορεί να καλύψει μεγάλο εύρος επιλογών και αυτό καθορίζεται από τον ίδιο τον χρήστη. Παρακάτω θα αναλυθεί σε βάθος η πλατφόρμα του WordPress και θα δοθούν περισσότερες λεπτομέρειες όσων αφορά τους λόγους που χρησιμοποιήθηκε και γιατί επιλέχθηκε ως κατάλληλο για την συγκεκριμένη εργασία Γιατί WordPress; Το WordPress είναι ένα ανοιχτού κώδικα λογισμικό και ανήκει στα συστήματα διαχείρισης περιεχομένου. Βασισμένο στην PHP και MySQL με άδεια χρήσης GPL. Καθότι το WordPress αρχικά ξεκίνησε ως ένα σύστημα ιστολογιών (blogs) και στην πορεία εξελίχθηκε σε ένα πλήρες σύστημα διαχείρισης περιεχομένου (CMS) σε συνδυασμό με τα χιλιάδες πρόσθετα (plugins) και θέματα (templates), το καθιστά ένα πολύ εύχρηστο και εύκολο λογισμικό δημοσιεύσεων. Δυνατότητες WordPress Παρακάτω αναφέρονται μερικές από τις δυνατότητες του WordPress: Αποτελεί αναμφισβήτητα ένα φιλικό προς τον διαχειριστή περιβάλλον (user friendly) σε αντίθεση με άλλα CMS. Περιέχει πολύ καλή υποστήριξη και εκδόσεις που είναι απόλυτα συμβατές μεταξύ τους. Εύκολη εγκατάσταση και αναβάθμιση. Ακολουθώντας τα βήματα εγκατάστασης και της αναβάθμισης ένα προς ένα, η διαδικασία είναι πολύ εύκολη και γρήγορη. Διαθέτει μεγάλο πλήθος πρόσθετων (plugins) αμβλύνοντας τις δυνατότητες και τις επεκτάσεις του. Δίνοντας έτσι και την ευκαιρία στον προγραμματιστή ακόμα και να παραμετροποιήσει κάποιο από τα ήδη υπάρχοντα πρόσθετα, μέσω του κώδικα που χρησιμοποιείται. Υπάρχει δυνατότητα ενσωματωμένης διαχείρισης συνδέσμων, δυνατότητα ανάθεσης πολλαπλών κατηγοριών και υποκατηγοριών στα άρθρα, και υποστήριξη για ετικέτες στα άρθρα και τις σελίδες. Εγγραφή χρηστών. Δίνει τη δυνατότητα στον χρήστη να πραγματοποιεί την εγγραφή του έτσι ώστε ο καθένας από αυτούς να έχει το δικό του προφίλ. Δυνατότητα πολλαπλών συγγραφέων. Το WordPress δίνει τη δυνατότητα να υπάρχουν έως και δέκα διαφορετικά επίπεδα χρηστών ώστε να διαχειρίζονται και να κάνουν τις απαραίτητες τροποποιήσεις. Προστασία από κακόβουλα μηνύματα (spam) και λογισμικό. Διαθέτει ένα μεγάλο αριθμό από διάφορα πρόσθετα (plugins) τα οποία είναι χρήσιμα ώστε με την ενεργοποίησή τους να αποτρέπουν και να διαχειρίζονται τα spam που μπορούν να εμφανιστούν στα σχόλια. 29

31 Τέλος το WordPress διαθέτει μεγάλο αριθμό πρόσθετων λειτουργιών δίνοντας την δυνατότητα στους χρήστες και στους προγραμματιστές να επεκτείνουν την λειτουργικότητά του, πράγμα το οποίο αποτελεί ευκαιρία για μία συνεχή εξέλιξη στην συγκεκριμένη πλατφόρμα. Έχοντας υπ όψιν όλα τα παραπάνω, καθώς και δοκιμάζοντας και τις τρεις επιλογές των CMS που αναλύθηκαν στο προηγούμενο κεφάλαιο, καθώς και την σκέψη για δημιουργία δικού μας, τελικά επιλέχθηκε το WordPress. Η εφαρμογή Διαδραστικό Βιβλίο είναι μια κατά βάση δυναμική ιστοσελίδα που εκμεταλλεύεται τις δυνατότητες από όλες τις γλώσσες προγραμματισμού που περιγράφηκαν στο προηγούμενο κεφάλαιο (HTML, PHP, CSS, JAVASCRIPT, MySQL). Η ευελιξία που προσφέρει το WordPress, δίνει την δυνατότητα ανάπτυξης προσωπικού κώδικα στα πλαίσια της εργασίας. Η ευκολία χρήσης του WordPress έπαιξε και αυτή ρόλο στην τελική επιλογή. Ο πίνακας ελέγχου είναι αρκετά ευέλικτος στην χρήση του και στην διαχείρισή του (Wordpress, 2013) Πλεονεκτήματα του WordPress σε σχέση με άλλα CMS Το WordPress έχει χιλιάδες, δωρεάν στην πλειοψηφία τους, πρόσθετα (plugins). Είναι προϊόν της προσπάθειας και συνεισφοράς χιλιάδων προγραμματιστών που το χρησιμοποιούν και οι ίδιοι για την ιστοσελίδα και τις επιχειρήσεις τους. Από τις πρώτες του εκδόσεις το WordPress έχει τη δυνατότητα για εύκολη χρήση ταυτόχρονα από πολλούς χρήστες με διακριτούς ρόλους. Δεν απαιτεί προγραμματιστικές γνώσεις και ακόμη και κάποιος που δεν έχει ιδιαίτερες γνώσεις προγραμματισμού, μπορεί σε λίγα λεπτά να το εγκαταστήσει και εύκολα να δημιουργήσει μια ιστοσελίδα. Είναι εύκολο στην εκμάθηση και διαθέτει ένα καθαρό και απλό περιβάλλον διαχείρισης ώστε να βοηθά τον μέσο χρήστη να μπορεί να ανταποκριθεί στην διαδικασία ενημέρωσης και συντήρησης της ιστοσελίδας του. To WordPress μέσα από τη χρήση των χιλιάδων θεμάτων (templates) και πρόσθετων (plugins) μπορεί να στηρίξει από ένα απλό προσωπικό ιστολόγιο μέχρι μεγάλα εμπορικά ηλεκτρονικά καταστήματα (e-shops). Επίσης κάποιος με βασικές γνώσεις HTML και CSS μπορεί εύκολα να κάνει αλλαγές. Το WordPress είναι η ιδανική λύση για τη δημιουργία ιστοσελίδων που είναι φιλικές προς τις μηχανές αναζήτησης (SEO friendly), χωρίς να χρειάζονται ιδιαίτερες ρυθμίσεις καθώς διαθέτει πλήθος επιλογών είτε στον πυρήνα του είτε με την εγκατάσταση προσθέτων (plugins) για το σκοπό αυτό (CMS Comparison, 2013). 30

32 3.7 Δομή των αρχείων του WordPress Παρακάτω θα αναφερθούν συνοπτικά τα σημαντικότερα αρχεία και φάκελοι του πυρήνα που υπάρχουν στην βάση δεδομένων με την εγκατάσταση του WordPress Η Δομή των φακέλων /wp-admin: περιέχει τα αρχεία του πίνακα ελέγχου. /wp-content: περιέχει τα αρχεία του περιεχομένου (π.χ γλώσσες, πρόσθετα, θέματα, όλα τα ανεβασμένα αρχεία). /wp-content/languages: εδώ αποθηκεύουμε τις διαθέσιμες γλώσσες που υπάρχουν. /wp-content/plugins: σε αυτό το φάκελο βρίσκονται όλα τα πρόσθετα. /wp-content/templates: εδώ βρίσκεται το θέμα που χρησιμοποιείται ή άλλα εγκατεστημένα θέματα που μπορούμε να ενεργοποιήσουμε ανά πάσα στιγμή. /wp-content/uploads: οτιδήποτε αρχείο ανεβάσουμε από την συλλογή πολυμέσων του πίνακα ελέγχου, αποθηκεύεται σε αυτόν τον φάκελο. /wp-includes: περιέχει διάφορα συμπληρωματικά scripts. /wp-config.php: περιέχει τα στοιχεία σύνδεσης με τη βάση δεδομένων. Μέσα από αυτό το αρχείο μπορούμε να ορίσουμε τον κωδικό, τον χρήστη και το όνομα της βάσης δεδομένων ώστε η εφαρμογή να συνδέεται με αυτήν καθώς επίσης και το πρόθεμα που χρησιμοποιούν οι πίνακες της βάσης (prefix). Επίσης μέσα στο wpconfig.php υπάρχουν κάποια κλειδιά ασφαλείας που αλλάζοντάς τα, σε περίπτωση που υπάρχει πρόβλημα με κάποιον χρήστη, θα υποχρεώσει όλους τους χρήστες να συνδεθούν ξανά με την ιστοσελίδα. Τέλος, μπορούμε να αλλάξουμε την γλώσσα του WordPress, αρκεί να είναι εγκατεστημένη στον φάκελο wp-cοntent/languages και να επιλέξουμε αν θέλουμε να είναι ενεργοποιημένη η λειτουργία απασφαλμάτωσης (debug) (WordPress Basics: Understanding the Infrastructure WPHub, 2013). 31

33 Εικόνα 7. Δομή των φακέλων Η δομή της Βάσης Δεδομένων Το WordPress από προεπιλογή χρησιμοποιεί σαν πρόθεμα για τους πίνακες της βάσης δεδομένων το wp (π.χ wp_posts, wp_terms). Εμείς για λόγους ασφαλείας αλλάξαμε το προεπιλεγμένο πρόθεμα και χρησιμοποιήσαμε ένα τυχαίο, το 5r7. Οπότε η δική μας βάση δεδομένων δομείται ως εξής: 5r7_comments καταχωρούνται στον ομώνυμο πίνακα της βάσης 5r7_commentmeta πληροφορίες σχετικά με τα σχόλια (ώρα, κλπ) 5r7_links πληροφορίες σχετικά με τους συνδέσμους 5r7_options οι διάφορες επιλογές του χρήστη 5r7_postmeta πληροφορίες σχετικά με τις αναρτήσεις 5r7_posts το περιεχόμενο των αναρτήσεων και των σελίδων 5r7_terms οι κατηγορίες των σελίδων και των αναρτήσεων 5r7_term_relationships ο συσχετισμός των αναρτήσεων με τις κατηγορίες 5r7_term_taxonomy η ιεραρχία των κατηγοριών, συνδέσμων, κλπ. 5r7_usermeta πληροφορίες για τους εγγεγραμμένους χρήστες 5r7_users η λίστα των χρηστών 3.8 Ο Πίνακας ελέγχου του WordPress Παρακάτω θα γίνει μία μικρή παρουσίαση για το τι περιέχει ο πίνακας ελέγχου του WordPress της έκδοσης 3.9 η οποία χρησιμοποιήθηκε. Για να συνδεθεί κάποιος με 32

34 τον πίνακα ελέγχου, αρκεί να επισκεφθεί από τον φυλλομετρητή, τον φάκελο /wpadmin (π.χ domain.gr/wp-admin). Εικόνα 8. Σύνδεση χρήστη στον Πίνακα Ελέγχου του Wordpress Πίνακας Ελέγχου (Dashboard) Στην κεντρική σελίδα του πίνακα ελέγχου εμφανίζονται διάφορες γενικές πληροφορίες όπως είναι τα στατιστικά επισκεπτών, πρόσφατα σχόλια των επισκεπτών, πρόσφατα προσχέδια. Από την μπάρα διαχείρισης μπορεί να γίνει γρήγορη δημιουργία και επεξεργασία άρθρων και σελίδων και ειδοποίηση για διαθέσιμες ενημερώσεις και λειτουργίες. Στο πλαϊνό μενού διαχείρισης φαίνονται όλες οι διαθέσιμες επιλογές που δίνει το WordPress καθώς επίσης και τα plugins που είναι ήδη εγκατεστημένα (Dashboard Screen Wordpress Codex, 2013). 33

35 Εικόνα 9. Πίνακας Ελέγχου του Wordpress Άρθρα (Posts) Τα άρθρα χρησιμοποιούνται κυρίως για θέματα που καθημερινά προστίθενται νέα και υπάρχει μία συνεχή ροή και εξέλιξη στην εμφάνισή τους. Τα άρθρα συνοδεύονται από την ημερομηνία και την κατηγορία στην οποία ανήκει, γι αυτό πάντα προέχει η δημιουργία κατηγοριών όπου θα ανήκει το άρθρο. Αυτή είναι κυρίως και η διαφορά τους με τις σελίδες. Τα άρθρα αποτελούν ένα περιεχόμενο ροής όπως θα συνέβαινε σε ένα ιστολόγιο (blog) ή σε μία ιστοσελίδα ενημέρωσης (Writing Posts Wordpress Codex, 2013). 34

36 Εικόνα 10. Άρθρα Πίνακα Ελέγχου στο Wordpress Πολυμέσα (Multimedia) Στη συλλογή πολυμέσων μπορεί να ανεβάσει ο διαχειριστής αρχεία ώστε να εμφανιστούν στην ιστοσελίδα (π.χ εικόνες, βίντεο, pdf, doc). Εικόνα 11. Πολυμέσα Πίνακα Ελέγχου στο Wordpress Σελίδες (Pages) Οι σελίδες αφορούν στατικά και μόνιμου τύπου περιεχόμενα. Κατά την δημοσίευσή τους μπαίνουν κατευθείαν σαν κεντρική γραμμή ή σαν υποσέλιδα στο κεντρικό 35

37 μενού. Στην συγκεκριμένη εργασία γι αυτό ακριβώς τον λόγο χρησιμοποιήθηκαν οι σελίδες και όχι τα άρθρα, γιατί το περιεχόμενο του site αφορά ένα και μόνο σταθερό περιεχόμενο και δεν είναι προς ενημέρωση, παρόλο που υπάρχει η δυνατότητα προσθήκης και επεξεργασίας του υπάρχοντος περιεχομένου από τον διαχειριστή. Έτσι η λειτουργία των άρθρων θα μπορούσε στο μέλλον να χρησιμοποιηθεί με τη μορφή του blog ώστε να ενημερώνονται οι χρήστες για νέα που αφορούν την ιστοσελίδα, ενημερώσεις, προσθήκες και νέες λειτουργίες/δυνατότητες (Pages Wordpress Codex, 2013). Εικόνα 12. Σελίδες Πίνακα Ελέγχου στο Wordpress Σχόλια (Comments) Εφόσον ο επισκέπτης υποβάλλει το σχόλιό του, ο διαχειριστής μέσω ειδοποιείται και έχει τη δυνατότητα προέγκρισης, αποέγκρισης και διαγραφής του συγκεκριμένου σχολίου (Comments in Wordpress Wordpress Codex). 36

38 Εικόνα 13. Σχόλια Πίνακα Ελέγχου στο Wordpress Εμφάνιση Το μενού της εμφάνισης δίνει την δυνατότητα στον διαχειριστή να προσαρμόσει τον γενικό σχεδιασμό και εμφάνιση της ιστοσελίδας και μέσω των σχετικών ενημερώσεων δίνονται ακόμα περισσότερες δυνατότητες σχετικά με αυτήν. Θέματα (Templates) Από την επιλογή θεμάτων ο διαχειριστής διαλέγει ένα νέο θέμα για την ιστοσελίδα του (Templates Wordpress Codex, 2013). Μονάδες (Widgets) Οι μονάδες δίνουν την δυνατότητα να τακτοποιεί ο διαχειριστής στοιχεία όπως είναι οι κατηγορίες, ώστε να εμφανίζονται στην πλαϊνή μπάρα της ιστοσελίδας ή στο υποσέλιδό της (footer) (Wordpress Widgets Wordpress Codex, 2013). 37

39 Εικόνα 14. Μονάδες Πίνακα Ελέγχου στο Wordpress Μενού (Menu) Στην επιλογή του μενού δίνεται η δυνατότητα δημιουργίας μενού όπως το επιθυμεί ο διαχειριστής (Wordpress Menu User Guide, 2013). Εικόνα 15. Μενού Πίνακα Ελέγχου στο Wordpress 38

40 Πρόσθετα (Plugins) Τα πρόσθετα είναι μικρές εφαρμογές οι οποίες επεκτείνουν την λειτουργικότητα της ιστοσελίδας ανάλογα με τις απαιτήσεις του προγραμματιστή. Υπάρχουν χιλιάδες πρόσθετα τα οποία διατίθενται δωρεάν στην επίσημη ιστοσελίδα του WordPress και μπορεί να τα βρει κάνοντας μια απλή αναζήτηση χρησιμοποιώντας τις κατάλληλες λέξεις κλειδιά. Έτσι το μόνο που χρειάζεται είναι η εγκατάσταση και η ενεργοποίησή τους. Στο επόμενο κεφάλαιο θα αναφερθούν και θα αναλυθούν όλα τα πρόσθετα που χρησιμοποιήθηκαν (Plugins Wordpress Plugins, 2013). Εικόνα 16. Πρόσθετα Πίνακα Ελέγχου στο Wordpress Μέλη (Members) Με την επιλογή των μελών δίνεται η δυνατότητα να δημιουργηθούν περισσότεροι από έναν αρθρογράφοι και βοηθοί αυτών. Αφότου δημιουργηθούν τα μέλη, το καθένα από αυτά θα έχει ένα όνομα χρήστη και κωδικό πρόσβασης ώστε να συνδέεται στην ιστοσελίδα με τον ρόλο που του έχει δοθεί. Οι ρόλοι που είναι διαθέσιμοι είναι οι παρακάτω: Administrator (Διαχειριστής): Ο διαχειριστής είναι αυτός που έχει τον απόλυτο και μεγαλύτερο έλεγχο στην ιστοσελίδα όσων αφορά τα άρθρα, σελίδες, σχόλια, ρυθμίσεις, μέλη. Έχει ακόμη τη δυνατότητα να σβήσει και ολόκληρη την ιστοσελίδα. Editor (Συντάκτης): Ο Συντάκτης έχει τη δυνατότητα να δημοσιεύσει και να διαχειριστεί σελίδες, άρθρα, κατηγορίες, σχόλια και συνδέσμους καθώς και να ανεβάσει εικόνες και αρχεία. 39

41 Author (Συγγραφέας): Ο Συγγραφέας της ιστοσελίδας έχει τη δυνατότητα να δημοσιεύσει και να επεξεργαστεί μόνο τα δικά της άρθρα/σελίδες και να ανεβάσει εικόνες και αρχεία. Contributor (Συνεργάτης): Ο Συνεργάτης έχει τη δυνατότητα μόνο να επεξεργαστεί τα άρθρα/ σελίδες του χωρίς όμως να έχει το δικαίωμα να τα δημοσιεύσει. Δημοσιεύονται μόνο εφόσον έχουν εγκριθεί από τον διαχειριστή και από την στιγμή της δημοσίευσής τους δεν μπορούν να αλλαχτούν. Δεν έχει τη δυνατότητα να ανεβάζει εικόνες και αρχεία (Roles and Capabilities Wordpress Codex, 2013). Εικόνα 17. Μέλη Πίνακα Ελέγχου στο Wordpress Εργαλεία Τα εργαλεία χρησιμοποιούνται σε περίπτωση μεταφοράς από άλλη πλατφόρμα WordPress, με τη δυνατότητα να εισάγονται και να εξάγονται κείμενα και εικόνες και έπειτα να γίνεται η επεξεργασία τους, εάν φυσικά είναι απαραίτητο. 40

42 Εικόνα 18. Εργαλεία Πίνακα Ελέγχου στο Wordpress Ρυθμίσεις Οι ρυθμίσεις αποτελούν την τελευταία επιλογή στην σειρά του πίνακα ελέγχου αλλά και την πιο σημαντική διότι δίνει την δυνατότητα γενικών ρυθμίσεων στην ιστοσελίδα και συγκεκριμένα στο όνομα / τίτλο του ιστοτόπου, εμφάνιση ημερομηνίας, ρυθμίσεις άρθρων, σχολίων, πολυμέσων, συνδέσμων και γενικότερα ρυθμίσεις όλων των προηγούμενων επιλογών που αναφέρθηκαν που περιλαμβάνονται στον πίνακα ελέγχου (Settings API Wordpress Codex, 2013). 41

43 Εικόνα 19. Ρυθμίσεις Πίνακα Ελέγχου στο Wordpress Στο επόμενο κεφάλαιο θα παρουσιαστούν, εκτός των άλλων, όλες οι επιλογές που υπάρχουν στο μενού «Γενικές ρυθμίσεις» καθώς και οι αλλαγές που πραγματοποιήθηκαν. 42

44 43

45 4. ΥΛΟΠΟΙΗΣΗ ΤΗΣ ΕΦΑΡΜΟΓΗΣ 4.1 Εισαγωγή Σε αυτό το κεφάλαιο αναλύεται διεξοδικά τι ακριβώς χρειάστηκε να γίνει έτσι ώστε να ολοκληρωθεί η υλοποίηση της εφαρμογής. Αναφέρονται δηλαδή τα βήματα ένα προς ένα ξεκινώντας από την εγκατάσταση και τις ρυθμίσεις που έγιναν στο σύστημα διαχείρισης περιεχομένου, την εγκατάσταση του θέματος και όλα όσα έχουν να κάνουν με την ωραιοποίηση της σελίδας, την σύνταξη και την ανάγνωση. Ακόμα αναλύεται το πώς έγινε η τοποθέτηση των βιβλίων, πώς έγινε η δημιουργία των κεφαλαίων καθώς και το δίγλωσσο μενού. Επίσης υπάρχει μεγάλη ανάλυση στα πρόσθετα (plugins) που χρησιμοποιήθηκαν και υπήρχαν έτοιμα για εγκατάσταση καθώς και στη δημιουργία νέων πρόσθετων (Εικόνα 34, 35, 37, 38, 39, 40). Τέλος υπάρχει εκτενής αναφορά σχετικά με τις δυνατότητες που υπάρχουν στα σχόλια των χρηστών και το πώς λειτουργεί μία από τις βασικές απαιτήσεις της εφαρμογής που έχει να κάνει με τους editors και τους authors. 4.2 Εγκατάσταση WordPress Η εγκατάσταση του WordPress πρέπει να γίνεται σε έναν διακομιστή και οι απαιτήσεις για την έκδοση 3.9 που χρησιμοποιείται είναι PHP ή μεγαλύτερη και MySQL 5.0 ή νεότερη (Wordpress 3.9 requirements, 2014). Για τις ανάγκες της συγκεκριμένης πτυχιακής χρησιμοποιήθηκε ένας εμπορικός διακομιστής και έγινε εγκατάσταση του WordPress μέσω του αυτόματου εγκαταστάτη Softaculous (Softaculous, 2014). 4.3 Εγκατάσταση Θέματος (Template) Με την εγκατάσταση του WordPress, πρέπει αρχικά να γίνει επιλογή ενός θέματος. Μέσα από μια πληθώρα επιλογών που παρέχει το WordPress, επιλέχθηκε και αγοράστηκε το θέμα Enfold (Enfold - Responsive Multi-Purpose Theme, 2013) καθώς τα περισσότερα δωρεάν δεν ικανοποιούσαν τις ανάγκες της εργασίας όσον αφορά το αισθητικό αλλά και το λειτουργικό κομμάτι της. Το συγκεκριμένο θέμα προσαρμόζεται σε οποιαδήποτε οθόνη ηλεκτρονικού υπολογιστή, σε ταμπλέτα ή σε κινητό τηλέφωνο (σχεδιασμό responsive). Η εγκατάσταση του θέματος γίνεται από το μενού του πίνακα ελέγχου. Από την επιλογή «Εμφάνιση», έπειτα στην επιλογή «Θέματα» και πραγματοποιείται η εγκατάσταση του θέματος. 44

46 Εικόνα 20. Εγκατάσταση θέματος 4.4 Ρυθμίσεις στον πίνακα ελέγχου του WordPress Παρακάτω παρουσιάζονται οι αρχικές ρυθμίσεις που έγιναν αμέσως μετά την εγκατάσταση και αφορούν το μενού «Ρυθμίσεις» του Πίνακα ελέγχου (Dashboard Screen Wordpress Codex, 2013). Γενικές ρυθμίσεις στο Wordpress Εικόνα 21. Γενικές ρυθμίσεις του Wordpress 45

47 Από το πλαϊνό μενού του Πίνακα Ελέγχου => Ρυθμίσεις => Γενικά. Εκεί έγινε αλλαγή του τίτλου και του υπότιτλου της ιστοσελίδα, επίσης σε περίπτωση που γίνει εγκατάσταση σε έναν φάκελο μπορεί να αλλαχθεί το URL του Wordpress στο αρχικό domain αλλάζοντας το URL ιστοτόπου. Στο επόμενο πεδίο (ηλεκτρονική διεύθυνση) ορίστηκε το όπου θα έρχονται διάφορες ειδοποιήσεις (για παράδειγμα όταν υπάρχει ένα νέο σχόλιο σε κάποιο άρθρο). Στο τέλος υπάρχουν διάφορες ρυθμίσεις που αφορούν την ημερομηνία και την ώρα. Επιλέχθηκε η σωστή ζώνη ώρας, καθώς επίσης και η επιθυμητή μορφή ημερομηνίας και ποια είναι η πρώτη ημέρα της εβδομάδας (Κυριακή ή Δευτέρα). 46

48 Ρυθμίσεις σύνταξης και ανάγνωσης Εικόνα 22. Ρυθμίσεις σύνταξης στον Πίνακα Ελέγχου του Wordpress Στη σελίδα Ρυθμίσεις σύνταξης (Ρυθμίσεις => σύνταξη) υπάρχουν διάφορες ρυθμίσεις που αφορούν τη δημιουργία των άρθρων. Για παράδειγμα να εμφανίζονται emoticons ή για δημοσίευση μέσω απευθείας στην ιστοσελίδα. Ρυθμίσεις ανάγνωσης στο WordPress Εικόνα 23. Ρυθμίσεις ανάγνωσης στον Πίνακα Ελέγχου του Wordpress 47

49 Υπάρχει η δυνατότητα απαγόρευσης στο Google και στις υπόλοιπες μηχανές αναζήτησης να καταχωρήσουν την ιστοσελίδα. Αυτό γίνεται από τις ρυθμίσεις ανάγνωσης επιλέγοντας το "Να απαγορεύεται σε μηχανές αναζήτησης η ευρετηριοποίηση του ιστοχώρου". Εδώ υπάρχει η δυνατότητα ορισμού, εάν είναι επιθυμητό, να χρησιμοποιείται κάποια συγκεκριμένη σελίδα ως αρχική καθώς επίσης και πόσα άρθρα θα φαίνονται σε κάθε σελίδα του blog ή στα RSS feeds. Ρυθμίσεις συζητήσεων στο Wordpress Εικόνα 24. Ρυθμίσεις συζητήσεων στον Πίνακα Ελέγχου του Wordpress Εδώ υπάρχουν διάφορες ρυθμίσεις που αφορούν τον σχολιασμό των άρθρων. Επιλέχθηκε να είναι από προεπιλογή ανοιχτός ο σχολιασμός του κάθε άρθρου, και φυσικά θα υπάρχει προέγκριση και η ανάλογη ειδοποίηση όποτε υπάρχει κάποιο νέο σχόλιο. 48

50 Ρυθμίσεις πολυμέσων Εικόνα 25. Ρυθμίσεις πολυμέσων στον Πίνακα Ελέγχου του Wordpress Το Wordpress δίνει τη δυνατότητα να οριστούν από τον διαχειριστή οι επιθυμητές διαστάσεις των φωτογραφιών από τις επιλογές της μικρογραφίας, του μέσου και του μεγάλου μεγέθους. Μόνιμοι σύνδεσμοι ή αλλιώς permalinks Εικόνα 26. Μόνιμοι σύνδεσμοι στον Πίνακα Ελέγχου του Wordpress 49

51 Η δυνατότητα να χρησιμοποιούνται urls φιλικά προς τις μηχανές αναζήτησης είναι ένα από τα μεγαλύτερα πλεονεκτήματα που έχει το Wordpress. Από τη σελίδα διαχείρισης μόνιμων συνδέσμων (Ρυθμίσεις => Μόνιμοι σύνδεσμοι) ορίστηκε η επιθυμητή μορφή των urls των άρθρων και των σελίδων. Επίσης υπάρχει η δυνατότητα να αλλαχθούν και τα urls των κατηγοριών και των ετικετών. 4.5 Εγκατάσταση υλικού Δημιουργία σελίδας Στην επιλογή «Σελίδες» και «Νέα σελίδα» του πίνακα ελέγχου μπορεί ο διαχειριστής να πληκτρολογήσει στο πρώτο πεδίο τον τίτλο που επιθυμεί να ορίσει. Έπειτα μπορεί να προσθέσει το περιεχόμενο της σελίδας στο πεδίο του κειμενογράφου με τη δυνατότητα επεξεργασίας του κειμένου και αμέσως παρακάτω εμφανίζεται ο συντάκτης που δημιούργησε την συγκεκριμένη σελίδα. Στο πλαϊνό μενού υπάρχει δυνατότητα προεπισκόπησης και αποθήκευσης της σελίδας, καθώς και η επιλογή της γονικής. Αυτή η επιλογή αφορά τις περιπτώσεις στη δημιουργία βιβλίων, όπου δεν επιλέγεται κάποιος γονέας, και στις περιπτώσεις που προστίθενται τα κεφάλαια των βιβλίων, όπου επιλέγεται ο αντίστοιχος γονέας στο βιβλίο που ανήκει το καθένα από αυτά. Με αυτόν τον τρόπο δημιουργήθηκε στην ιστοσελίδα η αρχική σελίδα, τα βιβλία και τα κεφάλαια / υποκεφάλαια τους καθώς και τις σελίδες, «Επικοινωνία» και «Για Εμάς». Εικόνα 27. Δημιουργία νέας σελίδας από τον Πίνακα Ελέγχου 50

52 Σελίδα επικοινωνίας Εγκαθιστώντας το πρόσθετο Contact Form 7 (Contact Form 7 Wordpress Plugins, 2013) εμφανίζεται η φόρμα επεξεργασίας και γίνεται η παραμετροποίησή της. Στα πεδία όνομα και είναι υποχρεωτική η συμπλήρωσή τους. Επιπλέον, προστέθηκαν τα πεδία captchac και captchar (όπως φαίνονται και στην παρακάτω εικόνα), ώστε να εμφανίζεται η εικόνα και το πεδίο captcha για την εισαγωγή χαρακτήρων ασφαλείας. Δίπλα από το πεδίο επεξεργασίας της φόρμας εμφανίζεται η επιλογή δημιουργίας ετικέτας, όπου μπορεί ο διαχειριστής να προσθέσει κάποιες από τις επιλογές που δίνονται (π.χ πεδίο ημερομηνία, checkbox, radio buttons). To πεδίο mail περιλαμβάνει το στο οποίο στέλνονται τα μηνύματα της φόρμας επικοινωνίας, το όνομα του αποστολέα και το θέμα, σύμφωνα με τα στοιχεία που έδωσε. Τέλος, στο σώμα του μηνύματος θα πρέπει τα στοιχεία να δίνονται όπως ακριβώς δόθηκαν στο πεδίο της φόρμας. Ολοκληρώνοντας τη διαδικασία επεξεργασίας της φόρμας και επιλέγοντας αποθήκευση, εμφανίζεται αυτόματα ένας σύντομος κώδικας, [contact-form-7 id="2803" title="contact form 1"] στην περίπτωσή μας. Αντιγράφοντάς τον στον κειμενογράφο της σελίδας «Επικοινωνία» που δημιουργήθηκε και πατώντας αποθήκευση το πρόσθετο θα εμφανίσει αυτόματα την φόρμα επικοινωνίας σύμφωνα με τα στοιχεία που του δόθηκαν. Εικόνα 28. Επεξεργασία φόρμας επικοινωνίας 51

53 Εικόνα 29. Επεξεργασία φόρμας επικοινωνίας 4.6 Έτοιμα Πρόσθετα (Plugins) Τα πρόσθετα στο WordPress είναι εργαλεία (κομμάτια κώδικα) με τη βοήθεια των οποίων ο χρήστης μπορεί να επεκτείνει τις δυνατότητες της ιστοσελίδας του πέρα από την βασική εγκατάσταση του WordPress χωρίς να επεξεργαστεί τα αρχεία του πυρήνα ή του θέματος που είναι εγκατεστημένο. Γι αυτό και ενδείκνυται η χρήση προσθέτων όποτε είναι αυτή δυνατή. Τα πρόσθετα μπορούν να εγκατασταθούν και να επεκτείνουν απλές και σύνθετες λειτουργίες της πλατφόρμας καθώς και να επεκτείνουν τη λειτουργικότητα ενός θέματος. Παρακάτω θα αναπτυχθούν όλα τα σχετικά plugins που χρησιμοποιήθηκαν στην συγκεκριμένα εφαρμογή. 1. Add Tags And Category To Page And Post Types. Δίνει τη δυνατότητα στον χρήστη να προσθέσει κατηγορίες και ετικέτες στις σελίδες του WordPress (Add Tags And Category To Page And Post Types Wordpress Plugins, 2013). 2. Audit Trail Καταγράφει τις ενέργειες των συνδεδεμένων χρηστών στην σελίδα μας (Audit Trail Wordpress Plugins, 2013). Εικόνα 30. Πρόσθετο Audit Trail 52

54 3. Contact Form 7 Δίνει τη δυνατότητα δημιουργίας φόρμας επικοινωνίας (Contact Form 7 Wordpress Plugins, 2013). Εικόνα 31. Πρόσθετο Contact Form 7 4. Exploit Scanner Κάνει τον έλεγχο για τυχόν κενά ασφαλείας ή ύποπτα κομμάτια κώδικα στην ιστοσελίδα (Exploit Scanner Wordpress Plugins, 2013). Εικόνα 32. Πρόσθετο Exploit Scanner 53

55 5. Facebook Το συγκεκριμένο πρόσθετο (Facebook Wordpress Plugins, 2013) ενεργοποιεί τις λειτουργίες του Facebook για ιστοσελίδες όπως τα Open graph Meta Tags (The Open graph Protocol, 2013) 6. Growmap Anti Spambot Plugin Προστατεύει τα σχόλια από τυχόν spam (Growmap Anti Spambot Wordpress Plugin, 2013). 7. Members Δίνει τη δυνατότητα να αλλάξουμε εύκολα τα δικαιώματα για κάθε ομάδα χρηστών και να προσθέσουμε νέες ομάδες (Members Wordpress Plugins, 2013). Εικόνα 33. Πρόσθετο Members 8. No Self Pings Προστατεύει έτσι ώστε να μην στέλνει η ιστοσελίδα μας ενοχλητικά pingbacks στον εαυτό της (No Self Pings Wordpress Plugins, 2013). 9. Really Simple CAPTCHA Είναι ένα captcha plugin για την φόρμα επικοινωνίας (Really Simple CAPTCHA Wordpress Plugins, 2013). 10. WordPress SEO by Yoast Είναι ένα SEO πρόσθετο που περιέχει ρυθμίσεις ώστε η ιστοσελίδα να είναι φιλικότερη προς τις μηχανές αναζήτησης (Wordpress SEO by Yoast, 2013). 11. Comment Attachment Επιτρέπει στους επισκέπτες της ιστοσελίδας να επισυνάψουν αρχεία με τις παρατηρήσεις τους καθώς και σχετικά έγγραφα ή εικόνες μέσα από την φόρμα των σχολίων. Επίσης δίνει τη δυνατότητα στον διαχειριστή να: 54

56 Κάνει συνημμένο ένα υποχρεωτικό πεδίο. Επιλέξει μία ετικέτα του συνημμένου στο κείμενο σχολίων. Επιλέξει τους τύπους των αρχείων που επιτρέπεται να επισυνάπτονται. Επιλέξει εάν ένα συνημμένο μπορεί να είναι ορατό ή όχι από τους επισκέπτες στο πεδίο των σχολίων. Επιλέξει τη θέση του επισυναπτόμενου στο πεδίο των σχολίων, είτε πριν από το κυρίως σχόλιο είτε μετά από αυτό. Αποφασίσει εάν το επισυναπτόμενο μπορεί να κατέβει από τους επισκέπτες. Αποφασίσει εάν η επισυναπτόμενη εικόνα μπορεί να εμφανιστεί σε ένα σχόλιο και να επιλέξει το μέγεθος της εικόνας αυτής. Περιορίσει το μέγεθος του επισυναπτόμενου αρχείου που αποστέλλεται. (Comment Attachment Wordpress Plugins, 2013). 12. Greeklish-Permalinks Το συγκεκριμένο πρόσθετο μετατρέπει τους ελληνικούς χαρακτήρες στο URL της σελίδας σε greeklish (Greeklish-Permalinks Wordpress Plugins, 2013). 4.7 Δημιουργία του πρόσθετου «Δίγλωσσο μενού e-nteraction» Σύμφωνα με τις απαιτήσεις της εργασίας το μενού θα έπρεπε να είναι δίγλωσσο (Ελληνικά Αγγλικά). Επιλέχθηκε να μην χρησιμοποιηθεί κάποιο έτοιμο πρόσθετο αλλά να γραφτεί ένα δικό μας που να καλύπτει τις ανάγκες της εφαρμογής. Έτσι δημιουργήθηκε ένα πρόσθετο (Writing a Plugin Wordpress Codex, 2013) με όνομα «Δίγλωσσο μενού e-nteraction», αποθηκεύθηκε στο φάκελο /wp-content/plugins με όνομα multilang-menu και ενεργοποιήθηκε μέσω του πίνακα ελέγχου του WordPress στο μενού Πρόσθετα. Εικόνα 34. Πρόσθετο Δίγλωσσο μενού Κατά τη φόρτωση κάθε σελίδας στην εφαρμογή, υπάρχει από προεπιλογή το ελληνικό μενού. Σε περίπτωση που ο χρήστης θέλει να αλλάξει γλώσσα, αρκεί να επιλέξει το «En» από το μενού για να αλλάξει στα Αγγλικά ή αντίστοιχα όταν βρίσκεται στα Αγγλικά να επιλέξει το «El» για Ελληνικά. Διαλέγοντας κάποια από τις δύο επιλογές, η εφαρμογή την αποθηκεύει με την μορφή cookie στον υπολογιστή του χρήστη. Έτσι, όταν ο χρήστης περιηγείται στην ιστοσελίδα ή την επισκεφθεί ξανά στο μέλλον θα εμφανίζεται το μενού που είχε επιλέξει την τελευταία φορά. 55

57 Εικόνα 35. Function δίγλωσσου μενού Όπως παρατηρείται και στα κομμάτια κώδικα της Εικόνας 35 και της Εικόνας 37, η διαδικασία που ακολουθείται είναι η εξής: Αρχικά, μέσω της jquery δημιουργούνται δύο σύνδεσμοι στο menu, ένας για την ελληνική γλώσσα και ένας για την αγγλική γλώσσα, όπου του έχει δοθεί html class με όνομα pty_lang. Ο κάθε σύνδεσμος στο menu παίρνει κάθε φορά ένα και μοναδικό html id. Στην περίπτωσή μας, ο σύνδεσμος el έχει id menu-item-2886 (Εικόνα 37) για το ελληνικό μενού και ο σύνδεσμος en έχει id menu-item-2887 (Εικόνα 37) για το αγγλικό μενού. Και τα δύο έχουν την class plty_lang. Έτσι,μέσω της jquery δημιουργείται μία συνθήκη ελέγχου για το πότε ο χρήστης θα κάνει click στο αντικείμενο με class ptylang (Γραμμή 29, Εικόνα 35). Όταν γίνει click, η jquery αποθηκεύει ένα cookie στον υπολογιστή του χρήστη με όνομα pty_lang και την τιμή το id του menu που πατήθηκε, δηλαδή id menu-item-2886 ή id menu-item-2887 (Γραμμή 31, Εικόνα 35). Στη συνέχεια δημιουργήθηκαν δύο διαφορετικά μενού στον πίνακα ελέγχου με ονόματα main_el για το ελληνικό μενού και main_en για το αγγλικό (Εικόνα 36). 56

58 Εικόνα 36. Edit Menus στον Πίνακα Ελέγχου Τέλος, έγιναν όλες οι απαραίτητες αλλαγές στον κώδικα του εγκατεστημένου θέματος ώστε η ιστοσελίδα να χρησιμοποιεί το μενού που ορίζεται μέσα από μία συγκεκριμένη μεταβλητή με όνομα $choosenmenu (Γραμμή 165). Εικόνα 37. Function δίγλωσσου μενού_2 Γραμμή 63: Έλεγχος για το αν υπάρχει cookie με όνομα pty_lang. Γραμμή 64: Εάν πληρεί την συνθήκη περνάμε την τιμή του cookie pty_lang την μεταβλητή $itemid. Γραμμή 65-66: Εάν η itemid είναι ίση με το menu-item-2887 τότε η $choosenmenu παίρνει την τιμή menu_en. Γραμμή 67-68: Αλλιώς, εάν η itemid είναι ίση με το menu-item-2886 τότε η $choosenmenu παίρνει την τιμή menu_el. Γραμμή 69-70: Αλλιώς (Γραμμή 64) φορτώνει το menu_el. Γραμμή 72-73: Αλλιώς (Γραμμή 63) εάν δεν υπάρχει το cookie, φορτώνει το menu_el. 57

59 Αυτό το καταφέραμε προσθέτοντας στο array της γραμμής 165 (Εικόνα 37) τον κώδικα: menu => $choosenmenu, σύμφωνα με τις οδηγίες που δίνονται στην τεκμηρίωση της function wp_nav_menu του WordPress η οποία διαχειρίζεται τα δυναμικά μενού. (Function Reference/wp nav menu - Wordpress Codex, 2014) 4.8 Δημιουργία πρόσθετου «Απαραίτητες functions e-nteraction» Κατά τη διάρκεια την ανάπτυξης στης εφαρμογής χρειάστηκε να γραφτούν και κάποιες πρόσθετες functions που θα βοηθούσαν στη λειτουργικότητα της ιστοσελίδας. Όλες αυτές χρησιμοποιήθηκαν στην ιστοσελίδα με τη μορφή ενός προσθέτου με όνομα «Απαραίτητες functions e-nteraction». Αναλυτικά οι functions που δημιουργήθηκαν: Function pty_enqueue() Η συγκεκριμένη λειτουργία προσθέτει στην ιστοσελίδα ένα δικό μας style.css αρχείο όπου βρίσκονται διάφορες προσθήκες στυλ που έγιναν στο θέμα (για παράδειγμα το Social Μενού που δημιουργήθηκε και θα περιγραφεί παρακάτω). Εικόνα 38. Function pty_enqueue() Η προσθήκη του αρχείου δεν έγινε με ένα απλό PHP include αλλά χρησιμοποιήθηκε η προτεινόμενη, από το Wordpress, μέθοδος με τη χρήση της έτοιμης function wp_enqueue_scripts η οποία περιγράφεται αναλυτικά στην τεκμηρίωση του (Plugin API/Action Reference/wp enqueue scripts Wordpress Codex, 2014). Function pty_social_menu() Για να προστεθεί το μενού με τα κουμπιά διαμοιρασμού (Facebook, Twitter, Google+) που βρίσκεται ακριβώς κάτω από τον τίτλο κάθε σελίδας του βιβλίου δημιουργήθηκε μια απλή function που περιέχει μόνο κώδικα html. Θα μπορούσε απλά να εγκατασταθεί ο κώδικας αυτός στο κατάλληλο σημείο του θέματος. Επιλέχθηκε όμως να συμπεριληφθεί στο πρόσθετο έτσι ώστε εάν στο μέλλον κάποιος θελήσει να τον αλλάξει να μπορεί να τον εντοπίσει εύκολα ή εάν αλλάξει το θέμα απλά να συμπεριλάβει την έξοδο της function στο σημείο της σελίδας που θέλει. 58

60 Εικόνα 39. Function pty_social_menu () Function pty_author_sxolia() Το Wordpress δεν επέτρεπε στους Author να διαχειρίζονται τα σχόλια, με αυτή τη λειτουργία δίνουμε σε όλους τους authors το δικαίωμα διαχείρισης σχολίων. Εικόνα 40. Function pty_author_sxolia() 4.9 Δυνατότητα του χρήστη για σχολιασμό του βιβλίου Μία από τις σημαντικότερες απαιτήσεις της συγκεκριμένης εργασίας είναι η δυνατότητα των σχολίων, στην οποία συμπεριλαμβάνεται ουσιαστικά η διαδραστικότητα μεταξύ χρήστη και διαχειριστή. Έτσι, συγκεντρώνοντας την προσοχή μας σε αυτή την διαδικασία, υλοποιήθηκε ένας συνδυασμός δυνατοτήτων ώστε ο χρήστης να παίρνει ένα σημαντικό ρόλο στην επίτευξη διαδραστικότητας και να πετυχαίνει την άμεση επαφή του με τον διαχειριστή και αυτός από μέρος του να αποτελεί τον δικό του σημαντικό ρόλο. Πριν ξεκινήσει η περιγραφή της λειτουργίας των σχολίων είναι σημαντικό να αναφερθεί ότι οι ρόλοι των διαχειριστών στα σχόλια είναι δύο, ο Author και ο Editor. Έχουν οριστεί τέσσερις Authors και για τα δύο βιβλία, οι οποίοι είναι υπεύθυνοι μόνο για τα κεφάλαια των βιβλίων καθώς και δύο Editors όπου ο καθένας είναι υπεύθυνος για κάθε βιβλίο γενικά, όπως φαίνεται και στην σχετική εικόνα παρακάτω (Εικόνα 41). 59