MENOY
ΣΧΕΔΙΑΣΜΟΣ ΙΣΤΟΤΟΠΩΝ
Βήματα Δημιουργίας Σχολικού Ιστοτόπου


BHMA 4o: Εισαγωγή περιεχομένου στις σελίδες

Για την εισαγωγή περιεχομένου στις σελίδες, επιλέγετε την ετικέτα «Pages/Edit Page» και με τη βοήθεια της εργαλειοθήκης (toolbar) που φαίνεται πιο κάτω, μπορείτε να εισάγετε και να επεξεργαστείτε κείμενο, φωτογραφίες ή άλλο υλικό που επιθυμείτε να παρουσιάζεται στη σελίδα.



Σημείωση: Για κάθε νέα προσθήκη, αλλαγή ή τροποποίηση, πατήστε «Save updates» για αποθήκευση.

4.1. Εισαγωγή Κειμένου:

Get Simple (8) Εισαγωγή περιεχομένουΓια να εισάγετε κείμενο, πληκτρολογείτε το κείμενο στον κενό χώρο κάτω από την εργαλειοθήκη και το μορφοποιείτε χρησιμοποιώντας τις επιλογές «Formatting Styles», «Paragraph Format», «Font Name» και «Font Size». Όταν ολοκληρώσετε την εισαγωγή κειμένου, πατήστε «Save updates».

4.2. Εισαγωγή Πίνακα:
Get Simple (8) Εισαγωγή περιεχομένουΓια να εισάγετε πίνακα, επιλέξτε το εικονίδιο και από το αναδυόμενο παράθυρο στην ετικέτα «Table Properties» επιλέξτε τον αριθμό των γραμμών (rows) και των στηλών (columns), καθώς και το μέγεθος του περιγράμματος του πίνακα (border). Όταν ολοκληρώσετε την εισαγωγή πίνακα, πατήστε «Save updates».



Get Simple (16) Οδηγίες Χρήσης του Word to Clean HTMLΣημείωση: Σε περίπτωση που έχετε έτοιμο πίνακα με περιεχόμενο σε αρχείο Word (.doc, .docx) ή σε excel (.xls, .xlsx) και επιθυμείτε να τον εισάγετε σε μια σελίδα, μπορείτε να χρησιμοποιήσετε ένα πρόγραμμα μετατροπής σε κώδικα html. Ένα τέτοιο δωρεάν πρόγραμμα υπάρχει διαθέσιμο διαδικτυακά και μπορείτε να το χρησιμοποιήσετε αντιγράφοντας και επικολλώντας το περιεχόμενο του αρχείου word (.doc, .docx) ή excel (.xls, .xlsx) στο παράθυρο «Paste your document here» του διαδικτυακού προγράμματος μετατροπής σε κώδικα html. Το πρόγραμμα θα κάνει την μετατροπή σε κώδικα html και εσείς θα πρέπει να αντιγράψετε τον κώδικα από το παράθυρο "Source" και να τον επικολλήσετε στη σελίδα που επιθυμείτε να εισάγετε τον πίνακα στον ιστότοπό σας.
Σχετική βιντεοπαρουσίαση υπάρχει στην ιστοσελίδα "Βοηθήματα για ιστοτόπους".

4.3. Εισαγωγή Φωτογραφίας:
Get Simple (8) Εισαγωγή περιεχομένουΓια να εισάγετε φωτογραφία, επιλέξτε το εικονίδιο και από το αναδυόμενο παράθυρο, στην ετικέτα «Image Info», επιλέξτε «Browse Server» για να εντοπίσετε τη φωτογραφία που θα εισάγετε. Στο παράθυρο «Uploaded Files», επιλέγετε τον φάκελο που έχετε φυλάξει τις φωτογραφίες σας (π.χ. fotografies ή photos) και στη συνέχεια τη φωτογραφία προς σύνδεση. Κάνοντας διπλό κλικ στη φωτογραφία, μπορείτε να δώσετε ρυθμίσεις σχετικά με τις διαστάσεις της (πλάτος, ύψος) και τη θέση της (alignment) φωτογραφίας. Όταν ολοκληρώσετε την εισαγωγή φωτογραφίας, πατήστε «Save updates» για αποθήκευση.



Σημειώσεις:
  • Get Simple (17) Μείωση μεγέθους φωτογραφιών με το Light Image ResizerΚατά την προετοιμασία του υλικού, θα πρέπει να έχετε μειώσει το μέγεθος των φωτογραφιώνσας σε περίπου 800 Χ 600 pixels πριν τις ανεβάσετε στον ιστοχώρο. Ένα δωρεάν πρόγραμμα μείωσης του μεγέθους των φωτογραφιών είναι το Light Image Resizer, το οποίο μπορείτε να κατεβάσετε από τη σελίδα "Χρήσιμα Λογισμικά".
    Μπορείτε να συμβουλευθείτε τη σχετική βιντεοπαρουσίαση στη ιστοσελίδα "Βοηθήματα για ιστοτόπους".
  • Θα πρέπει να έχετε φυλάξει τις φωτογραφίες σε ξεχωριστό φάκελο «photos» ή «fotografies», ενώ όλες τις εικόνες σε ξεχωριστό φάκελο «images».
  • Εννοείται ότι θα πρέπει να έχετε ήδη ανεβάσει τις φωτογραφίες σας στον ιστοχώρο είτε μέσω του Get Simple ή του FTP (βλ. σημείο 4.4), για να μπορέσετε να τις συνδέσετε σε κάποια σελίδα.

4.4. Εισαγωγή Συνδέσμου:

Get Simple (10) Τροποποίηση Sidebar και SplashΓια να συνδέσετε μια λέξη/φράση/φωτογραφία με αρχείο/εικόνα/ιστοτόπο, επιλέγετε τη λέξη/φράση/φωτογραφία και στη συνέχεια το εικονίδιο «Link» .
Στο παράθυρο που εμφανίζεται, στην ετικέτα «Link Info», επιλέγω τον αντίστοιχο τύπο συνδέσμου («Link Type»).


  • Για σύνδεση με αρχεία, στο πεδίο «Link Type» επιλέγετε «URL» και «Browse server». Από το παράθυρο «Uploaded files» που παρουσιάζεται, επιλέγετε το φάκελο (folder) όπου έχετε φυλάξει τα αρχεία σας και στη συνέχεια το αρχείο προς σύνδεση. Για να ανοίγει το αρχείο σε νέο παράθυρο, επιλέξτε την ετικέτα «Target» και στο πεδίο «Target», επιλέξτε «New Window (_blank)». Τέλος, πατήστε «ΟΚ».



  • Για σύνδεση με σελίδα που δημιουργήσατε, στο πεδίο «Link Type» επιλέγετε από το αναδυόμενο μενού «Link to local page» και στο πεδίο «Select Page» επιλέγετε τη σελίδα που θα γίνει η σύνδεση. Τέλος, πατήστε «ΟΚ».



  • Για σύνδεση με ιστότοπο/ιστοσελίδα στο διαδίκτυο, στο πεδίο «Link Type», επιλέγετε URL και στο πεδίο «URL» εισάγετε την ηλεκτρονική διεύθυνση (URL) της ιστοσελίδας στο διαδίκτυο. Για να ανοίγει η ιστοσελίδα σε νέο παράθυρο, επιλέξτε την ετικέτα «Target» και στο πεδίο «Target», επιλέξτε «New Window (_blank)».



  • Για σύνδεση με ηλεκτρονικό ταχυδρομείο, στο πεδίο «Link Type», επιλέγετε «Email» και στο πεδίο «Email Address» εισάγετε το email που θέλετε να γίνει η σύνδεση.



Όταν ολοκληρώσετε την εισαγωγή συνδέσμων, πατήστε «Save updates» για αποθήκευση.

4.5. Προεπισκόπηση σελίδων: Για προεπισκόπηση των σελίδων κάθε φορά που κάνετε κάποια αλλαγή ή/και προσθήκη, επιλέγετε «View».



4.6. Τροποποίηση component sidebar και splashes:
Get Simple (10) Τροποποίηση Sidebar και SplashΤα περισσότερα Πρότυπα ιστότοπου που παρέχονται από την Υπηρεσία περιλαμβάνουν πλαϊνό μενού (sidebar), το οποίο μπορείτε να επεξεργαστείτε. Επιλέγοντας την ετικέτα «Theme», εμφανίζεται η σελίδα «Edit Components» όπου μπορείτε να επεξεργαστείτε τα components «sidebar», «splashes» και άλλα τροποποιώντας ή/και εισάγοντας τον σωστό κώδικα στο αντίστοιχο παράθυρο.



  • Για εισαγωγή συνδέσμου σε σελίδα εντός του ιστότοπου του σχολείου, μπορείτε να αντιγράψετε και να επικολλήσετε μέρος του κώδικα που παρέχεται στο sidebar και να κάνετε τις απαραίτητες τροποποίησεις.

    Π.χ. Για προσθήκη νέου συνδέσμου (στο sidebar) στη σελίδα «Σύνδεσμος Γονέων» (εντός του ιστότοπου του σχολείου), ο κώδικας που πρέπει να εισάγετε είναι ο εξής (τον αντιγράφετε από προϋπάρχον κώδικα του sidebar και τον επικολλάτε εκεί που θέλετε να παρουσιάζεται):

    <a href="index.php?id="syndesmos_goneon">Σύνδεσμος Γονέων </a>

    Σημείωση: Το μέρος με έντονα γράμματα αλλάζει ανάλογα με τον τίτλο και το URL της σελίδας που θέλετε να συνδέσετε.

  • Για εισαγωγή συνδέσμου σε ιστότοπο/ιστοσελίδα στο Διαδίκτου, ακολουθείτε τις ίδιες οδηγίες με πιο πάνω, αλλά ανάμεσα στα εισαγωγικά “ ” θα πρέπει να εισάγετε την ηλεκτρονική διεύθυνση (URL) της/του ιστοσελίδας/ιστοτόπου που θέλετε.
    Στην περίπτωση αυτή ο κώδικας θα είναι:


    <a href="http://www.syndesmos_goneon.org/index.html" target="_blank">Σύνδεσμος Γονέων</a>

  • Σημείωση: Ο κώδικας target=”_blank” δηλώνει ότι η σελίδα θα ανοίγει σε νέο παράθυρο.
  • Για εισαγωγή κειμένου, απλά πληκτρολογείτε το κείμενό σας στον κενό χώρο.
  • Αφού κάνετε τις απαραίτητες αλλαγές πατήστε «Save Components».

ΕΠΟΜΕΝΟ ΒΗΜΑ

Υπουργείο Παιδείας, Πολιτισμού, Aθλητισμού και Νεολαίας - Υπηρεσία Διαδικτύου και Επικοινωνίας