Σπίτι Εξοπλισμός γραφείου Ενσωματώστε τις αναρτήσεις σε μια σελίδα WordPress. Εκτελέσιμος κώδικας php σε αναρτήσεις WordPress

Ενσωματώστε τις αναρτήσεις σε μια σελίδα WordPress. Εκτελέσιμος κώδικας php σε αναρτήσεις WordPress

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

Όποιος έχει προσπαθήσει να γράψει οποιονδήποτε κώδικα PHP σε μια ανάρτηση με την ελπίδα ότι θα λειτουργήσει, γνωρίζει ότι το WordPress αντιμετωπίζει αυτόν τον κώδικα ως απλό κείμενο. Ωστόσο, μερικές φορές είναι βολικό να εκτελείτε, για παράδειγμα, κάποιο είδος βρόχου εξόδου απευθείας στο κείμενο όταν γράφετε ένα άρθρο, επειδή το περιεχόμενο ενός τέτοιου άρθρου θα ενημερώνεται δυναμικά. Ένα άλλο παράδειγμα θα ήταν η δυνατότητα να καλέσετε έτοιμες συναρτήσεις σε μια ανάρτηση, εάν είναι απαραίτητο, ή, για παράδειγμα, να εισαγάγετε κάποιο αρχείο PHP στο κείμενο μιας ανάρτησης χρησιμοποιώντας τη συνάρτηση php require():

Απαιτείται "my_script.php";

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

Έτσι, για να εφαρμόσετε τη δυνατότητα εισαγωγής εκτελέσιμα σενάρια PHP στο κείμενο ενός άρθρου/ανάρτησης ή στατικής σελίδας, πρέπει να προσθέσετε τον ακόλουθο κώδικα στο αρχείο functions.php του θέματος, το οποίο είναι πιθανώς οδυνηρά οικείο σε εμάς:

## Εκτελέσιμος κώδικας PHP σε περιεχόμενο ανάρτησης WordPress. ## PHP_code ## ## @version: 1.0 if("Εκτέλεσιμος κώδικας PHP στο περιεχόμενο")( add_filter("the_content", "content_exec_php", 0); function content_exec_php($content)( return preg_replace_callback("/\( . +?)\[\/exec\]/s", "_content_exec_php", $content); ) συνάρτηση _content_exec_php($matches)( if(" off" === $matches)( return "\n\n<"."pre>". htmlspecialchars($matches) ."\n\n"; ) else ( eval("ob_start(); ($matches); \$exec_php_out = ob_get_clean();"); επιστροφή $exec_php_out; ) ) )

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

Κωδικός Php

Για παράδειγμα:

// Καθολικό σχόλιο $wp_version; echo "Τρέχουσα έκδοση WP: $wp_version";

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

Κωδικός Php

Σημαντικό για την προστασία

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

Για να προστατευθείτε από τις πιθανές επιβλαβείς συνέπειες αυτού του hack, μπορείτε να κάνετε την ακόλουθη απλή προστασία (αυτό που μου ήρθε αμέσως στο μυαλό): ενεργοποιήστε την εκτέλεση της κατασκευής κώδικα php μόνο εάν, για παράδειγμα, η ανάρτηση έχει κάποιο προσαρμοσμένο πεδίο ή Ας πούμε ότι η ανάρτηση γράφτηκε στα 00 λεπτά. Φυσικά, μόνο εσείς θα γνωρίζετε αυτό το τέχνασμα στο οποίο θα εκτελεστεί ο κώδικας και, κατά συνέπεια, μόνο εσείς θα έχετε την ευκαιρία να εισαγάγετε κώδικα PHP στο άρθρο.

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

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

Θα γράψουμε ένα πρόσθετο! Είναι πολύ απλό και δεν απαιτεί καμία γνώση στη δημιουργία πρόσθετων WP. Το μόνο μειονέκτημά του είναι η έλλειψη «προσώπου» στον πίνακα διαχείρισης του WP, δηλαδή, δεν θα ήταν comme il faut να το παραδώσετε σε ορισμένους πελάτες. Αλλά για τις δικές σας ανάγκες η επιλογή είναι εξαιρετική.

Στον φάκελο /wp-content/plugins/, δημιουργήστε ένα αρχείο με κάποιο μοναδικό όνομα, ας πούμε, "insert-any-data-into-post.php". Αρχικά, γράφουμε ένα μπλοκ σχολίων, το οποίο το WP θα αναλύσει στη συνέχεια για να περιγράψει την προσθήκη στον πίνακα διαχείρισης. Μπορείτε να γράψετε όσα δεδομένα θέλετε, στη συνέχεια να συνδέσετε τον σύντομο κώδικα και να γράψετε μια απλή συνάρτηση. Όλος ο κωδικός:

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

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

Συνάρτηση give_me_date_handler ($atts) ( //από τον πίνακα χαρακτηριστικών δημιουργούμε επιτρεπόμενες μεταβλητές και ορίζουμε προεπιλεγμένες τιμές, προαιρετικό αλλά βολικό extract(shortcode_atts(array("type" => "χθες, σήμερα, αύριο", "format" => "short ,full"), $atts)); //ας προσδιορίσουμε ποια ημερομηνία χρειαζόμαστε switch($type) (περίπτωση "αύριο": $time = strtotime("+1 ημέρα"); διάλειμμα, περίπτωση "χθες" : $time = strtotime("-1 ημέρα"); διάλειμμα; προεπιλογή: $time = time(); ) // επανάληψη πάνω από τον τύπο ημερομηνίας if ($format == "short") $date = date("d.m.Y" , $time), αλλιώς $date = date("r", $time); επιστροφή $date; )

Οι μεταβλητές για τη συνάρτησή μας ορίζονται μέσω μιας ετικέτας στην ανάρτηση ως εξής:

Αποτέλεσμα της ετικέτας που γράφτηκε παραπάνω: 21/08/2019

Στιγμιότυπο οθόνης από την περιοχή διαχείρισης επεξεργασίας ανάρτησης:

Μέσω της συνάρτησης, μπορείτε να τραβήξετε δεδομένα από τη βάση δεδομένων και να τα επιστρέψετε· μπορείτε απλά να επιστρέψετε τον κώδικα JS, τυλίγοντάς τον σε ob_start() και ob_end_clean() για ευκολία. Μπορείτε επίσης να δημιουργήσετε αρκετούς συντομότερους κωδικούς και, κατά συνέπεια, πολλές λειτουργίες, τοποθετώντας έτσι σε ένα αρχείο/πρόσθετο όλες τις απαραίτητες «εισαγωγές» για χρήση στο σώμα της δημοσίευσης.

Γενικά, ένα χρήσιμο πράγμα!

- 5.0 από 5 με βάση 2 ψήφους

Στο προηγούμενο άρθρο εξετάσαμε για το ιστολόγιό μας στο WordPress και εδώ θα δούμε πώς προστίθενται οι αναρτήσεις (σημειώσεις) στο WordPress.

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

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

Για να δημιουργήσετε μια ανάρτηση, μεταβείτε στον πίνακα διαχείρισης του WordPress: "Αναρτήσεις" >> "Προσθήκη νέου".

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

1. Στο χωράφι "Εισαγάγετε τον τίτλο", αναφέρετε τον τίτλο της ανάρτησης.

2. Χρήση του πίνακα "Φόρτωση/Επικόλληση", μπορείτε να κάνετε λήψη και να εισαγάγετε τις απαραίτητες εικόνες και αρχεία πολυμέσων στην ανάρτησή σας.

3. Χρησιμοποιώντας τις καρτέλες "Visual" και "HTML", μπορείτε να προχωρήσετε στην επεξεργασία κώδικα HTML ή να συνεχίσετε να εργάζεστε σε ένα οπτικό περιβάλλον.

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

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

Εισαγωγή κειμένου.

Εάν προετοιμάζετε τα κείμενά σας στο πρόγραμμα επεξεργασίας MS Word και μην τα αντιγράψετε απευθείας στο παράθυρο του προγράμματος επεξεργασίας, χρησιμοποιήστε το εργαλείο "Επικόλληση από το Word".

Για να το κάνετε αυτό, αντιγράψτε το κείμενο στο Word, μετά μεταβείτε στον επεξεργαστή WordPress και κάντε κλικ στο εικονίδιο "Επικόλληση από το Word", στη συνέχεια επικολλήστε το κείμενο στο παράθυρο που ανοίγει και κάντε κλικ στο κουμπί "Επικόλληση".

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

Εισαγάγετε μια εικόνα στο κείμενο.

Για να εισαγάγετε μια εικόνα στο κείμενο, τοποθετήστε τον κέρσορα στο σημείο του κειμένου όπου θέλετε να εισαγάγετε την εικόνα και κάντε κλικ στο εικονίδιο «Εισαγωγή εικόνας»:

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

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

Το πεδίο «Τίτλος» είναι υποχρεωτικό. Μπορείτε να συμπληρώσετε τα υπόλοιπα πεδία «Κείμενο», «Υπογραφή» και «Περιγραφή» όπως θέλετε.

Στο πεδίο «Σύνδεσμος» μπορείτε να ορίσετε έναν σύνδεσμο που θα πηγαίνει στην εικόνα. Από προεπιλογή, ο σύνδεσμος πηγαίνει στην εικόνα, εάν κάνετε κλικ στο κουμπί "Σύνδεσμος για ανάρτηση", τότε ο σύνδεσμος από την εικόνα θα μεταβεί στην ίδια τη δημοσίευση, εάν κάνετε κλικ στο κουμπί "Όχι", τότε δεν θα υπάρχει Σύνδεσμος.

Στο στοιχείο "Στοίχιση", μπορείτε να ορίσετε τη θέση της εικόνας στη σελίδα.

Στο στοιχείο "Μέγεθος", μπορείτε να ορίσετε το μέγεθος της εικόνας.

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

Εισαγάγετε την ετικέτα "Επόμενο".

Επιλέξτε τη μορφή εγγραφής.

Ξεκινώντας με την έκδοση 3.X του WordPress, εισήχθησαν μορφές ανάρτησης. Χρησιμοποιώντας μορφές, μπορείτε να επιλέξετε έναν συγκεκριμένο τύπο εμφάνισης αναρτήσεων. Αυτή η δυνατότητα επιτρέπει στους προγραμματιστές προτύπων να δημιουργούν διαφορετικούς τύπους αναρτήσεων ανάλογα με τις ανάγκες τους. Το πρότυπο που είναι εγκατεστημένο στο WordPrees από προεπιλογή χρησιμοποιεί τρεις μορφές εμφάνισης αναρτήσεων:

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

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

Πρώτα απ 'όλα, πρέπει να εγκαταστήσετε και να ενεργοποιήσετε το πρόσθετο Insert Pages. Μετά την ενεργοποίηση, απλώς μεταβείτε στην ενότητα Δημοσιεύσεις » Προσθήκη νέουδιοικητικό πάνελ του ιστότοπου για να το δείτε σε δράση.

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

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

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

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

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

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

Μπορείτε επίσης να καθορίσετε το αναγνωριστικό καταχώρισης. Έχουμε ήδη γράψει για το πώς να μάθετε το αναγνωριστικό μιας ανάρτησης στο WordPress.

Προσθήκη προσαρμοσμένων τύπων αναρτήσεων σε καταχωρήσεις ιστολογίου

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

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

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

Χρήση προσαρμοσμένων προτύπων για την εμφάνιση σελίδων που έχουν εισαχθεί

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

Το μόνο που χρειάζεται να κάνετε είναι να δημιουργήσετε ένα κενό αρχείο php και να το ανεβάσετε στον φάκελο θεμάτων σας. Το αρχείο μπορεί να ονομαστεί όπως θέλετε. Για παράδειγμα, custom-author.php.

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

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

H3.author-name ( font-size:16px; ) .author-thumbnail ( float:left; padding:10px; ) .author-bio ( font-style:italic; font-family: Lora, Georgia, Serif; )

Έτσι φαίνεται η τελική έκδοση:

Ελπίζουμε ότι αυτό το άρθρο σας βοήθησε να προσθέσετε περιεχόμενο από μια σελίδα/ανάρτηση WordPress σε μια άλλη.

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

Από προεπιλογή, το WordPress φιλτράρει κάθε ακατέργαστο κώδικα που προστίθεται σε αναρτήσεις, σελίδες, γραφικά στοιχεία ή σχόλια. Αυτό γίνεται για λόγους ασφαλείας, ώστε ο κώδικας του προγράμματος να μην είναι εκτελέσιμος. Εάν, για παράδειγμα, γράψετε πρώτα μια ανάρτηση στο Word ή σε οποιοδήποτε πρόγραμμα επεξεργασίας κειμένου και στη συνέχεια επικολλήσετε αυτό το κείμενο στο πεδίο επεξεργασίας ανάρτησης στην κονσόλα του WordPress, η μηχανή θα μετατρέψει αυτόματα ορισμένους χαρακτήρες. Για παράδειγμα, το σύμβολο< в режиме просмотра Текст будет преобразован в < . Т.е., если вы вставляете в Визуальном режиме, например, фрагмент кода, который начинается с

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

Δοκιμάστε, για παράδειγμα, να γράψετε σε λειτουργία κειμένου:

Όταν μεταβαίνετε σε Οπτική λειτουργία (ή μετά τη δημοσίευση μιας ανάρτησης), δεν θα δείτε το επιθυμητό κείμενο Γειά σου Κόσμε!γιατί το σύστημα το έκρυψε για να μην είναι εκτελέσιμο. Εδώ φτάνουμε στο πρόβλημα: πώς να εμφανίσετε τον κώδικα προγράμματος σε αναρτήσεις WordPress;

Ένας εύκολος τρόπος εμφάνισης κώδικα στο WordPress

Ο ευκολότερος τρόπος για να προσθέσετε κώδικα στις αναρτήσεις σας είναι να τυλίξετε τον κώδικα του προγράμματος σε λειτουργία κειμένου με μια ετικέτα HTML

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

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

Ετικέτα

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

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

Ετικέτα

- αποκλεισμός και ετικέτα — inline, δηλαδή, τα περισσότερα προγράμματα περιήγησης το εμφανίζουν ως οθόνη: inline;  και μπορεί να εμφανιστεί απευθείας στην παράγραφο και όχι σε νέα γραμμή.

Ένας περίπλοκος τρόπος εμφάνισης κώδικα στο WordPress

Ως πολύπλοκος τρόπος εμφάνισης κώδικα προγράμματος, συμπεριλαμβάνω ειδικά πρόσθετα για αυτό (για παράδειγμα, Crayon Syntax Highlighter, Syntax Highlighter Evolved και παρόμοια). Κάποιος μπορεί να υποστηρίξει ότι αυτή είναι, αντίθετα, μια απλή μέθοδος, αλλά πιστεύω ότι κάθε είδους φανταχτερά πρόσθετα περιπλέκουν τα πάντα. Πολύ συχνά μπορείτε να βρείτε μια κατάσταση σε ιστότοπους όταν ο προηγουμένως σχεδιασμένος κώδικας που χρησιμοποιεί συντομότερους κωδικούς προσθηκών εξακολουθεί να εμφανίζεται στο πρόγραμμα περιήγησης μετά από λίγο, για παράδειγμα:

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

Ναι, τέτοια πρόσθετα κάνουν πολύ ωραία επισήμανση σύνταξης εν κινήσει χρησιμοποιώντας JavaScript και CSS, αλλά είναι ως επί το πλείστον αρκετά «βαριά» για το σύστημα και η βασική επισήμανση σύνταξης μπορεί να γίνει χωρίς πρόσθετα, χρησιμοποιώντας πολλές κλάσεις για div, span, code και pre ετικέτες , καθώς και πολλές γραμμές στυλ CSS.

Η επιλογή είναι δική σου!

Και θα ήθελα να συμπεριλάβω τη χρήση υπηρεσιών τρίτων ως μια πολύπλοκη μέθοδο εισαγωγής κώδικα σε σελίδες WordPress. Υπάρχουν αρκετοί ιστότοποι όπου μπορείτε να γράψετε σχεδόν οποιονδήποτε κώδικα και θα εμφανίζεται όπως θα έπρεπε. Παραδείγματα τέτοιων υπηρεσιών: CodePen, GitHub Gists και JSFiddle.

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

συμπέρασμα

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

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

Νέο στο site

>

Δημοφιλέστερος