Προηγμένος οδηγός για τη χρήση του WordPress: WP Wizardry

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


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

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

  • Οδηγός για αρχάριους για τη χρήση του WordPress
  • Ενδιάμεσος οδηγός για τη χρήση του WordPress

Προηγμένη βελτιστοποίηση

Σε όλους τους τρεις οδηγούς WordPress, έχουμε καλύψει διάφορες μορφές βελτιστοποίησης, από τη βασική επεξεργασία εικόνων έως πιο προηγμένες προσθήκες όπως το WP-Optimize. Σε αυτήν την ενότητα, μπαίνουμε βαθιά στη βελτιστοποίηση, αγγίζοντας πώς μπορείτε να επιταχύνετε τον ιστότοπό σας ακόμη περισσότερο με ένα CDN, προσωρινή αποθήκευση και προοδευτική φόρτωση εικόνας.

Δυναμικό περιεχόμενο με CDN

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

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

Ας υποθέσουμε ότι το πλησιέστερο κέντρο δεδομένων του οικοδεσπότη ιστού σας είναι στο Λος Άντζελες. Κάποιος που βρίσκεται στις Ηνωμένες Πολιτείες θα έχει ταχύτερο χρόνο απόκρισης σε σχέση με κάποιον που βρίσκεται στην Ευρώπη. Η καθυστέρηση από τη μετάδοση των δεδομένων του ιστότοπού σας θα είναι μεγαλύτερη καθώς πρέπει να διανύσει μια ακόμη απόσταση.

Ένα CDN μετριάζει αυτά τα ζητήματα. Το δίκτυο (εφόσον είναι αξιόπιστο) θα διαθέτει διακομιστές σε όλο τον κόσμο, πράγμα που σημαίνει ότι ο Ευρωπαίος χρήστης θα λάβει μια προσωρινά αποθηκευμένη έκδοση του ιστότοπού σας από έναν πλησιέστερο διακομιστή. Οι ταχύτητές σας θα εξομαλυνθούν διεθνώς, διασφαλίζοντας ότι παρέχετε την ίδια εμπειρία για κάθε κοινό, ανεξάρτητα από το πού βρίσκονται.

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

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

Αρχικά, μεταβείτε στο Cloudflare και εγγραφείτε για δωρεάν λογαριασμό. Μόλις φτάσετε στον πίνακα ελέγχου, κάντε κλικ στο “+ προσθήκη ιστότοπου” στην επάνω δεξιά γωνία. Εισαγάγετε τον τομέα WordPress και κάντε κλικ στο “έναρξη σάρωσης”.

Μετά από μερικά λεπτά, το Cloudflare θα τραβήξει τις εγγραφές DNS σας, καθώς και δύο επιλογές. Για να επωφεληθείτε από το CDN, επιλέξτε “CDN και προστασία” από τα δύο. Η εγγραφή σας (ο τομέας σας) θα πρέπει να εμφανίζει ένα πορτοκαλί σύννεφο στη στήλη “κατάσταση”. Άλλες εγγραφές, όπως εγγραφές MX που χρησιμοποιούνται για μηνύματα ηλεκτρονικού ταχυδρομείου, δεν χρειάζεται να χρησιμοποιούν το CDN, οπότε μην ανησυχείτε εάν έχετε κενό χώρο στην κατάσταση.

Συνεχίστε μέσω της ρύθμισης αφού βεβαιωθείτε ότι οι εγγραφές DNS σας είναι ακριβείς. Μπορείτε πάντοτε να επιστρέψετε και να αλλάξετε αυτήν την ενότητα, οπότε μην ανησυχείτε πάρα πολύ εάν κάτι πρέπει να τροποποιηθεί αργότερα. Στην επόμενη οθόνη, θα επιλέξετε το σχέδιό σας. Το Cloudflare είναι λίγο ακριβό, αλλά το δωρεάν πρόγραμμα πρέπει να τα πάει καλά για τους περισσότερους χρήστες.

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

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

Τώρα που ο τομέας σας οδηγεί στο Cloudflare, πρέπει να κατευθύνετε το Cloudflare στον κεντρικό υπολογιστή ιστού σας. Συνδεθείτε στο Cloudflare και κάντε κλικ στην καρτέλα “DNS” στον πίνακα ελέγχου σας. Η εγγραφή σας A, που είναι ο τομέας σας, πρέπει να οδηγεί στη διεύθυνση IP του διακομιστή του κεντρικού υπολογιστή σας. Μπορείτε να το βρείτε εύκολα στο cPanel (διαβάστε την καλύτερη φιλοξενία ιστού με το cPanel), αλλά απλώς επικοινωνήστε με την υποστήριξη εάν ο οικοδεσπότης Ιστού σας δεν υποστηρίζει αυτήν τη διεπαφή.

Μετά από αυτό, το Cloudflare είναι έτοιμο για χρήση με τον ιστότοπό σας στο WordPress. Ωστόσο, υπάρχει ένα ειδικό πρόσθετο που μπορεί να κάνει τη διαχείριση του Cloudflare απλή στον πίνακα ελέγχου του WordPress. Απλώς εγκαταστήστε και εκτελέστε τις οδηγίες και θα πρέπει να είστε εντάξει. Το μόνο πράγμα που θα χρειαστείτε είναι ένα κλειδί Cloudflare API που μπορείτε να βρείτε εδώ.

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

Προοδευτική φόρτωση εικόνας

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

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

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

Μπορείτε να ρυθμίσετε όλες τις εικόνες σας να φορτώνουν προοδευτικά μέσω HTML, αλλά αυτή είναι μια μάλλον επίπονη διαδικασία. Αντ ‘αυτού, σας συνιστούμε να εγκαταστήσετε ένα τεμπέλης πρόσθετο φόρτωσης για να χειριστείτε το πόδι για εσάς. Τα περισσότερα πρόσθετα μπορούν επίσης να φορτώσουν σχόλια και βίντεο, οπότε λάβετε υπόψη αυτό. Εδώ είναι μερικά από τα αγαπημένα μας:

  • A3 Lazy Load
  • BJ Lazy Load
  • Άπειρη κύλιση – Ajax Φόρτωση περισσότερων

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

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

Τα προοδευτικά .jpgs είναι ελαφρώς μεγαλύτερα, αλλά χρησιμοποιείτε διαφορετική μέθοδο φόρτωσης. Αντί να προσπαθεί να φορτώσει ολόκληρη τη γραμμή εικόνας κατά γραμμή, ένα προοδευτικό .jpg θα φορτώνει σύνολα γραμμών για μεγαλύτερο χρονικό διάστημα, δίνοντας την αντίληψη της εικόνας στη σελίδα σας, αλλά αφήνοντας περισσότερο χρόνο για να τη φορτώσει. Είναι σαν να φορτώνετε ένα βίντεο YouTube σε SD για λίγα δευτερόλεπτα προτού μεταβεί αυτόματα σε HD (αν και η τεχνολογία είναι διαφορετική).

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

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

Μια ματιά στο WordPress Caching

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

Ας ξεκινήσουμε με την κατανόηση του τι είναι. Όταν κάποιος πληκτρολογεί τη διεύθυνση URL σας και πατάει “enter”, αρχίζει να μεταφέρεται ένα πλήθος αρχείων από τον διακομιστή στον υπολογιστή προορισμού. Ουσιαστικά, κάποιος επισκέπτεται τον ιστότοπό σας, το WordPress αναζητά όλα τα αρχεία στη βάση δεδομένων σας και ο διακομιστής ιστού συγκεντρώνει τα δεδομένα σε μια σελίδα HTML για παράδοση στον χρήστη.

Ωστόσο, υπάρχει πρόβλημα με αυτήν την προσέγγιση. Το WordPress δημιουργεί περιεχόμενο με δυναμικό νόημα κάθε φορά που ένας χρήστης προσγειώνεται στον ιστότοπό σας, φορτώνεται νέο περιεχόμενο, ακόμα κι αν ήταν εκεί πριν. Είναι σε μεγάλο βαθμό περιττό καθώς μια δημοσίευση ιστολογίου και το γενικό στυλ του ιστότοπού σας είναι απίθανο να αλλάζει καθημερινά.

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

Υπάρχουν δύο τύποι προσωρινής αποθήκευσης: ο πελάτης και ο διακομιστής. Η προσωρινή αποθήκευση στην πλευρά του πελάτη είναι εκτός ελέγχου σας. Χρησιμοποιείται στα περισσότερα σύγχρονα προγράμματα περιήγησης για να επιταχύνει τους χρόνους φόρτωσης επαναχρησιμοποιώντας τα δεδομένα που λάβατε προηγουμένως. Ο ιστότοπός σας (αρκεί να είναι συνδεδεμένος με ένα σύγχρονο πρόγραμμα περιήγησης) εκτελεί ήδη προσωρινή αποθήκευση από την πλευρά του πελάτη.

Η σφαίρα σας είναι διακομιστή. Υπάρχουν διάφορα πρωτόκολλα προσωρινής αποθήκευσης που αποτελούν ολόκληρο το χώρο της προσωρινής αποθήκευσης του WordPress. Ακολουθεί μια σύντομη περιγραφή κάθε:

  • Προσωρινή αποθήκευση σελίδας: Η πιο αγνή μορφή προσωρινής αποθήκευσης. Αυτή είναι η διαδικασία αποθήκευσης αρχείων HTML στατικά και η εξυπηρέτησή τους από την προσωρινή μνήμη. Αυτό σημαίνει λιγότερες εκτελέσεις σεναρίων PHP και ερωτημάτων βάσης δεδομένων MySQL
  • Προσωρινή αποθήκευση βάσης δεδομένων: Αυτό αναφέρεται στην προσωρινή αποθήκευση του αποτελέσματος ενός συγκεκριμένου ερωτήματος βάσης δεδομένων. Αντί το WordPress να ψάχνει κάτι στη βάση δεδομένων κάθε φορά, το αποτέλεσμα αποθηκεύεται στην προσωρινή μνήμη και το WordPress θα το φορτώσει. Ωστόσο, θα πρέπει να εκκαθαρίζετε την προσωρινή μνήμη κάθε φορά που ενημερώνετε τη βάση δεδομένων
  • Αποθήκευση αντικειμένου: Η προσωρινή αποθήκευση αντικειμένων είναι ενσωματωμένη στο WordPress από την αρχή. Είναι παρόμοιο με την προσωρινή αποθήκευση βάσης δεδομένων, αλλά εξετάζει τα αποτελέσματα των επαναλαμβανόμενων ερωτημάτων. Δεν θα χρειαστεί να τα χάσετε εδώ, καθώς το WordPress θα αποθηκεύει αυτόματα αντικείμενα στην κρυφή μνήμη από το σετ
  • Προσωρινή αποθήκευση κώδικα: Το WordPress χρησιμοποιεί μια λίστα σεναρίων PHP στον πυρήνα του. Κάθε φορά που εκτελείται ένα σενάριο PHP, πρέπει να μεταγλωττιστεί για τη δημιουργία ενός εκτελέσιμου κώδικα. Η κρυφή μνήμη Opcode μεταφέρει βασικά το αποτέλεσμα του μεταγλωττιστή PHP στην κρυφή μνήμη για να μειώσει τον αριθμό των εκτελέσεων

Καταλαβαίνετε ότι η προσωρινή αποθήκευση απαιτεί κάποιο είδος αποθήκευσης. Η κοινόχρηστη φιλοξενία (για την οποία μπορείτε να μάθετε στον καλύτερο οδηγό φιλοξενίας ιστοσελίδων) συνήθως παρέχει μόνο χώρο αποθήκευσης σκληρού δίσκου, πράγμα που σημαίνει ότι η προσωρινή μνήμη θα καταλάβει χώρο σε έναν σκληρό δίσκο. Οι VPS και οι αποκλειστικοί διακομιστές μπορούν να εκμεταλλευτούν την ειδική μνήμη RAM, πολύ ταχύτερη μνήμη που θα επιταχύνει την προσωρινή αποθήκευση. Βεβαιωθείτε ότι έχετε διαβάσει την κριτική μας στο DreamHost για να μάθετε σχετικά με ένα σχέδιο WordPress VPS που είναι εξαιρετικό.

Τώρα, η προσωρινή αποθήκευση μοιάζει με ένα όνειρο θεωρητικά, αλλά μπορεί να είναι λίγο πόνος στην πράξη. Οι σύγχρονοι ιστότοποι έχουν πολλές δυναμικές δυνατότητες που ενημερώνονται ακόμη και χωρίς να αλλάξετε κανένα πράγμα. Για παράδειγμα, η ροή σας στο Instagram θα ενημερώνεται συνεχώς ακόμα κι αν δεν κάνετε πραγματικά αλλαγές στον ιστότοπό σας.

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

Στοιχεία όπως αυτό σπάνε μόνο αν χρησιμοποιούν PHP για εκτέλεση, καθώς το Opcode caching αποθηκεύει την έξοδο. Η καλύτερη λύση είναι να βασίζεστε σε πρόσθετα ή widget που χρησιμοποιούν JavaScript ή AJAX για να δημιουργήσουν έξοδο καθώς αυτά λειτουργούν από την πλευρά του προγράμματος περιήγησης. Με αυτό, ακόμη και όταν οι σελίδες αποθηκεύονται στην κρυφή μνήμη, το πρόγραμμα περιήγησης θα δημιουργήσει δυναμικές δυνατότητες.

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

Δώσαμε κάποιες προτάσεις στον προηγούμενο οδηγό μας για την προσωρινή αποθήκευση προσθηκών. Για γρήγορη αναφορά, εδώ είναι τα τρία αγαπημένα μας:

  • WP Super Cache
  • Συνολική προσωρινή μνήμη W3
  • Βελτιστοποίηση ταχύτητας σελίδας κολιβρίων

Προηγμένες επιλογές σχεδιασμού

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

Πριν ξεκινήσετε να αναπτύσσετε τη δική σας προσθήκη, θέλουμε να ορίσουμε μερικούς όρους. Εάν είστε εξοικειωμένοι με HTML, CSS, Javascript και PHP, μη διστάσετε να προχωρήσετε. Για αρχάριους, θα διαφοροποιήσουμε τα τέσσερα, αλλά φροντίστε να μάθετε τις γλώσσες αν σας ενδιαφέρει η προσθήκη ή η ανάπτυξη θεμάτων.

HTML

HTML ή HyperText Markup Language, χειρίζεται όλο το περιεχόμενο του ιστότοπού σας. Αυτή η γλώσσα είναι ο ακρογωνιαίος λίθος του ιστότοπού σας. Τα προγράμματα περιήγησης στο Web ανακτούν αρχεία HTML κατά την πρόσβαση στον ιστότοπό σας και μεταφράζουν το σενάριο στο περιεχόμενό σας.

Ένας καλός τρόπος για να αποκτήσετε μια βασική κατανόηση του HTML είναι να μεταβείτε στο πρόγραμμα επεξεργασίας κειμένου στο WordPress. Εδώ, θα δείτε βασικές λειτουργίες όπως ενσωμάτωση βίντεο, προσθήκη τροποποιήσεων κειμένου και προσθήκη εικόνων.

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

CSS

CSS ή Cascading Style Sheets, χειρίζονται τη συνολική εμφάνιση και το στυλ του ιστότοπού σας. Αυτό σημαίνει πώς εμφανίζονται οι αναρτήσεις, πώς εμφανίζονται οι εικόνες στη σελίδα, τα χρώματα, οι γραμματοσειρές κ.λπ. Οτιδήποτε έχει να κάνει με τον τρόπο εμφάνισης του ιστότοπού σας χειρίζεται το CSS.

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

Συνεχίζοντας με την αναλογία του κτιρίου μας, το CSS θα ήταν η βαφή και η συνολική εμφάνιση του κτιρίου, καθώς και τα δωμάτια μέσα σε αυτό. Το HTML χειρίζεται περιεχόμενο, το CSS χειρίζεται το στυλ.

JavaScript

Ολοκληρώνοντας την τριάδα των τεχνολογιών που αποτελούν οποιονδήποτε ιστότοπο, το JavaScript χειρίζεται την ανταπόκριση του ιστότοπού σας. Δεν χρησιμοποιείται μόνο για μια καθαρή εικόνα παράλλαξης (αν και χρησιμοποιείται για αυτόν τον σκοπό), αλλά για οποιαδήποτε αλληλεπίδραση που έχει κάποιος με τον ιστότοπό σας.

Αυτό σημαίνει ότι χρησιμοποιείτε τη γραμμή αναζήτησης, κάνετε κλικ σε μια εικόνα ή εκτελείτε έναν σύνδεσμο. Το JavaScript είναι αυτό που επιτρέπει στον ιστότοπό σας να ανταποκρίνεται στην εισαγωγή χρηστών, ανεξάρτητα από το πόσο βασικό είναι. Για την ανάπτυξη προσθηκών και θεμάτων, δεν θα χρειαστεί να κάνετε πολλά με το JS.

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

PHP

Η PHP, ή Hypertext Preprocessor, είναι μια γλώσσα δέσμης ενεργειών από διακομιστή που χρησιμοποιείται στην ανάπτυξη ιστού back-end με MySQL. Χρησιμοποιείται για τον χειρισμό ιστοσελίδων που δημιουργούνται με HTML. Κάθε ιστότοπος θα έχει μια γλώσσα δέσμης ενεργειών από την πλευρά του διακομιστή για την εκτέλεση σεναρίων HTML.

Αυτό θα μπορούσε να είναι Java (όχι JavaScript, διαφορετικά πράγματα), PHP ή Python. Σε αντίθεση με τα τρία μεγάλα που τρέχουν μέσω του προγράμματος περιήγησης ιστού, τα σενάρια PHP εκτελούνται στον ίδιο τον διακομιστή. Συνήθως, αυτό σημαίνει αποθήκευση και λήψη δεδομένων από μια βάση δεδομένων MySQL.

Οι περισσότεροι ιστότοποι WordPress χρησιμοποιούν PHP, οπότε είναι πιο σημαντικό να το μάθετε μέσω Java ή Python εάν σκοπεύετε να αναπτύξετε την πλατφόρμα. Για το κτίριό μας, η PHP θα ήταν ο αρχιτέκτονας και ο εργολάβος που το έκανε.

Γράφοντας τη δική σας προσθήκη

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

Ας ξεκινήσουμε όμως με το τι είναι ένα πρόσθετο. Ουσιαστικά, είναι απλώς ένα σενάριο PHP που τροποποιεί κάτι στον ιστότοπό σας. Τα θέματα τροποποιούν την εμφάνιση του ιστότοπού σας και οι προσθήκες τροποποιούν τον τρόπο λειτουργίας της.

Ακούγεται αρκετά βασικό, αλλά τα δύο έχουν πολλά crossover. Όπως αναφέρεται στον ενδιάμεσο οδηγό μας, κάθε θέμα έχει ένα αρχείο functions.php που χειρίζεται τον τρόπο συμπεριφοράς του ιστότοπού σας. Θα μπορούσατε να επεξεργαστείτε αυτό το αρχείο για να επιτύχετε αυτό που ψάχνετε με μια προσθήκη, αλλά δεν είναι πάντα πρακτικό.

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

Η δημιουργία ενός plugin είναι πραγματικά απλή με το WordPress. Αποκτήστε πρόσβαση στον ιστότοπό σας μέσω FTP και κατευθυνθείτε προς τα κάτω στη διεύθυνση “public_html > wp-περιεχόμενο > προσθήκες. ” Δημιουργήστε έναν νέο κατάλογο και ονομάστε τον ό, τι θέλετε. Για αυτό το σεμινάριο, θα το ονομάσουμε “myplugin”.

Ανοίξτε το NotePad ή οποιοδήποτε πρόγραμμα επεξεργασίας σεναρίων και εισαγάγετε τα εξής:

<?php

  / *

  Όνομα προσθήκης: Η προσθήκη μου

  URI προσθήκης: http://my-fake-plugin.com

  περιγραφή: >-

 Μπορώ να προσθέσω προσθήκες στο WordPress

  Έκδοση: 1.0

  Συγγραφέας: Plugin Developer

  Συγγραφέας URI: http://plugin-developer.com

  Άδεια: GPL2

  * /

?>

Τοποθετήστε αυτό το αρχείο στο φάκελο που μόλις δημιουργήσατε και ονομάστε το “myplugin.php”. Από όλες τις επιλογές εδώ, απαιτείται μόνο το όνομα της προσθήκης, αλλά είναι καλή ιδέα να προσθέσετε όσο το δυνατόν περισσότερες λεπτομέρειες εάν σκοπεύετε να διανείμετε την προσθήκη στο διαδίκτυο.

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

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

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

  • register_activation_hook (): Αυτή είναι η λειτουργία που εκτελείται όταν το plugin σας είναι ενεργοποιημένο μέσα στο WordPress. Αυτό είναι το άγκιστρο που ονομάζεται όταν η προσθήκη είναι ενεργή και εκτελεί την πρώτη λειτουργία στο σενάριο.
  • register_deactivation_hook (): Όπως το παραπάνω άγκιστρο, αυτό ενεργοποιεί το WordPress να εκτελεί μια λειτουργία όταν η προσθήκη είναι απενεργοποιημένη. Συνήθως, δεν θα διαγράψετε δεδομένα εδώ, αλλά κόψτε το λίπος που δεν είναι απαραίτητο όταν η προσθήκη δεν είναι ενεργή.
  • register_uninstall_hook (): Αυτή είναι η λειτουργία που εκτελείται όταν η προσθήκη σας διαγραφεί στον πίνακα ελέγχου του WordPress. Είναι μια καλή περιοχή για να διαγράψετε τυχόν δεδομένα που απομένουν από την προσθήκη. Η προσθήκη πρέπει να μπορεί να λειτουργεί ξεχωριστά από το άγκιστρο για να καταργηθεί σωστά η απεγκατάσταση. Εάν δεν μπορείτε να φτάσετε εκεί, θα πρέπει να δημιουργήσετε ένα αρχείο uninstall.php.

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

Γράφοντας το δικό σας θέμα

Υπάρχει μια προσθήκη για σχεδόν οτιδήποτε και η ανάπτυξη είναι αρκετά απαραίτητη εάν χρειάζεστε κάτι που μπορείτε να βρείτε στη βάση δεδομένων προσθηκών. Για πολλούς, η ανάπτυξη ενός θέματος είναι πολύ πιο πρακτική. Ακόμα, θα χρειαστείτε γνώσεις CSS και PHP για να εκτελέσετε τη δική σας ανάπτυξη θεμάτων.

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

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

Είναι η ίδια διαδικασία χρήσης ενός παιδικού θέματος στο WordPress. Σε αυτήν την περίπτωση, το πλαίσιο είναι το γονικό θέμα και το θέμα του παιδιού σας χειρίζεται όλο το στυλ. Εκτελέστε ξανά τη διαδικασία στον προηγούμενο οδηγό για την εγκατάσταση ενός πλαισίου θέματος και τη δημιουργία ενός αρχείου style.css και functions.php για να συνδέσετε τα δύο μαζί.

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

  • Γένεση
  • Ατσάλινος σκελετός
  • Υβριδικός πυρήνας

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

  • index.php: Ο πυρήνας του θέματος. Αυτή είναι η κύρια περιοχή που θα καθορίσει πού βρίσκονται όλες οι επιλογές θέματος. Με την κατάλληλη ονομασία, είναι ένα ευρετήριο για το θέμα σας
  • style.css: Αυτή είναι η συνολική εμφάνιση του ιστότοπού σας. Εδώ, θα ορίσετε τα χρώματα, τις γραμματοσειρές, τα διαστήματα κ.λπ. του κύριου περιεχομένου
  • header.php: Το σενάριο για τη δημιουργία όλων των πληροφοριών κεφαλίδας, συμπεριλαμβανομένου του λογότυπου, του κύριου μενού κ.λπ.
  • sidebar.php: Όλες οι πληροφορίες σχετικά με τον τρόπο λειτουργίας των πλευρικών γραμμών στο θέμα σας. Ρίξτε μια ματιά στον οδηγό για αρχάριους (συνδεδεμένος παραπάνω) για να μάθετε περισσότερα σχετικά με τις πλαϊνές μπάρες
  • footer.php: Ως αυτονόητο όπως και τα τρία τελευταία, αυτό διαχειρίζεται το τμήμα υποσέλιδου του ιστότοπού σας

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

Σε πολλές περιπτώσεις, η υιοθέτηση ενός πλαισίου για τη δημιουργία του θέματος σας είναι ο καλύτερος τρόπος να πάτε. Θα απομακρύνει όλα τα βασικά σενάρια, ώστε να έχετε έναν λειτουργικό ιστότοπο και να σας επιτρέπει να επιστρέψετε και να κάνετε αλλαγές στο συνολικό στυλ του..

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

Γενικές συμβουλές WordPress

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

Κρατήστε το απλό

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

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

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

Ενημέρωση συχνά

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

Μόλις ξεκινήσει μια ενημέρωση, εφαρμόστε την στον ιστότοπό σας. Σε ορισμένες περιπτώσεις, αυτό μπορεί να προκαλέσει ασυμβατότητα, οπότε φροντίστε να δημιουργήσετε αντίγραφα ασφαλείας του ιστότοπού σας (τον οποίο θα καλύψουμε στην επόμενη ενότητα), ώστε να μπορείτε να επαναφέρετε σε περίπτωση που συμβεί αυτό.

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

Δημιουργία αντιγράφων ασφαλείας συνεχώς

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

Υπάρχει ένας τόνος προσθηκών WordPress που ενσωματώνονται στο ηλεκτρονικό αντίγραφο ασφαλείας και στο cloud storage για να προσφέρουν στον ιστότοπό σας πλεονασμό. Μία από τις καλύτερες επιλογές για αυτό είναι το UpdraftPlus που σας επιτρέπει να αποθηκεύσετε τα αντίγραφα ασφαλείας σας απευθείας στο Dropbox (διαβάστε την κριτική μας στο Dropbox) ή στο Google Drive (διαβάστε την κριτική μας στο Google Drive).

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

Τελικές σκέψεις

Με αυτό, ολοκληρώσαμε το μάθημα τριών μερών για την εκμάθηση του WordPress. Παρόλο που καλύψαμε πολλά κατά τη διάρκεια αυτών των οδηγών, υπάρχουν πολλά περισσότερα να μάθουμε για την πλατφόρμα. Φροντίστε να διαβάσετε στο WordPress Codex για να μάθετε οτιδήποτε δεν καλύπτεται εδώ.

Ακόμη και με όλες τις γνώσεις του WordPress, είναι μάταιη προσπάθεια εάν δεν διαθέτετε σταθερό web host για την εκτέλεση του ιστότοπού σας. Φροντίστε να δείτε την καλύτερη φιλοξενία ιστοσελίδων για το WordPress για να βεβαιωθείτε ότι όλη η σκληρή δουλειά σας συνδυάζεται με έναν σταθερό διακομιστή.

Τι άλλες ερωτήσεις WordPress έχετε; Ενημερώστε μας στα παρακάτω σχόλια και, όπως πάντα, σας ευχαριστούμε που διαβάσατε.

Kim Martin Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map