Πώς να φιλοξενήσετε ένα στατικό WordPress Ιστότοπος δωρεάν (σε σελίδες GitHub, Vercel, Netlify)

WordPress είναι ένα ισχυρό και δημοφιλές σύστημα διαχείρισης περιεχομένου, αλλά φιλοξενεί ένα δυναμικό WordPress η τοποθεσία μπορεί να είναι δαπανηρή και απαιτεί συνεχή συντήρηση. Για πολλούς απλούς ιστότοπους ή ιστολόγια, μια στατική έκδοση του a WordPress ο ιστότοπος μπορεί να είναι μια εξαιρετική εναλλακτική. Οι στατικοί ιστότοποι είναι πιο γρήγοροι, πιο ασφαλείς και μπορούν να φιλοξενηθούν δωρεάν σε πλατφόρμες όπως το GitHub Pages, το Netlify ή το Vercel.

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

Εργαλεία που χρειάζεστε

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

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

Βήμα 1: Αναπτύξτε το δικό σας WordPress Ιστότοπος στο LocalWP

Πριν ξεκινήσουμε, θα πρέπει να έχετε το δικό σας WordPress ο ιστότοπος έτοιμος. Εάν δεν έχετε δημιουργήσει ακόμη τον ιστότοπό σας ή εάν φιλοξενείται αυτήν τη στιγμή αλλού, προτείνω να χρησιμοποιήσετε το LocalWP (πρώην Local by Flywheel) για να αναπτύξετε και να δοκιμάσετε τον ιστότοπό σας τοπικά.

1. Κατεβάστε και εγκαταστήστε το LocalWP δωρεάν από localwp.com.
2. Δημιουργήστε ένα νέο WordPress τοποθεσία στο LocalWP.
3. Σχεδιάστε τον ιστότοπό σας, προσθέστε περιεχόμενο και εγκαταστήστε τα απαραίτητα πρόσθετα.
4. Βεβαιωθείτε ότι ο ιστότοπός σας φαίνεται και λειτουργεί ακριβώς όπως θέλετε στη στατική του μορφή.

Κατανόηση των περιορισμών στατικής τοποθεσίας

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

1. WordPress έντυπα: Παραδοσιακό WordPress φόρμες που βασίζονται σε επεξεργασία από την πλευρά του διακομιστή δεν θα λειτουργήσουν. Αυτό περιλαμβάνει φόρμες επικοινωνίας, φόρμες συνδρομής και άλλες διαδραστικές φόρμες.
2. WordPress Σχόλια: Τα δυναμικά συστήματα σχολίων που επιτρέπουν αλληλεπιδράσεις με χρήστες σε πραγματικό χρόνο δεν υποστηρίζονται σε στατικούς ιστότοπους.
3. Πρόσβαση στην περιοχή διαχειριστή: Τυχόν σύνδεσμοι προς /wp-admin ή παρόμοια εσωτερική WordPress οι διαδρομές δεν θα λειτουργούν, καθώς απαιτούν επεξεργασία από την πλευρά του διακομιστή.
4. Ενημερώσεις περιεχομένου σε πραγματικό χρόνο: Οι στατικοί ιστότοποι απαιτούν αναγέννηση και αναδιάταξη για να εμφανιστούν τυχόν αλλαγές περιεχομένου, σε αντίθεση με τους δυναμικούς WordPress τοποθεσίες όπου οι αλλαγές είναι άμεσες.
5. Έλεγχος ταυτότητας χρήστη: Οι δυνατότητες που απαιτούν στοιχεία σύνδεσης χρήστη ή συνδρομές δεν υποστηρίζονται σε μια βασική ρύθμιση στατικής τοποθεσίας.
6. Λειτουργικότητα ηλεκτρονικού εμπορίου: Τα δυναμικά καλάθια αγορών και η επεξεργασία πληρωμών συνήθως δεν λειτουργούν σε στατικό περιβάλλον.
7. Λειτουργικότητα αναζήτησης: WordPressη ενσωματωμένη δυνατότητα αναζήτησης δεν θα λειτουργήσει, αν και μπορούν να εφαρμοστούν εναλλακτικές λύσεις (όπως αναφέρεται στις λειτουργίες Simply Static Pro).
8. Δυναμικές πλευρικές γραμμές και γραφικά στοιχεία: Τα γραφικά στοιχεία που αντλούν δεδομένα σε πραγματικό χρόνο ή απαιτούν επεξεργασία από την πλευρά του διακομιστή δεν θα λειτουργούν όπως αναμένεται.

Πιθανές λύσεις

Ενώ υπάρχουν αυτοί οι περιορισμοί, υπάρχουν τρόποι για να μετριαστούν ορισμένοι από αυτούς:

• Για φόρμες, μπορείτε να χρησιμοποιήσετε υπηρεσίες τρίτων όπως το Formspree ή το Netlify Forms.
• Τα σχόλια μπορούν να διεκπεραιωθούν μέσω υπηρεσιών όπως το Disqus ή τα Σχόλια Facebook.
• Η λειτουργία αναζήτησης μπορεί να υλοποιηθεί χρησιμοποιώντας λύσεις από την πλευρά του πελάτη, όπως το Lunr.js ή το Algolia (όπως προσφέρονται στο Simply Static Pro).
• Για το ηλεκτρονικό εμπόριο, σκεφτείτε να χρησιμοποιήσετε εξωτερικές υπηρεσίες όπως το Snipcart ή το Gumroad.

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

Βήμα 2: Εγκατάσταση και διαμόρφωση Simply Static

Το Simply Static είναι δωρεάν WordPress συνδέω που δημιουργεί μια στατική έκδοση σας WordPress τοποθεσία. Δείτε πώς μπορείτε να το ρυθμίσετε:

1. Σε σας WordPress πίνακα ελέγχου, μεταβείτε στις Προσθήκες > Προσθήκη νέου.
2. Αναζητήστε "Simply Static", εγκαταστήστε το plugin και ενεργοποιήστε το plugin.
3. Μεταβείτε στο Simply Static > Settings στο δικό σας WordPress ταμπλό.
4. Στην καρτέλα "Γενικά", ορίστε τα εξής:
   • Διευθύνσεις URL προορισμού: Επιλέξτε "Αποθήκευση για χρήση εκτός σύνδεσης". Εάν έχετε ήδη έναν προσαρμοσμένο τομέα, επιλέξτε «Απόλυτες διευθύνσεις URL», σύμφωνα με το παρακάτω στιγμιότυπο οθόνης:

5. Τοπικός κατάλογος: Ρυθμίστε το σε έναν κατάλογο έξω από το δικό σας WordPress εγκατάσταση, π.χ. /Users/yourusername/Documents/StaticSite

6. Στην καρτέλα "Συμπερίληψη/Εξαίρεση", βεβαιωθείτε ότι περιλαμβάνονται όλες οι απαραίτητες διευθύνσεις URL.
   • Στις περισσότερες περιπτώσεις χρησιμοποιήστε /wp-content/ και /wp-includes/

7. Αποθηκεύστε τις ρυθμίσεις σας.

Υπάρχει επίσης ένα pro έκδοση του SimplyStatic, Ακολουθεί μια σύνοψη των επαγγελματικών δυνατοτήτων της προσθήκης Simply Static:

1. Προηγμένη ανάπτυξη:
   • Αναπτύξτε στατικούς ιστότοπους σε πολλαπλές πλατφόρμες, συμπεριλαμβανομένων των SimplyCDN, GitHub, Amazon AWS S3, Digital Ocean Spaces και BunnyCDN.
2. Εύκολες ενημερώσεις ιστότοπου:
   • Διαχειριστείτε αποτελεσματικά τις ενημερώσεις περιεχομένου, είτε για μεμονωμένες αναρτήσεις, μαζικές ενημερώσεις ή συγκεκριμένες διευθύνσεις URL.
3. Ενσωμάτωση φορμών και σχολίων:
   • Ενσωματώστε απρόσκοπτα φόρμες από δημοφιλείς προσθήκες όπως Φόρμα Επικοινωνίας 7, Φόρμες Gravity και Φόρμες Elementor στον στατικό ιστότοπό σας.
4. Λειτουργικότητα αναζήτησης:
   • Υλοποιήστε τη βασική αναζήτηση χρησιμοποιώντας το Fuse.js ή αναβαθμίστε σε μια πιο ολοκληρωμένη εμπειρία αναζήτησης με την Algolia.
5. Υποστήριξη WP-CLI:
   • Χρησιμοποιήστε το WP-CLI για να διαμορφώσετε, να εξαγάγετε και να διαχειριστείτε λειτουργίες Simply Static απευθείας από τη γραμμή εντολών.
6. Πολυγλωσσική υποστήριξη:
   • Προσφέρετε περιεχόμενο σε πολλές γλώσσες με ενσωματώσεις για WPML, Polylang και TranslatePress.
7. Ελαχιστοποίηση:
   • Βελτιστοποιήστε την απόδοση του ιστότοπου ελαχιστοποιώντας αρχεία CSS, JavaScript και στατικά HTML.
8. WordPress Απόκρυψη:
   • Αντικατάσταση προεπιλογής WordPress μονοπάτια για να κρύψει το γεγονός ότι WordPress χρησιμοποιείται ως σύστημα διαχείρισης περιεχομένου.

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

Βήμα 3: Αρχικοποιήστε το Git Repository

Τώρα που έχουμε ρυθμίσει τη δημιουργία στατικών τοποθεσιών, ας προετοιμάσουμε τον τοπικό μας κατάλογο για έλεγχο έκδοσης:

1. Ανοίξτε ένα τερματικό ή μια γραμμή εντολών.
2. Πλοηγηθείτε στον κατάλογο που καθορίσατε στο Simply Static (π.χ. cd /Users/yourusername/Documents/StaticSite).
3. Αρχικοποιήστε ένα νέο αποθετήριο Git εκτελώντας:

   git init

Βήμα 4: Δημιουργήστε ένα αποθετήριο GitHub

Θα χρησιμοποιήσουμε το GitHub Desktop για τη δημιουργία και τη διαχείριση του αποθετηρίου μας:

1. Κατεβάστε και εγκαταστήστε το GitHub Desktop από desktop.github.com αν δεν το έχετε ήδη κάνει.
2. Ανοίξτε το GitHub Desktop και συνδεθείτε στον λογαριασμό σας στο GitHub.
3. Κάντε κλικ στο «Αρχείο» > «Νέο αποθετήριο» ή χρησιμοποιήστε το κουμπί «Δημιουργία νέου αποθετηρίου στον σκληρό σας δίσκο».
4. Ορίστε τα εξής:
   • Όνομα: Επιλέξτε ένα όνομα για το αποθετήριό σας (π.χ. "my-static-wordpress")
   • Τοπική διαδρομή: Ρυθμίστε την στον ίδιο κατάλογο που καθορίσατε στο Simply Static
   • Αρχικοποιήστε αυτό το αποθετήριο με ένα README: Αφήστε μη επιλεγμένο
   • Git ignore: Επιλέξτε "Κανένα" (δημιουργήσαμε το δικό μας στο βήμα 3)
   • Άδεια χρήσης: Επιλέξτε μια κατάλληλη άδεια ή αφήστε ως "Καμία"
5. Κάντε κλικ στο "Δημιουργία αποθετηρίου"

Βήμα 5: Δέσμευση του Αποθετηρίου

Τώρα που έχουμε ρυθμίσει το αποθετήριο μας, ας κάνουμε την πρώτη μας δέσμευση:

1. Στο GitHub Desktop, θα πρέπει να βλέπετε όλα τα αρχεία στον στατικό ιστότοπό σας ως αλλαγές.
2. Εισαγάγετε μια σύνοψη για την δέσμευσή σας (π.χ. "Αρχική δέσμευση στατικών αρχείων τοποθεσίας").
3. Κάντε κλικ στο «Δέσμευση στο κύριο» (ή «Δέσμευση για κύριο» σε παλαιότερες εκδόσεις).
4. Κάντε κλικ στο «Δημοσίευση αποθετηρίου» για να προωθήσετε το τοπικό σας αποθετήριο στο GitHub.

Βήμα 6: Εκτελέστε μια απλή στατική εξαγωγή

Τώρα ήρθε η ώρα να δημιουργήσουμε τον στατικό μας ιστότοπο:

1. Επιστροφή στην σας WordPress ταμπλό.
2. Μεταβείτε στο Simply Static > Generate. (Μπορείτε να αγνοήσετε την ειδοποίηση σφάλματος Diagnostics, καθώς αναπτύσσετε μόνο έναν τοπικό κατάλογο).
3. Κάντε κλικ στο «Δημιουργία στατικών αρχείων».
4. Περιμένετε να ολοκληρωθεί η διαδικασία. Αυτό μπορεί να διαρκέσει μερικά λεπτά, ανάλογα με το μέγεθος του ιστότοπού σας.
5. Μόλις ολοκληρωθεί, επιστρέψτε στο GitHub Desktop.
6. Θα πρέπει να δείτε τα αρχεία που δημιουργήθηκαν πρόσφατα ή ενημερώθηκαν ως αλλαγές.
7. Πραγματοποιήστε αυτές τις αλλαγές με ένα μήνυμα όπως "Ενημέρωση στατικών αρχείων ιστότοπου".
8. Πιέστε τις αλλαγές στο GitHub κάνοντας κλικ στο "Push origin".

Βήμα 7: Συνδέστε το αποθετήριο σε μια πλατφόρμα φιλοξενίας

Τώρα που ο στατικός ιστότοπός μας βρίσκεται στο GitHub, μπορούμε εύκολα να τον συνδέσουμε σε μια δωρεάν πλατφόρμα φιλοξενίας. Θα δώσω οδηγίες για τις Σελίδες GitHub, Netlify και Vercel:

Σελίδες GitHub

1. Μεταβείτε στο αποθετήριο σας στο GitHub.com.
2. Κάντε κλικ στις «Ρυθμίσεις» > «Σελίδες» στην αριστερή πλαϊνή γραμμή.
3. Στην ενότητα "Πηγή", επιλέξτε "Ανάπτυξη από κλάδο".
4. Επιλέξτε τον κλάδο που θέλετε να αναπτύξετε (συνήθως "κύριος" ή "κύριος").
5. Επιλέξτε τον ριζικό φάκελο (/) και κάντε κλικ στο «Αποθήκευση».
6. Ο ιστότοπός σας θα είναι ζωντανός στο https://yourusername.github.io/repository-name/.

δικτυώνω

1. Εγγραφείτε για δωρεάν λογαριασμό στη διεύθυνση netlify.com.
2. Κάντε κλικ στο «Νέος ιστότοπος από το Git» στον πίνακα ελέγχου του Netlify.
3. Επιλέξτε το GitHub ως πάροχο Git και εξουσιοδοτήστε το Netlify.
4. Επιλέξτε το αποθετήριο σας από τη λίστα.
5. Αφήστε την εντολή build και δημοσιεύστε τον κατάλογο κενό.
6. Κάντε κλικ στην «Ανάπτυξη ιστότοπου».
7. Ο ιστότοπός σας θα είναι ζωντανός σε έναν υποτομέα Netlify, τον οποίο μπορείτε να προσαρμόσετε στις ρυθμίσεις του ιστότοπου.

Βερκέλ

1. Εγγραφείτε για δωρεάν λογαριασμό στη διεύθυνση vercel.com.
2. Κάντε κλικ στο «Νέο έργο» στον πίνακα ελέγχου Vercel.
3. Εισαγάγετε το αποθετήριο GitHub σας.
4. Αφήστε τις ρυθμίσεις κατασκευής ως έχουν (η Vercel θα πρέπει να ανιχνεύσει αυτόματα ότι είναι στατική τοποθεσία).
5. Κάντε κλικ στο «Ανάπτυξη».
6. Ο ιστότοπός σας θα είναι ζωντανός σε έναν υποτομέα Vercel, τον οποίο μπορείτε να προσαρμόσετε στις ρυθμίσεις του έργου.

Σύνοψη

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

Μερικές επιπλέον συμβουλές:

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