Πώς να ενσωματώσετε ευαίσθητο βίντεο στην ανάρτησή σας στο WordPress
Από το WordPress 3.0+, μπορείτε να ενσωματώσετε εύκολα το βίντεο Youtube στα άρθρα σας, απλώς προσθέτοντας τη διεύθυνση URL του ιστότοπου βίντεο στον επεξεργαστή κειμένου. Το WordPress θα επεξεργαστεί τα υπόλοιπα και θα εισαγάγει τον απαιτούμενο κώδικα για να ενσωματώσει το βίντεο στον ιστότοπό σας. Αυτό είναι μεγάλο, εκτός από το ότι το πλάτος και το ύψος του ενσωματωμένου βίντεο είναι προκαθορισμένο και δεν μπορείτε να το αλλάξετε. Αυτό που μπορεί να συμβεί είναι ότι είτε το βίντεο είναι πολύ μικρό για το θέμα σας, είτε είναι πολύ μεγάλο για να χωρέσει στην περιοχή περιεχομένου. Αν χρησιμοποιείτε ένα θέμα που ανταποκρίνεται στον ιστότοπό σας, θα διαπιστώσετε ότι το βίντεο δεν κλιμακώνεται καθώς αλλάζετε το μέγεθος του προγράμματος περιήγησής σας και τελικά σπάει το θέμα σας.
Για να το καταδείξουμε, αυτό συνέβη:
Παρατηρήστε ότι το βίντεο δεν καταλαμβάνει το πλήρες πλάτος του δοχείου περιεχομένου;
Παρατηρήστε ότι το βίντεο δεν κλιμακώνεται όταν αλλάζετε το μέγεθος του προγράμματος περιήγησης και βγήκε από το δοχείο περιεχομένου και σπάσει το θέμα;
Για να το διορθώσουμε αυτό, πρέπει να χρησιμοποιήσουμε ένα σενάριο - FitVids - το οποίο θα μετατρέψει το ενσωματωμένο σας βίντεο σε ένα αντικειμενοφόρο αντικείμενο πλήρους πλάτους και θα κλιμακωθεί αυτόματα καθώς αλλάζετε το μέγεθος του προγράμματος περιήγησης.
Προσωπικά, έχω ενσωματώσει τη δέσμη ενεργειών FitVids απευθείας στο θέμα για να μειώσω την επιβάρυνση του διακομιστή, αλλά για όσους δεν έχουν εμπειρία στην κωδικοποίηση, υπάρχει ένα plugin που μπορεί να το κάνει για εσάς: FitVids για WordPress.
1. Εγκαταστήστε και ενεργοποιήστε το plugin FitVids για WordPress.
2. Μεταβείτε στην επιλογή "Εμφάνιση -> FitVids".
3. Εάν είστε απολύτως βέβαιοι ότι το σενάριο jQuery (της έκδοσης 1.6 και παραπάνω) περιλαμβάνεται ήδη στο θέμα σας, αφήστε το πεδίο "Προσθήκη jQuery" κενό. Εάν όχι, επιλέξτε το πλαίσιο δίπλα στην επιλογή "Προσθήκη jQuery".
4. Το πεδίο "επιλογέας jQuery" είναι λίγο δύσκολο γιατί μπορεί να διαφέρει για κάθε τοποθεσία. Για τις περισσότερες περιπτώσεις, μπορείτε απλά να εισάγετε τη λέξη " body " (χωρίς το απόσπασμα) στο πεδίο εισαγωγής και θα πρέπει να λειτουργήσει. Ωστόσο, αν θέλετε να στοχεύσετε ένα συγκεκριμένο κοντέινερ με βίντεο, μπορείτε να τοποθετήσετε το id / class του κοντέινερ σε αυτό το πεδίο, για παράδειγμα: " #video-container
", " #content
.entry-content
", " .entry-content
" και τα λοιπα.
Σημείωση : Τα "#" και "." Μπροστά από το κείμενο αντιπροσωπεύουν το "id" και το "class" στο CSS αντίστοιχα.
5. Τώρα, δείτε την ανάρτηση με ενσωματωμένο βίντεο. Θα πρέπει να δείτε κάτι τέτοιο:
Το βίντεο τώρα καταλαμβάνει όλο το πλάτος του δοχείου περιεχομένου
Αυτόματη κλίμακα καθώς αλλάζετε το μέγεθος του προγράμματος περιήγησης.
συμπέρασμα
Το FitVids είναι ένα εύχρηστο σενάριο για τη μετατροπή του ενσωματωμένου βίντεο σε ένα αποκρινόμενο αντικείμενο. Δοκιμάστε το και ενημερώστε μας αν αυτό είναι χρήσιμο για εσάς.