Μπορείτε να ενσωματώσετε βίντεο YouTube απευθείας σε σελίδες DevSite χρησιμοποιώντας το προσαρμοσμένο στοιχείο <devsite-video> . Όλα τα βίντεο έχουν απόκριση και διατηρούν αναλογία 16:9 καθώς αλλάζει το πλάτος της θύρας προβολής.
Για να ενσωματώσετε ένα βίντεο YouTube, προσθέστε ένα προσαρμοσμένο στοιχείο <devsite-video> στη σελίδα σας και ορίστε το χαρακτηριστικό video-id στην τιμή της παραμέτρου v URL για το βίντεο.
Για παράδειγμα, για να ενσωματώσετε το βίντεο YouTube "Το πρώτο σας σενάριο - Οδηγοί σεναρίου εφαρμογών" που μπορείτε να βρείτε στη διεύθυνση https://www.youtube.com/watch?v=Pgfbl_o9WvM , προσθέστε το ακόλουθο προσαρμοσμένο στοιχείο <devsite-video> στο Σελίδα DevSite:
<devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
Στη συνέχεια, τυλίξτε το προσαρμοσμένο στοιχείο <devsite-video> σε ένα στοιχείο <div> του οποίου το χαρακτηριστικό class έχει οριστεί σε μία από τις παρακάτω τιμές:
<div class="video-wrapper-left">
<devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>
Αθέτηση
Το παρακάτω παράδειγμα δείχνει πώς εμφανίζεται ένα ενσωματωμένο βίντεο YouTube όταν <devsite-video> είναι τυλιγμένο σε ένα στοιχείο <div> του οποίου το χαρακτηριστικό class έχει οριστεί σε video-wrapper .
Σε μεγάλες οθόνες, το βίντεο είναι το 50% του πλάτους της περιοχής περιεχομένου και αιωρείται δεξιά από οποιοδήποτε περιεχόμενο προηγείται του βίντεο. Σε μικρές οθόνες, το βίντεο είναι το 100% του πλάτους της περιοχής περιεχομένου.
Κώδικας
<div class="video-wrapper">
<devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>
<p>Lorem ipsum dolor...</p>
Διαδήλωση
Επιπλέει αριστερά
Το παρακάτω παράδειγμα δείχνει πώς εμφανίζεται ένα ενσωματωμένο βίντεο YouTube όταν <devsite-video> είναι τυλιγμένο σε ένα στοιχείο <div> του οποίου το χαρακτηριστικό class έχει οριστεί σε video-wrapper-left .
Σε μεγάλες οθόνες, το βίντεο είναι το 50% του πλάτους της περιοχής περιεχομένου και αιωρείται αριστερά από οποιοδήποτε περιεχόμενο του βίντεο προηγείται. Σε μικρές οθόνες, το βίντεο είναι το 100% του πλάτους της περιοχής περιεχομένου.
Κώδικας
<div class="video-wrapper-left">
<devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>
<p>Lorem ipsum dolor...</p>
Διαδήλωση
Πλήρους πλάτους
Το παρακάτω παράδειγμα δείχνει πώς εμφανίζεται ένα ενσωματωμένο βίντεο YouTube όταν <devsite-video> είναι τυλιγμένο σε ένα στοιχείο <div> του οποίου το χαρακτηριστικό class έχει οριστεί σε video-wrapper-full-width .
Το βίντεο είναι 100% του πλάτους της περιοχής περιεχομένου και δεν επηρεάζει τη διάταξη οποιουδήποτε περιεχομένου του βίντεο προηγείται.
Κώδικας
<div class="video-wrapper-full-width">
<devsite-video video-id="Pgfbl_o9WvM"></devsite-video>
</div>
<p>Lorem ipsum dolor...</p>
Διαδήλωση
Σημειώσεις
Όλα τα παραδείγματα κώδικα χρησιμοποιούν το γραφικό στοιχείο Embed YouTube του DevSite , το οποίο παρακολουθεί αυτόματα τα δεδομένα του Google Analytics. Εκτός από ειδικές περιπτώσεις όπου δεν θέλετε να συλλέγετε στατιστικά στοιχεία χρήσης για ένα ενσωματωμένο βίντεο, χρησιμοποιήστε αυτό το γραφικό στοιχείο. Χωρίς αυτό, τα στατιστικά στοιχεία χρήσης για το βίντεό σας δεν θα αποστέλλονται στο Analytics.