Κατασκευή ιστοσελίδας WordPress

Κατασκευή ιστοσελίδας WordPress

Παρουσίαση του μενού του επεξεργαστή κειμένου gutenberg του wordpress που αποτελεί το νέο περιβάλλον κατασκευής ιστοσελίδας με την χρήση wordpress

ΓΝΩΡΙΖΟΝΤΑΣ ΤΟ ΜΕΝΟΥ ΤΟΥ ΕΠΕΞΕΡΓΑΣΤΗ ΚΕΙΜΕΝΟΥ GUTENBERG

Ας εμβαθύνουμε στον Επεξεργαστή Κειμένου Gutenberg ξεκινώντας με την παρουσίαση των επιλογών του μενού στο πάνω μέρος (top menu).

Κατασκευή ιστοσελίδας wordpress

ΟΙ 10 ΕΠΙΛΟΓΕΣ ΤΟΥ ΜΕΝΟΥ

1.  Προσθήκη μπλοκ

Η επιλογή για προσθήκη μπλοκ είναι το σημείο, στο οποίο θα βρείτε τη συλλογή από Μπλοκ και Ενσωματώσεις του Gutenberg, για προσθήκη στα Άρθρα και τις Σελίδες. Μπορείτε να χρησιμοποιήσετε την μπάρα αναζήτησης, είτε να περιηγηθείτε στις διαθέσιμες επιλογές της οθόνης.

Οι επιλογές για τα «Περισσότερο χρησιμοποιούμενα» μπλοκ περιλαμβάνουν:

Παράγραφος, Επικεφαλίδα, Παράθεμα, Εικόνα, Συλλογή, Ήχος, Λίστα, Εξώφυλλο.

2.  Αναίρεση

Μπορείτε να αναιρέσετε την πιο πρόσφατη αλλαγή που κάνατε.

3.  Επανάληψη

Μπορείτε να επαναφέρετε την πιο πρόσφατη αλλαγή που αναιρέσατε.

4.  Δομή περιεχομένου

Η επιλογή της Δομής περιεχομένου σας παρέχει μια σύντομη επισκόπηση του περιεχομένου στην τρέχουσα Σελίδα ή τρέχον Άρθρο του WordPress, συμπεριλαμβανομένων της καταμέτρησης λέξεων, τον αριθμό των κεφαλίδων, τις παραγράφους και τον αριθμό των μπλοκ.

Μπορείτε επίσης να δείτε το περίγραμμα του Εγγράφου, το οποίο είναι εξαιρετικά χρήσιμο στην περίπτωση που θέλετε να δείτε πώς είναι δομημένο με κεφαλίδες το Άρθρο ή η Σελίδα στο WordPress.

Οι κεφαλίδες (h1, h2, h3, h4, h5, h6) είναι ιδανικός τρόπος για να κατανομήσετε το περιεχόμενό σας σε ενότητες, προσφέροντας στους αναγνώστες έναν φιλικότερο τρόπο περιήγησης στην πληροφορία. Οι κεφαλίδες είναι επίσης σημαντικές και για την βελτιστοποίηση της κατάταξης στις μηχανές αναζήτησης (SEO).  Επίσης, οι μηχανές αναζήτησης χρησιμοποιούν τις κεφαλίδες για καλύτερη ταξινόμηση του περιεχομένου σας, οπότε να τις χρησιμοποιείτε συνετά.

5.  Πλοήγηση μπλοκ

Η επιλογή της πλοήγησης μπλοκ, σας επιτρέπει την γρήγορη εναλλαγή μεταξύ των μπλοκ του Gutenberg στο Άρθρο ή τη Σελίδα σας στο WordPress.

6.  Αποθήκευση

Ο σύνδεσμος της Αποθήκευσης, είναι ο τρόπος με τον οποίο μπορείτε να αποθηκεύσετε την τρέχουσα έκδοση του προσχεδίου σας. Να σημειωθεί ότι ο Επεξεργαστής Κειμένου Gutenberg του WordPress θα αποθηκεύει συνεχώς και αυτομάτως την πρόοδο της εργασίας σας, οπότε ενδέχεται να μην χρησιμοποιείτε τόσο συχνά το κουμπί της Αποθήκευσης.

7.  Προεπισκόπηση

Το κουμπί Προεπισκόπησης σας παρέχει μια εικόνα του πως θα μοιάζει η Σελίδα ή το Άρθρο σας όταν θα δημοσιευθεί.

8.  Δημοσίευση

Πατώντας το κουμπί της Δημοσίευσης, σας δίνεται η δυνατότητα να δημοσιεύσετε το Άρθρο ή τη Σελίδα σας στο κοινό.

9.  Ρυθμίσεις

Το σύμβολο του γραναζιού των Ρυθμίσεων (απ)ενεργοποιεί το μενού των ρυθμίσεων, το οποίο εντοπίζουμε στην δεξιά πλευρά της οθόνης.

10.              Εμφάνιση περισσότερων εργαλείων και επιλογών

Πατήστε στο εικονίδιο με τις τρεις κάθετες τελείες, για να εμφανιστεί το μενού των Περισσότερων εργαλείων και επιλογών.

Σε αυτό το μενού μπορείτε να βρείτε επιπρόσθετες επιλογές σχετικά με τον Επεξεργαστή Κειμένου Gutenberg, συμπεριλαμβανομένων της Προβολής, του Διορθωτή και των Εργαλείων.

Η Προβολή περιλαμβάνει την Επάνω Γραμμή Εργαλείων, την Κατάσταση Επισήμανσης και Λειτουργία πλήρους οθόνης.

• Η Επάνω Γραμμή Εργαλείων σας επιτρέπει την πρόσβαση σε όλα τα μπλοκ και τα εργαλεία εγγράφου, συγκεντρώνοντας τα σε ένα κοινό σημείο.

• Η Κατάσταση Επισήμανσης σας επιτρέπει να συγκεντρωθείτε σε ένα μπλοκ την φορά.

• Η Λειτουργία πλήρους οθόνης σας επιτρέπει να εργάζεστε χωρίς περισπασμούς, αφαιρώντας τα λιγότερο απαραίτητα μενού.

 Μπορείτε επίσης να εναλλάσσετε τον Επεξεργαστή WYSIWYG και τον Διορθωτή Κώδικα από την ενότητα του Διορθωτή.

Η εναλλαγή μεταξύ των δύο αυτών τρόπων προβολής μπορεί να φανεί πολύ χρήσιμη σε πιο προχωρημένους χρήστες, εάν επιθυμείτε να δείτε τον τρέχοντα κώδικα που παράγεται από το περιεχόμενο.

Στην ενότητα των Εργαλείων, μπορείτε να διαχειριστείτε όλα τα επαναχρησιμοποιήσιμα Μπλοκ, να διαμορφώσετε τις Συντομεύσεις Πληκτρολογίου και να προβείτε στην Αντιγραφή όλου του περιεχομένου.

Κατασκευή ιστοσελίδας wordpress

ΡΥΘΜΙΣΕΙΣ ΕΓΓΡΑΦΟΥ

 Το WordPress 5.0 παρουσιάζει τις νέες Ρυθμίσεις Εγγράφου, οι οποίες προηγούμενα ήταν οργανωμένες στο σημείο όπου βρισκόταν το κουμπί της Δημοσίευσης στην οθόνη επεξεργασίας της Σελίδας ή του Άρθρου. Παρακάτω θα δείτε 9 διαφορετικές επιλογές μορφοποίησης του «Εγγράφου» σας, ή του περιεχομένου της Σελίδας ή του Άρθρου στο WordPress.

ΟΙ 9 ΡΥΘΜΙΣΕΙΣ ΕΓΓΡΑΦΟΥ

1.  Έγγραφο

Αυτή η καρτέλα αλλάζει το μενού στη δεξιά πλευρά της οθόνης, ώστε να εμφανίζει τις Ρυθμίσεις Εγγράφου.

2.  Πλαίσιο

Αλλάζει την καρτέλα στη δεξιά πλευρά της οθόνης, ώστε να εμφανίζει τις ρυθμίσεις Πλαισίου.

3.  Κατάσταση & ορατότητα

Η ενότητα Κατάσταση & ορατότητα παρέχει μια σφαιρική εικόνα της τρέχουσας κατάστασης της Σελίδας ή του Άρθρου.

Ορατότητα : Η επιλογή Ορατότητα άρθρου σας επιτρέπει να επιλέξετε ποιος μπορεί να δει ένα άρθρο ή μία σελίδα στο WordPress άπαξ και δημοσιευθεί. Μπορείτε να επιλέξετε ανάμεσα στα Δημόσιο, Απόρρητο και Έχει συνθηματικό.

Δημοσίευση : Μπορείτε να χρησιμοποιήσετε την επιλογή Δημοσίευση για να προγραμματίσετε την αυτοματοποιημένη δημοσίευση του άρθρου σας. Για να προγραμματίσετε ένα άρθρο, επιλέξτε την ημερομηνία και την ακριβή ώρα που επιθυμείτε να δημοσιευθεί το νέο άρθρο ή σελίδα σας.

Μορφή άρθρου : Ο σύνδεσμος Μορφή άρθρου σας επιτρέπει να επιλέξετε τη μορφοποίηση του άρθρου σας, συμπεριλαμβανομένων των Συλλογή, Σύνδεσμος, Εικόνα, Παράθεμα, Κανονικό, Βίντεο, Ήχος.

Μόνιμα στην Πρώτη Σελίδα : Επιλέξτε αυτό το κουτί, για να δημιουργηθεί ένας σύνδεσμος στην Αρχική σελίδα, ο οποίος θα ανακατευθύνει στο άρθρο.

Για έλεγχο : Επιλέξτε Για έλεγχο και αποθηκεύστε το άρθρο σας, για να το θέσετε σε κατάσταση αναμονής.

4.  Κατηγορίες

Επιλέξτε μία από τις τρέχουσες Κατηγορίες ή δημιουργήστε μία νέα για το άρθρο σας.

5.  Ετικέτες

Επιλέξτε μία από τις τρέχουσες Ετικέτες ή δημιουργήστε μία νέα για το άρθρο σας.

6.  Χαρακτηριστική εικόνα

Προσθέστε μία Χαρακτηριστική εικόνα στο άρθρο σας.

7.  Απόσπασμα

Δημιουργήστε προαιρετικά μία περίληψη ή σύντομη περιγραφή για το άρθρο σας με την επιλογή του WordPress Απόσπασμα.

8.  Συζήτηση

απόσπασμα του περιεχομένου.

9.  Layout

Κατασκευή ιστοσελίδας wordpress

ΕΠΙΛΟΓΕΣ BLOCK (ΠΛΑΙΣΙΟΥ) ΤΟΥ GUTENBERG

 Οι επιλογές Πλαισίου στη δεξιά πλευρά της οθόνης σας προσφέρουν διάφορες επιλογές για μορφοποίηση των μπλοκ που έχετε χρησιμοποιήσει. Πρώτα θα χρειαστεί να επιλέξετε το μπλοκ του Gutenberg που επιθυμείτε να μορφοποιήσετε. Οι Ρυθμίσεις Πλαισίου σας επιτρέπουν να προσαρμόσετε κάθε μπλοκ ανεξάρτητα από τα υπόλοιπα.

Καθώς επιλέγετε ένα μπλοκ του Gutenberg, οι επιλογές στο συγκεκριμένο πάνελ αλλάζουν. Η πλειοψηφία των επιλογών μπλοκ του Gutenberg σχετίζονται με την μορφοποίηση και το στυλ. Οι ρυθμίσεις των προσαρμογών που διατίθενται διαφέρουν ανά τύπο μπλοκ, ωστόσο μπορείτε να δείτε ότι υπάρχει πλειάδα επιλογών για να εφαρμόσεις τα διάφορα στυλ, καθώς και περαιτέρω ρυθμίσεις στο μπλοκ.

Μπορείτε να ελέγξετε το αν θα μπορούν να σχολιάζουν στο άρθρο ή την σελίδα σας στο WordPress οι εκάστοτε χρήστες. Μπορείτε επίσης να επιλέξετε εάν θα επιτρέπονται τα Pingbacks & Trackbacks.

Τα Pingbacks & Trackbacks είναι μέθοδοι που χρησιμοποιούνται για να ειδοποιούνται τα Blogs ότι έχετε διασυνδεθεί μαζί τους, όυτως ώστε να παρέχουν ένα τύπο «απομακρυσμένου» συστήματος σχολιασμού.

Ένα Pingback είναι τύπος σχολίου που δημιουργείται όταν διασυνδέεστε με ένα άλλο άρθρο σε Blog, όπου τα pingbacks είναι ενεργοποιημένα.

Τα Trackbacks είναι ένας τρόπος να ειδοποιήσετε παλαιότερου συστήματος Blogs ότι έχετε διασυνδεθεί μαζί τους. Τα Trackbacks πρέπει να δημιουργηθούν χειροκίνητα, και να στείλετε ένα απόσπασμα του περιεχομένου.

9.  Layout

Κατασκευή ιστοσελίδας wordpress

ΕΠΙΛΟΓΕΣ BLOCK (ΠΛΑΙΣΙΟΥ) ΤΟΥ GUTENBERG

 Οι επιλογές Πλαισίου στη δεξιά πλευρά της οθόνης σας προσφέρουν διάφορες επιλογές για μορφοποίηση των μπλοκ που έχετε χρησιμοποιήσει. Πρώτα θα χρειαστεί να επιλέξετε το μπλοκ του Gutenberg που επιθυμείτε να μορφοποιήσετε. Οι Ρυθμίσεις Πλαισίου σας επιτρέπουν να προσαρμόσετε κάθε μπλοκ ανεξάρτητα από τα υπόλοιπα.

Καθώς επιλέγετε ένα μπλοκ του Gutenberg, οι επιλογές στο συγκεκριμένο πάνελ αλλάζουν. Η πλειοψηφία των επιλογών μπλοκ του Gutenberg σχετίζονται με την μορφοποίηση και το στυλ. Οι ρυθμίσεις των προσαρμογών που διατίθενται διαφέρουν ανά τύπο μπλοκ, ωστόσο μπορείτε να δείτε ότι υπάρχει πλειάδα επιλογών για να εφαρμόσεις τα διάφορα στυλ, καθώς και περαιτέρω ρυθμίσεις στο μπλοκ.

Προχωρημένες επιλογές Μπλοκ (Πλαισίου) στον Gutenberg

Οι προχωρημένες επιλογές σας επιτρέπουν να προσθέσετε ένα επιπλέον CSS class στο επιλεγμένο μπλοκ.

Αλλαγή τύπου Μπλοκ

Κάθε μπλοκ έχει μία επιλογή για αλλαγή του τύπου μπλοκ. Κλικάροντας σε ένα μπλοκ που έχετε προσθέσει και μετά οδηγώντας τον κέρσορα πάνω στο εικονίδιο στα αριστερά, μπορείτε να αλλάξετε τον τρέχοντα τύπο Μπλοκ σε ένα από τα προ-επιλεγμένα μπλοκ που σου παρέχονται.

Επεξεργασία του τρέχοντος Μπλοκ

Μπορείτε να χρησιμοποιήσετε την επιλογή για αλλαγή του τύπο του μπλοκ. Θα έχετε διάφορες επιλογές σύντομης επεξεργασίας αναλόγως του τύπου του μπλοκ που έχετε επιλέξει.

Παίρνουμε μια πρώτη εικόνα μέχρι στιγμής από τις αυξημένες δυνατότητες που παρέχει στον σχεδιασμό ιστοσελίδων το wordpress μέσω της υιοθέτησης του GutenBerg. Σίγουρα όμως οι δυνατότητες που παρέχει σε ένα web designer δεν σταματούν εκεί.

ΠΕΡΙΣΣΟΤΕΡΕΣ ΕΠΙΛΟΓΕΣ ΤΟΥ GUTENBERG

Κάθε Μπλοκ του Gutenberg περιέχει επιπρόσθετες επιλογές, τις οποίες μπορείτε να ανακαλύψετε κλικάροντας το εικονίδιο στην πάνω δεξιά πλευρά του μενού του Μπλοκ.

Αυτές οι επιπλέον επιλογές περιλαμβάνουν:

1.  Εμφάνιση Ρυθμίσεων Μπλοκ

Αυτή η επιλογή σας επιτρέπει να εναλλάσσετε μεταξύ της εμφάνισης και της απόκρυψης τις Ρυθμίσεις Μπλοκ που εντοπίζουμε στο δεξί sidebar. Είναι εξαιρετικά χρήσιμη επιλογή εάν θέλετε να βάλετε μία τάξη στην οθόνη επεξεργασίας.

2.  Δημιουργία αντιγράφου

Αυτή η επιλογή προσφέρεται για τη δημιουργία ενός αντιγράφου το τρέχοντος μπλοκ, το οποίο επεξεργάζεστε.

3.  Εισαγωγή πριν

Με αυτόν τον τρόπο μπορείτε να εισάγετε ένα νέο μπλοκ πάνω από το τρέχον επιλεγμένο μπλοκ.

4.  Εισαγωγή μετά

Με αυτόν τον τρόπο μπορείτε να εισάγετε ένα νέο μπλοκ κάτω από το τρέχον επιλεγμένο μπλοκ.

5.  Επεξεργασία ως HTML / Τροποποιήστε οπτικά

Αυτή η επιλογή σας επιτρέπει να εναλλάσσετε τις όψεις επεξεργασίας, είτε επιλέγοντας το HTML είτε την Οπτική επεξεργασία. Το να επιλέξετε Επεξεργασία ως HTML μπορεί να σας φανεί ιδιαίτερα χρήσιμο, εάν επιθυμείτε να δείτε ή να τροποποιήσετε το προϊόν του HTML κώδικα, όπως τα div classes ή τα inline styles που έχουν εφαρμοστεί στο μπλοκ. Η επαναφορά της επιλογής Τροποποιήστε οπτικά θα σας οδηγήσει στην προεπιλεγμένη οθόνη επεξεργασίας.

6.  Προσθέστε στα Επαναχρησιμοποιήσιμα Μπλοκ

Με αυτή την επιλογή, μπορείτε να αποθηκεύσετε το τρέχον μπλοκ, ούτως ώστε να το χρησιμοποιήσετε ξανά αργότερα. Θα σας φανεί εξαιρετικά χρήσιμη, εάν χρησιμοποιείτε συχνά το ίδιο κείμενο, εικόνες ή ακόμα και κουμπιά.

7.  Αφαιρέστε μπλοκ

Χρησιμοποιήστε αυτή την επιλογή για να διαγράψετε το τρέχον μπλοκ από το άρθρο ή τη σελίδα σας.

ΣΥΝΤΟΜΕΥΣΕΙΣ ΠΛΗΚΤΡΟΛΟΓΙΟΥ ΓΙΑ ΤΟΝ GUTENBERG

Οι συντομεύσεις πληκτρολογίου μπορούν να μειώσουν το χρόνο της ροής της εργασίας σας, ειδικά όταν μιλάμε για τη σύνθεση περιεχομένου στην ιστοσελίδα σας. Ο Επεξεργαστής Κειμένου Gutenberg περιλαμβάνει διάφορες συντομεύσεις πληκτρολογίου, οι οποίες εξορθολογίζουν τη διαδικασία της επεξεργασίας άρθρων και σελίδων. Παρακάτω θα βρείτε μερικές από τις κυριότερες:

Συντόμευση

MAC

WINDOWS/LINUX

Εμφάνιση Συντόμευσης

Cmd+Option+H

Shift+Alt+H

Εμφάνιση/ Απόκρυψη Ρυθμίσεων Sidebar

Shift+Cmd+,

Shift+Cmd+,

Άνοιγμα του Μενού Πλοήγησης στο Μπλοκ

Ctrl+Option+O

Shift+Alt+O

Πλοήγηση στην επόμενη Ενότητα  του Επεξεργαστή

Ctrl+` ή Shift+Options+N

Ctrl+` ή  Shift+Alt+N

Πλοήγηση στην προηγούμενη Ενότητα  του Επεξεργαστή

Ctrl+Shift+` ή Shift+Option+P

Ctrl+Shift+` ή Shift+Option+P

Πλοήγηση στην πλησιέστερη μπάρα Εργαλείων

Option+F10

Alt+F10

Εναλλαγή μεταξύ του Οπτικού Επεξεργαστή και του Επεξεργαστή Κώδικα

Cmd+Shift+Option+M

Ctrl+Shift+Alt+M

Φυσικά και ο τομέας της κατασκευής eshop δεν μπορούσε να μείνει ανεπηρέαστος από την έλευση του GutenBerg και την νέα έκδοση του WordPress. Η Ecwid και η E-Commerce  λύση της για παράδειγμα λειτουργεί άψογα με τον Gutenberg και σας επιτρέπει να δημιουργήσετε ένα ηλεκτρονικό κατάστημα χωρίς να έχετε την ανάγκη να γνωρίζετε κώδικα προκειμένου να το στήσετε.