רוצים לגלות איך פותחים סרטון יוטיוב בפופאפ בוורדפרס?

La Lightbox או חלון מודאלי (מוקפץ) הוא תכונה נפוצה מאוד ברשת. עם זאת, הוא משמש בדרך כלל להצגת תמונות, טפסי לכידת דואר אלקטרוני, מבצעים או אפילו טפסי הרשמה. 

אבל האם ידעת שאפשר להשתמש בו גם כדי להציג סרטונים וורדפרס ? לא? 

אין דאגות, במדריך זה אראה לכם כיצד להציג סרטון (YouTube - Vimeo - וכו') בתוך Lightbox.

אבל לפני כן, אם מעולם לא התקנת גילוי וורדפרס כיצד להתקין צעדים 7 בלוג וורדפרס et איך למצוא, להתקין ולהפעיל WordPress נושא בבלוג שלך 

ואז חזרה למה אנחנו כאן.

הסיבות לכך שכדאי להשתמש בא lightbox להצגת הסרטונים שלך 

לס Lightbox הם חלונות מודליים, עם זאת, מה שלא ידוע לך הוא שלא כל התמונות המוצגות בהם נטענות במהלך ה- « טעינה«  דף. 

Le Navigateur תשלום les תמונות כאשר Lightbox נפתח, זה המקרה גם לסרטונים. בקיצור, זו תכונה ש יאפשר לדפים שלך להיפתח מהר יותר. זה גם יאפשר לך להפחית את הגודל (longueur) של הדף שלךמכיוון שחלק מתוכן עמוד זה יהיה זמין בחלון מודאלי זה.

הפטפטות, בואו נגיע לעניינים.

כיצד להתקין ולהגדיר חיבור WP Video Lightbox

WP Video Lightbox הוא חיבור זמין באתר WordPress.org. מה שאומר שאתה יכול להתקין אותו ישירות ממרכז השליטה שלך ב- WordPress, או להוריד אותו כקובץ .zip.

לפרטים נוספים, עיין במדריך השלב אחר שלב כיצד להתקין תוסף WordPress.

לאחר הפעלת ה- חיבור, עבור לדף ההגדרות שלו ממיקום זה " הגדרות >> וידאו Lightbox ".

נלך ישירות אל " prettyPhoto ".

במציאות, זה חיבור להשתמש אחרת חיבור, המיועד בעיקר להצגת גלריית תמונות. אבל אתה יכול לשנות חלק מהמידע שיוחל על סרטונים.

לשם כך אסביר כמה אפשרויות (חובה)אז שזה כרצונך.

כבר חנות הספרים prettyPhoto חייב להיות מופעל (בדוק « אפשר prettyPhoto »)כדי ליידע את המשתמשים שהם נמצאים באותו דף, אתה יכול להפוך את החלון לשקוף (להגדיר ערך מ- 0 ל- 1. ערכי פסיקים מתקבלים).

לגלות המאפיינים של קופץ יעיל עבור וורדפרס 

לכל תיבות האור שלך יכול להיות כותרת שניתן להציג (לְהַצִיג כותרת). לפעמים עבור חלונות מודאליים גדולים אתה צריך לאפשר שינוי גודל (להתיר לשנות את הגודל). ולסרטונים ארוכים יותר, המשתמשים יוכלו להגדיל אותם (להתיר לְהַרְחִיב), נראה טוב יותר.

עבור רוחב וגובה של Lightbox, אתה יכול לערוך את השדות " ברירת מחדל רוחב "וגם" ברירת מחדל גובה ". 

לבחירת הנושא של Lightbox, שנה את התפריט הנפתח נושא ". אפשר גם להפעיל הפעלה אוטומטית (סמן את התיבה " הפעלה אוטומטית ").

לפתוח סרטון Youtube בחלון קופץ - הגדר-לס-רגאלג '

כיצד להציג Lightbox בכתבה

Le חיבור מציע רשימה של shortcodes שיאפשר לך להציג Lightbox במאמרים. שכחתי לומר לך שאתה יכול גם לצפות בסרטונים הזמינים באתר Vimeo.

לצפייה בסרטון YouTube ou Vimeoעליך להשתמש ב- shortcodes suivant:

[video_lightbox_youtube] (pour YouTube)
[video_lightbox_vimeo5] (pour Vimeo)

כל אחד מהם shortcodes מקבל פרמטרים, שיאפשרו לך:

  • הגדר את המזהה (video_id) של סרטון, בדרך כלל בפורמט זה " YzqKMmQ_3Sg ". דוגמה [video_lightbox_youtub video_id = "YzqKMmQ_3Sg"]
  • קבע את גובה הסרטון (גובה)
  • קבע את רוחב הסרטון (רוחב)
  • הוסף תיאור (תיאור)
  • הוסף עוגן HTML (עוגן), או טקסט של הקישור שיפתח את החלון
  • הוסף תמונה ממוזערת (auto_thumb)

אם תגדיר עוגן HTML, תתעלם מהתמונה הממוזערת. אחרת, auto_thumb לוקח את הערך " 1 ".

המשך הלאה על ידי גילוי גם כיצד להשתמש ולנהל וורדפרס מספרים מקוצרים

הדגמה של שימוש

עם מה שרגע סיפקתי לך מידע, אתה יכול להציג סרטון באמצעות קוד הדומה לזה:

[video_lightbox_youtube video_id="YzqKMmQ_3Sg&rel=0width="640height="480anchor="Une simple vidéo" description="Par Dr WP"]

לתוצאה דומה

מצגת-עבור-תוצאות

אתה יכול להציג תמונה ממוזערת כמוצג למעלה עם קוד דומה לזה.

[video_lightbox_youtube video_id="YzqKMmQ_3Sg&rel=0width="640height="480auto_thumb="1description="Par Dr WP"]

לתוצאה זהה לזה

-דיונה מיניאטורי-וידאו

לפני שעזבתי

יש לציין כי כמה פרמטרים בסעיף shortcodes יחליף את אלה שהוגדרו בהגדרות.

גלה גם כמה תוספי וורדפרס מובחרים  

אתה יכול להשתמש באחר תוספים וורדפרס לתת מראה מודרני ולייעל את הטיפול בבלוג או באתר שלך.

אנו מציעים לכם כאן כמה תוספי וורדפרס מובחרים שיעזרו לכם לעשות זאת.

1. FileBird

FileBird

האם אי פעם נאבקת לנהל אלפי קבצי תמונות, וידאו או מסמכים שהעלית ל-FTP של WordPress שלך? כן או לא, זה לא משנה, הדבר החשוב הוא לדעת שה התוסף וורדפרס FileBird יעזור לך לנהל את קבצי המדיה שלך בקלות ולהביא כוח רב יותר לספרייה שלך.

ממשק המשתמש והתפריט ההקשר החלקים שלו מאפשרים למשתמשים לגרור ולשחרר קבצים לתיקיות או לקבל את הזכויות הדרושות ליצירה, שינוי שם או מחיקה של תיקיות במהירות באותה דרך שאתה עושה במחשב שלך. עם תוסף זה ביד, קבצי המדיה שלך יהיו מאורגנים באופן שיטתי ותוכל לבחור בקלות תמונה להכנס לדף או לפרסם אותה.

גלה גם את שלנו 6 תוספי וורדפרס כדי להפיח רוח חיים במאמרים שלך

בנוסף, תוסף זה תואם לחלוטין את התוספים הפופולריים ביותר, במיוחד עם WooCommerce, וכן תומך במספר רב של שפות. אז אם אתה רוצה לתת דחיפה לניהול ספריית המדיה שלך, ה התוסף וורדפרס FileBird יכול להיות הנשק הסודי שלך.

הורדהדגים אירוח אתרים

2. שיתוף חברתי & לוקר פרו

התוסף Social Share & Locker Pro תוכנן כדי לעזור לאתר שלך להיות גלוי יותר ברשתות החברתיות. בלחיצות ספורות בלבד תוכלו להגדיר את מיקום הסמלים החברתיים שלכם או לנעול את התוכן על ידי דרישה לשיתוף באחת מהרשתות החברתיות המוצעות על ידכם.

תוסף WordPress Share Locker Pro WordPress

יש לך 10 תבניות שאמורות לכסות את המשאלות הנפוצות ביותר. כל הדוגמניות שלה מושלמות ועובדות נפלא. כמו כן, עם Social Share & Locker Pro, תוכלו להציג את השם המלא של הרשתות החברתיות או רק את הסמל. זה יהיה תלוי בעיצוב שלך, במקום הפנוי או בטעם שלך.

הורד | הדגים | אירוח אתרים

3. טופס יצירת קשר 7 Tooltips

זה תוסף וורדפרס של התוסף Contact Form 7 מביא פונקציונליות קלה של תיאור כלים לתוסף Contact Form 7. עצות הכלים שלו יוצגו כאשר רכיב היעד מרחף מעל. במכשירים ניידים, עצות כלים מציינים מתי רכיב היעד מופעל.

טיפים ליצירת כלים של טופס יצירת קשר 7

המאפיינים העיקריים שלו הם: קלות שימוש, תמיכה בכל הגרסאות של טופס צור קשר 7, התאמה אישית של צבע הרקע של תיאור הכלים, תמיכה בקוד HTML, פריסה מלאה מגיבים, ועוד.

הורד | הדגים | אירוח אתרים

משאבים מומלצים אחרים

אנו מזמינים אתכם להתייעץ עם המשאבים להלן בכדי להתקדם ולשלוט באתר ובבלוג שלכם.

סיכום

יש! זהו זה עבור הדרכה זו, מקווה שזה יעזור לך להציג קטעי וידאו של YouTube או Vimeo ב- lightbox באתר וורדפרס שלך. תרגיש חופשי ל שתף עם חבריך ברשתות החברתיות המועדפות עליך

עם זאת, תוכל גם להיות מסוגל להתייעץ שלנו ressources, אם אתה זקוק ליותר אלמנטים לביצוע הפרויקטים שלך ליצירת אתרי אינטרנט, עיין במדריך שלנו בנושא יצירת בלוג של וורדפרס.

אבל בינתיים ספר לנו על שלך commentaires והצעות בחלק המוקדש.

...