Κατασκευή Ιστοτόπου Σχολικής Μονάδας με τη βοήθεια έτοιμου προκατασκευασμένου προτύπου (Joomla)

Transcript

1 Πανεπιστημιακό Κέντρο Κεντρικής και Δυτικής Μακεδονίας «Εκπαίδευση Επιμορφωτών Β Επιπέδου» Επιμόρφωση Πληροφορικών Εργασία στο Γενικό Μέρος - Ενότητα 3 Υπεύθυνος Διδάσκων: Ι. Σαλονικίδης Κατασκευή Ιστοτόπου Σχολικής Μονάδας με τη βοήθεια έτοιμου προκατασκευασμένου προτύπου (Joomla) 1. Δημιουργία & Ενεργοποίηση της Βάσης Δεδομένων στο Π.Σ.Δ. 2. Ανάκτηση & Εγκατάσταση του Filezilla (Πρόγραμμα μεταφοράς αρχείων) 3. Μεταφορά έτοιμης προκατασκευασμένης ιστοσελίδας σχολικής μονάδας με Joomla στο Π.Σ.Δ. 4. Ρυθμίσεις στη βάση δεδομένων και στο περιβάλλον του διαχειριστή. Τροποποίηση και εμπλουτισμός της ιστοσελίδας Αθανάσιος Ευαγγέλου Πληροφορικής (ΠΕ19), H.M. & M.Y., Msc Θεσσαλονίκη Οκτώβριος 2011

2 Εισαγωγή Η εργασία αυτή έχει ως σκοπό την κατασκευή ιστοτόπου μιας σχολικής μονάδας βασισμένου σε ένα έτοιμο προκατασκευασμένο πρότυπο με τη βοήθεια της Joomla. Το πρότυπο κατασκευάστηκε με Joomla και δοκιμάστηκε στο Πανελλήνιο Σχολικό Δίκτυο. Η διαδικασία έχει «αυτοματοποιηθεί» αφού για την κατασκευή του ιστοτόπου χρειάζονται τρία αρχεία, το site.zip που περιέχει την προκατασκευασμένη ιστοσελίδα σχολικής μονάδας, τo MySQL_db1.sql.zip που περιέχει τη βάση δεδομένων και το configuration.zip που περιέχει το αρχείο configuration.php (τα αρχεία είναι διαθέσιμα στο Για τη μεταφορά του site.zip και του configuration.zip χρησιμοποιείται το Filezilla ενώ το ανέβασμα της βάσης MySQL_db1.sql.zip γίνεται μέσα από το περιβάλλον του Πανελλήνιου Σχολικού Δικτύου. Οι οδηγίες για την παραμετροποίηση του configuration.php αφορούν τη βάση δεδομένων και είναι απλές αφού μπορούμε να τις αντλήσουμε μέσα από τις ρυθμίσεις του λογαριασμούς μας στο Π.Σ.Δ. Επιγραμματικά η διαδικασία ολοκληρώνεται σε τέσσερα στάδια: 1. Μεταφορά του προκατασκευασμένου προτύπου (site.zip) στο χώρο της σχολικής μονάδας μας στο Π.Σ.Δ. 2. Μεταφορά του τροποποιημένου configuration.php σύμφωνα με τις προδιαγραφές του Π.Σ.Δ. στο χώρο της σχολικής μονάδας μας στο Π.Σ.Δ. 3. Εισαγωγή της βάσης δεδομένων (MySQL_db1.sql.zip) στον αντίστοιχο χώρο της σχολικής μονάδας μας στο Π.Σ.Δ. 4. Βασικές τροποποιήσεις παραμετροποιήσεις της αρχικής σελίδας Η τροποποίηση και ο εμπλουτισμός του ιστοτόπου γίνεται από το περιβάλλον διαχείρισης μέσα από ένα εξελληνισμένο περιβάλλον. Βασικές στοιχειώδες αλλαγές πρέπει να γίνουν στο password του διαχειριστή, στο όνομα και στο του ιστοτόπου, στο όνομα του ιστοτόπου για το συγκεκριμένο πρότυπο, στις επαφές. Το πλεονέκτημα της παραπάνω διαδικασία είναι ότι μπορεί να υλοποιηθεί και από μη έμπειρους χρήστες. Στη συνέχεια ο εμπλουτισμός του ιστοτόπου είναι σχετικά εύκολος χωρίς να χρειάζονται από τους χειριστές εξειδικευμένες γνώσεις. Στη συνέχεια με χρονική σειρά περιγράφονται αναλυτικά όλα τα βήματα.

3 Κατασκευή Ιστοτόπου Σχολικής Μονάδας με τη βοήθεια έτοιμου προτύπου 1. Δημιουργία & Ενεργοποίηση της Βάσης Δεδομένων στο Π.Σ.Δ. Προυπόθεση: Να έχει ενεργοποιηθεί ο προσωπικό σας λογαριασμός στο Π.Σ.Δ. και να σας έχει κοινοποιηθεί το Όνομα Χρήστη και ο Κωδικός Πρόσβασης Η παρακάτω διαδικασία γίνεται πάντα αν θέλουμε να εγκαταστήσουμε προγράμματα στο Π.Σ.Δ. όπως Moodle, Joomla, Drupal κ.α. που λειτουργούν με βάσεις δεδομένων. Βήμα 1 ο Επισκεφτείτε την ιστοσελίδα του Π.Σ.Δ.: και πατήστε Σύνδεση Βήμα 2 ο Εικόνα 1 Δώστε Όνομα Χρήστη και Κωδικό Πρόσβασης και πατήστε Σύνδεση Εικόνα 2

4 Βήμα 3 ο Πατήστε στην επιλογή MySch Εικόνα 3 Βήμα4 ο Πατήστε στην επιλογή Πίνακας Ελέγχου Εικόνα 4

5 Βήμα 5 ο Πληκτρολογήστε πάλι τον Κωδικό Πρόσβασης στο Π.Σ.Δ. και πατήστε Είσοδος Βήμα 6 ο Εικόνα 5 Πατήστε στην Επιλογή Ρυθμίσεις βάσης δεδομένων MySQL Εικόνα 6

6 Βήμα 7 ο Πατήστε Ανανέωση Κωδικού και Προσθήκη. Η βάση δεδομένων σας στο Π.Σ.Δ. δημιουργήθηκε. (Σημειώνουμε τα αντίστοιχα στοιχεία, Εξυπηρετητής, Όνομα Χρήστη, Κωδικός Πρόσβασης MySQL, Όνομα βάσης δεδομένων γιατί θα μας χρειαστούν παρακάτω). Εικόνα 7 Από την επιλογή Διαχείριση Βάσης μπορείτε να διαχειριστείτε πλήρως τη βάσης σας όπως απεικονίζεται στην παρακάτω εικόνα Εικόνα 8 Η διαδικασία ενεργοποίησης της βάσης δεδομένων ολοκληρώνεται πατώντας στην επιλογή OK ή Εφαρμογή, κατόπιν κάνουμε Αποσύνδεση από το Π.Σ.Δ.

7 Επιπλέον Στοιχεία Δικτυακού Τόπου Εικόνα 9 Εικόνα 10

8 2. Ανάκτηση & Εγκατάσταση του Filezilla (Πρόγραμμα μεταφοράς αρχείων) Βήμα 1 ο Από την ιστοσελίδα: κατεβάζουμε στον υπολογιστή μας την τελευταία έκδοση του Filezilla σε μορφή zip ανάλογα το λειτουργικό που έχουμε. Εικόνα 11 Βήμα 2 ο Εικόνα 12 Στη συνέχεια κάνουμε εγκατάσταση του Filezilla εκτελώντας το αρχείο που κατεβάσαμε όπως απεικονίζεται στις παρακάτω εικόνες

9 Εικόνα 13 Βήμα 3 ο Το περιβάλλον διαχείρισης του Filezilla φαίνεται στην παρακάτω εικόνα. Από αριστερά βλέπουμε τον προσωπικό μας υπολογιστή ενώ από δεξιά μπορούμε να δούμε τα αρχεία ενός απομακρυσμένου υπολογιστή (server) αφού πρώτα συνδεθούμε Εικόνα 14

10 3. Μεταφορά έτοιμης προκατασκευασμένης ιστοσελίδας σχολικής μονάδας με Joomla στο Π.Σ.Δ. Βήμα 1 ο Επισκεφτείτε τους παρακάτω ιστοσυνδέσμους και κατεβάστε στο PC σας τα αντίστοιχα αρχεία zip: Το site.zip περιέχει την προκατασκευασμένη ιστοσελίδα σχολικής μονάδας. To MySQL_db1.sql.zip περιέχει τη βάση δεδομένων. Το configuration.zip περιέχει το αρχείο configuration.php Βήμα 2 ο Αποσυμπιέστε τα αρχεία site.zip και configuration.zip στον ίδιο φάκελο στο σκληρό σας δίσκο Βήμα 3 ο Ανοίξτε το configuration.php με το Σημειωματάριο και τροποποιήστε τα στοιχεία που είναι επιλεγμένα στην παρακάτω εικόνα και αποθηκεύστε. Αναλυτικά Το Username και Password αναφέρεται στη βάση δεδομένων της σχολικής μονάδος στο ΠΣΔ που έχει ήδη ενεργοποιήθηκε. Αντίστοιχα στο Ονομα βάσης στο ΠΣΔ_db1 δηλώνουμε το πραγματικό όνομα της βάσης (Βλέπε 1. Εικόνα 10) ενώ στο username@sch.gr το της σχολικής μονάδας. Τη διαδρομή kas/1sek-kastor/sekkasto/ την αντικαθιστούμε με την αντίστοιχη όπως φαίνεται στην Εικόνα 10 στα επιπλέον στοιχεία του δικτυακού τόπου. Εικόνα 15

11 Βήμα 4 ο Μεταφορά των αποσυμπιεσμένων αρχείων στο Π.Σ.Δ. με τη βοήθεια του Filezilla Κάνουμε σύνδεση του Filezilla με το Π.Σ.Δ. όπως φαίνεται στα παρακάτω βήματα Βήμα 5 ο Εικόνα 16 Εικόνα 17

12 Βήμα 6 ο Στο πεδίο Κόμβος συμπληρώνουμε πάντα το users.sch.gr, στο Τύπος σύνδεσης επιλέγουμε Κανονική και για χρήστη και κωδικό πρόσβασης τα αντίστοιχα προσωπικά μας του Π.Σ.Δ. Εικόνα 18 Βήμα 7 ο Αφού συνδεθούμε δημιουργούμε από δεξιά με δεξί πάτημα του ποντικιού ένα φάκελο με ονόμα joomla Στο φάκελο joomla θα αντιγράψουμε τα αρχεία του joomla που αποσυμπιέσαμε στο σκληρό δίσκο όταν το ανακτήσαμε από το διαδίκτυο. Άρα μετά την ολοκλήρωση της εγκατάστασης ο ιστοσύνδεσμος του joomla θα είναι Στην περίπτωση που μεταφέραμε τα αρχεία εγκατάστασης εκτός φακέλου joomla (χύμα) τότε θα ήτανε Όπως απεικονίζεται στην παρακάτω εικόνα ανοίγουμε το φάκελο joomla από δεξιά και επιλέγουμε με Ctl+A όλα τα αρχεία του υποφακέλου που αποσυμπιέσαμε από αριστερά. Κατόπιν με σύρσιμο του ποντικιού μεταφέρουμε όλα τα αρχεία στο δεξί μέρος. Η διαδικασία μεταφοράς των αρχείων εγκατάστασης του joomla θα διαρκέσει ανάλογο χρόνο με την ταχύτητα σύνδεσης σας στο διαδίκτυο.

13 Εικόνα 19 Βήμα 8 ο Περιμένουμε να ολοκληρωθεί η μεταφορά των αρχείων Εικόνα 20 Ολοκληρώνεται η μεταφορά αρχείων όταν δεν υπάρχουν αρχεία σε λίστα αναμονής. Σε περίπτωση που κάποια αρχεία εμφανιστούν στις αποτυχημένες μεταφορές τότε στις αποτυχημένες μεταφορές κάνουμε δεξί κλικ > επαναφορά και κατόπιν στα αρχεία λίστας αναμονής δεξί κλικ >επεξεργασία λίστα αναμονής προκειμένου να μεταφερθούν όλα τα αρχεία Εικόνα 21

14 4. Ρυθμίσεις στη βάση δεδομένων και στο περιβάλλον του διαχειριστή. Τροποποίηση και εμπλουτισμός της ιστοσελίδας 4.1 Μεταφορά της βάσης δεδομένων MySQL_db1.sql.zip στο ΠΣΔ Βήμα 1 ο Κάνουμε σύνδεση στο ΠΣΔ όπως περιγράφτηκε στην ενότητα 1 και στην παρακάτω εικόνα επιλέγουμε Διαχείριση Βάσης Εικόνα 22 Επιλέγουμε την αντίστοιχη βάση δεδομένων που ενεργοποιήσαμε (Ονομα βάσης στο ΠΣΔ_db1) Εικόνα 23

15 Επιλέγουμε Import (Εισαγωγή) Εικόνα 24 Φορτώνουμε τη βάση MySQL_db1.sql.zip όπως απεικονίζεται στα παρακάτω βήματα (εικόνα 25) Εικόνα 25

16 Η διαδικασία εισαγωγής της βάσης δεδομένων ολοκληρώθηκε όπως απεικονίζεται παρακάτω Εικόνα 26

17 4.2 Πρώτη επαφή με τη Αρχική Σελίδα. Το Περιβάλλον του διαχειριστή. Τροποποίηση και εμπλουτισμός της ιστοσελίδας Ανοίγουμε τον φυλλομετρητή μας και πληκτρολογούμε τη διεύθυνση της σχολικής μας μονάδας (π.χ. η ιστοσελίδα με το ενδεικτικό περιεχόμενο απεικονίζεται παρακάτω στην παρακάτω εικόνα: Εικόνα 27

18 Πρώτη επαφή Ο εμπλουτισμός της ιστοσελίδας γίνεται με σύνδεση από την αρχική σελίδα με Όνομα Χρήστη: admin και Κωδικός Μετά τη Σύνδεση εμφανίζεται ένα επιπλέον μενού: Επιλογές Χρηστών. Από την επιλογή Υποβολή Άρθρου μπορούμε να ανεβάσουμε άρθρα ανακοινώσεις εικόνες σε συγκεκριμένες κατηγορίες, ημερομηνία δημοσίευσης ή παύσης της δημοσίευσης, ποιοι θα το βλέπουν κ.α. Εικόνα 28

19 Τροποποίηση και εμπλουτισμός της ιστοσελίδας Από τον ιστοσύνδεσμο μπορούμε να συνδεθούμε στο περιβάλλον διαχείρισης του administrator Εικόνα 29 Το περιβάλλον διαχείρισης του administrator εξελληνισμένο απεικονίζεται παρακάτω Εικόνα 30

20 Υποχρεωτικές ρυθμίσεις- αλλαγές Αλλαγή Κωδικού πρόσβασης administrator Μενού Ιστότοπος >Το προφίλ μου Μπορούμε να αλλάξουμε τον κωδικό πρόσβασης του administrator και να δηλώσουμε το της σχολικής μας μονάδας Εικόνα 31 Ονομασία Ιστοτόπου και άλλες ρυθμίσεις Mενού Ιστότοπος > Γενικές Ρυθμίσεις Επιλογή Ιστότοπος: Συμπληρώνουμε την Ονομασία Ιστοτόπου (συνήθως το όνομα της σχολικής μας μονάδας) Εικόνα 32

21 Επιλογή Διακομιστής: Συμπληρώνουμε το και τον αποστολέα (συνήθως της σχολικής μας μονάδας) Αλλαγή Προτύπου (αρχική σελίδα) Μενού Επεκτάσεις > Επιλογή Προτύπου Εικόνα 33 Εικόνα 34

22 Αλλαγή τίτλου και περιγραφή ιστοτόπου (όνομα σχολικής μονάδας και διεύθυνσης εκπαίδευσης) Διαχείριση Επαφών Μενού Εφαρμογές > Επαφές > Επαφές Εικόνα 35 Συμπληρώνουμε τα απαραίτητα πεδία με τα πραγματικά στοιχεία της σχολικής μας μονάδας, όπως , διεύθυνση, πόλη, τηλέφωνα κ.α. Εικόνα 36

23 Επιπλέον ρυθμίσεις Αλλαγή της διεύθυνσης του Blog του σχολείου μας: πχ. (Προϋπόθεση: Να έχουμε ενεργοποιήσει το blog της σχολικής μας μονάδας από το ΠΣΔ και συγκεκριμένα από την διεύθυνση: δίνοντας το username και password του ΠΣΔ) Εικόνα 37 Εμπλουτισμένος Κειμενόγραφος Εικόνα 38 Από το Μενού Επεκτάσεις > Διαχείριση Πρόσθετων > Κειμενογράφος TinyMCE στις Βασικές Επιλογές ρυθμίζουμε τον τρόπο λειτουργίας σε Εκτεταμένο Εικόνα 39

24 Εγκατάσταση Επεκτάσεων Από το Μενού Επεκτάσεις > Εγκατάσταση μπορούμε να εγκαταστήσουμε διάφορα πακέτα (πρότυπα, πρόσθετα, επεκτάσεις κ.α) που υποστηρίζει η Joomla. Ενδεικτικά μπορούμε να εγκαταστήσουμε τη δυνατότητα επίσυναψης αρχείων (attacment) Κατεβάζουμε από την διεύθυνση το αντίστοιχο αρχείο zip στο σκληρό μας δίσκο (Δεν χρειάζεται αποσυμπίεση) Όπως απεικονίζεται στην παρακάτω εικόνα πατάμε Αναζήτηση και επιλέγουμε το αντιστοιχο αρχείο attachments zip, στη συνέχεια πατάμε Μεταφόρτωση & Εγκατάσταση, αφού ολοκληρωθεί η διαδικασία θα μας εμφανίσει ανάλογο μήνυμα ότι η δυνατότητα επισύναψης αρχείων εγκαταστάθηκε. Εικόνα 40

25 Ενδεικτική εφαρμογή της παραπάνω διαδικασίας σε σχολικές μονάδες του Ν. Καστοριάς ΔΕΥΤΕΡΟΒΑΘΜΙΑ ΕΚΠΑΙΔΕΥΣΗ Γυμνάσιο Μανιάκων ΣΕΚ Καστοριάς Γυμνάσιο Βογατσικού 2 ο Γυμνάσιο Άργους Ορεστικού Γυμνάσιο Νεστορίου 1 ο Γενικό Λύκειο Καστοριάς 3 ο Γενικό Λύκειο Καστοριάς Γενικό Λύκειο Άργους Ορεστικού Γενικό Λύκειο Μεσοποταμίας Γυμνάσιο Μεσοποταμίας 2 ο Γυμνάσιο Καστοριάς 3 ο Γυμνάσιο Καστοριάς 4 ο Γυμνάσιο Καστοριάς Γυμνάσιο Οινόης Γυμνάσιο Κορησού ΕΠΑΛ Άργους Ορεστικού ΕΕΕΕΚ Αργους Ορεστικού Οι παρακάτω ιστοσελίδες ενημερώνονται και εμπλουτίζονται ήδη από τις σχολικές μονάδες 2 ο Γενικό Λύκειο Καστοριάς Γενικό Λύκειο Νεστορίου Γυμνάσιο Πενταβρύσου Γυμνάσιο Μαυροχωρίου 1 ο Γυμνάσιο Άργους Ορεστικού ΠΡΩΤΟΒΑΘΜΙΑ ΕΚΠΑΙΔΕΥΣΗ 5 ο Δημοτικό Καστοριάς Δημοτικό Κωσταραζίου Δημοτικό Κολοκυνθούς

26 Πηγές - Χρήσιμες Ιστοσελίδες