כיצד להטביע בקלות קוד iFrame בוורדפרס (3 שיטות)

שתף פוסט זה

שיתוף ב facebook
שיתוף ב linkedin
שיתוף ב twitter
שיתוף ב email
0
(0)

האם ברצונך להטביע קוד iFrame בפוסט או בדף וורדפרס?

IFrames מספקים דרך קלה להטביע וידאו או תוכן אחר באתר שלך מבלי להעלות אותו. פלטפורמות צד שלישי רבות כמו YouTube מאפשרות למשתמשים להשתמש ב- iframe כדי להטביע תוכן מהאתר שלהם.

במאמר זה, נראה לך כיצד להטביע בקלות קוד iFrame בוורדפרס באמצעות שיטות מרובות.

הטבעה בקלות קוד iFrame בוורדפרס

מהו iFrame?

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

ה- iframe הוא כמו פתיחת חלון באתר שלך כדי להציג תוכן חיצוני. התוכן בפועל עדיין נטען מהמקור ממנו אתה מטביע.

כדי להוסיף iframe, עליך להוסיף קוד HTML מיוחד. אל תדאג אם זה נשמע טכני למדי.

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

מדוע להשתמש ב- iFrames?

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

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

יתרון נוסף הוא שאם התוכן המקורי משתנה, הוא יעודכן באופן אוטומטי גם ב- iFrame.

תמונה של אנשים מצוירים המוסיפים תוכן לאתר אינטרנט

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

בעיה נוספת היא אתרי HTTPS יכולים להשתמש רק iFrames עבור תוכן מאתרי HTTPS אחרים. באופן דומה, אתרי HTTP יכולים להשתמש רק ב- iFrames עבור תוכן מאתרי HTTP אחרים.

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

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

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

עם זאת, בואו נסתכל על שלוש דרכים שונות כדי להוסיף iFrames לאתר שלך.

1. השתמש בקוד הטבעה של המקור כדי להוסיף iFrame בוורדפרס

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

ב-YouTube, אתה יכול לקבל קוד זה על ידי הולך וידאו ב-YouTube, ולאחר מכן לחיצה על לחצן שתף מתחתיו.

לחיצה על לחצן שתף עבור סרטון YouTube שבחרת

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

לחיצה על לחצן הטבעה כדי לקבל את הקוד הטביע YouTube

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

לאחר מכן, לחץ על לחצן העתק כדי להעתיק את הקוד.

העתקת הקוד ההטבעה עבור סרטון YouTube

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

כדי ליצור דף חדש, עבור אל דפים » הוסף חדש בלוח המחוונים של וורדפרס.

לאחר מכן, הוסף בלוק HTML לדף שלך.

הוספת בלוק HTML מותאם אישית לוורדפרס

עכשיו, אתה צריך להדביק את קוד iFrame YouTube לתוך בלוק זה.

הדבקת קוד HTML של YouTube בבלוק iFrame

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

הצגת הסרטון המוטבע בשידור חי באתר האינטרנט שלך

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

הוספת קוד iFrame של YouTube בעורך הקלאסי

מעבר בין התצוגה החזותית לתצוגת טקסט בעורך הקלאסי עלול לגרום לבעיות בקוד iFrame.

2. שימוש בתוסף וורדפרס iFrame כדי להטביע iFrame

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

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

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

הוספת בלוק קוד קצר בעורך הבלוקים

לאחר מכן, באפשרותך להשתמש בקוד קצר זה כדי להזין את קוד ה- iFrame שלך.

[iframe src="URL goes here"]

פשוט החלף כתובת URL נמצאת כאן עם כתובת ה- URL של התוכן שברצונך להטביע באתר שלך. אנחנו מטביעים מפה של גוגל.

עצה: ייתכן שיהיה עליך להשתמש באפשרות הטבע כדי לקבל את כתובת ה- URL הישירה של התוכן. עליך להשתמש רק בכתובת ה- URL, לא בשאר הקוד ההטבעה.

הקוד הקצר להטבעת מפת גוגל

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

מפת גוגל מוטבעת באתר

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

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

הוספת הקוד הקצר בעורך הקלאסי

3. יצירה ידנית של קוד iFrame והטביעה בוורדפרס

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

הוספת בלוק HTML מותאם אישית

תחילה, עליך להדביק קוד זה בבלוק ה- HTML שלך.

<iframe src="URL goes here"></iframe>

פשוט החלף את "כתובת URL עוברת כאן" בכתובת ה- URL הישירה עבור התוכן שברצונך להטביע. אתה צריך רק את כתובת ה- URL עצמה.

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

הזנת קוד ה-iFrame עבור מפת Google

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

<iframe src="URL goes here" width="600" height="300"></iframe>

תכון שימושי אם עליך להגביל את התוכן המוטבע לחלל קטן יותר.

מפת Google באתר עם גובה ורוחב מוגדרים

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

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

.
פורסם על ידי wpbeginner

כמה שימושי היה הפוסט?

לחץ על כוכב כדי לדרג אותו!

דירוג ממוצע 0 / 5. ספירת קולות: 0

אין הצבעות עד כה! היה הראשון לדרג את הפוסט הזה.

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?

הצטרף לדיוור שלנו

קבל ראשון את העדכונים

פוסטים נוספים

כללי

ניסיון טקסט נגלל

5 (2) רב טקסט בוורדפרס מתני' מאימתי קורין את שמע בערבין. משעה שהכהנים נכנסים לאכול בתרומתן עד סוף האשמורה הראשונה דברי ר' אליעזר. וחכמים אומרים

מעצבים עם אלמנטור: תפריט וואן פייג'

5 (1) בסרטון הזה נראה איך לעצב תפריט צד דביק באתר וואן פייג' עם אלמנטור (תוכן זה מוגש כאן מתוך אתר יוטיוב והזכויות שמורות למעלה

16 שינוי צבעי ברירת המחדל של אלמנטור

0 (0) (תוכן זה מוגש כאן מתוך אתר יוטיוב והזכויות שמורות למעלה ההרצאה ליוטיוב) כמה שימושי היה הפוסט? לחץ על כוכב כדי לדרג אותו! שלח

האם אתה רוצה להגביר את העסק שלך?

שמור על קשר

X
wpChatIcon
X

הוסף את שאלתך

האתר בבניה

הכניסה ליוצרים בלבד

כבר רשום?