בחזרה לתמיכה תוכן ומדיה בלוקים בלוק המדיה והטקסט

בלוק המדיה והטקסט

ניתן להשתמש בבלוק המדיה והטקסט כדי למקם תמונות או וידאו מימין או משמאל לטקסט.

הוספת בלוק המדיה והטקסט

כדי להוסיף את בלוק המדיה והטקסט, יש ללחוץ על הסמל + של מוסיף הבלוקים ולחפש את "media" (מדיה). יש ללחוץ על האפשרות כדי להוסיף את הבלוק לפוסט או לעמוד.

💡

באמצעות המקלדת, אפשר גם להקליד ‎/media בשורה חדשה ולהקיש על Enter כדי להוסיף במהירות בלוק מדיה וטקסט חדש .

הוספת בלוק מדיה וטקסט בעזרת פקודה של קו נטוי.

ניתן לראות הוראות מפורטות על הוספת בלוקים כאן.

הוספת תוכן לבלוק

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

בלוק מדיה וטקסט ללא תוכן מותאם אישית.

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

  1. העלאה: יש ללחוץ כדי להעלות תמונה חדשה או וידאו חדש מהמחשב אל בלוק המדיה והטקסט.
  2. בחירת מדיה: יש ללחוץ כדי לבחור מבין תמונות או וידאו שכבר הועלו לספריית המדיה או לבחור מתוך Google Photos, מספריית התמונות החינמית של Pexels או מ-Openverse.
  3. תוכן: יש ללחוץ ולהקליד כדי להוסיף תוכן טקסט באזור זה. פעולה זו תוסיף את התוכן באופן אוטומטי לבלוק פסקה. אפשר גם להקליד / כדי לבחור כל בלוק אחר המועדף לשימוש במקטע זה, ואין הגבלה לטקסט בלבד.

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

בלוק מדיה וטקסט עם תוכן מותאם אישית שנוסף.
דוגמה לבלוק מדיה וטקסט עם תוכן מותאם אישית שנוסף.

סרגל הכלים של הבלוק

כאשר לוחצים על הבלוק, יופיע מעליו סרגל כלים עם אפשרויות:

סרגל הכלים של בלוק המדיה והטקסט.

בבלוק המדיה והטקסט יש את האפשרויות הבאות בסרגל הכלים:

📌

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

הגדרות הבלוק

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

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

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

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

לחתוך את התמונה כדי למלא את הטור

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

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

טקסט חלופי

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

גודל תמונה

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

רוחב מדיה

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

מתקדם

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

למידע נוסף על עוגני HTMLכאן. ניתן גם לקבל מידע נוסף על הוספת סיווגים של CSS נוסף לבלוקים כאן.

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

סגנונות בלוק

יש ללחוץ על סמל גלגל הסגנונות כדי לקבל גישה להגדרות עיצוב נוספות עבור הבלוק.

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

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

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

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

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

ניתן גם להגדיר ערך ספציפי על ידי לחיצה על סמל הסליידר מעל בחירות ברירת המחדל, המסומן עם 1 בצילום המסך להלן. ניתן לשנות את היחידות על ידי לחיצה במקום שבו מסומן מספר 2 בצילום המסך להלן. האפשרויות הן פיקסלים, em או rem.

הגדרות גודל גופן של טיפוגרפיה

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

האפשרות מראה מאפשרת לך לשנות את סגנון הטקסט מרגיל לנטוי, ומדק למודגש במיוחד.

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

האפשרות עיטור כוללת אפשרויות עבור קו תחתון וקו חוצה.

האפשרות אותיות רישיות מאפשרת לך להפוך את הטקסט כולו לאותיות רישיות, להפוך את האות הראשונה לרישית או להפוך את הטקסט כולו לאותיות קטנות.

מרווחים בין אותיות מגדירים את המרווח בין כל תו בטקסט. ניתן לשנות את היחידות מברירת המחדל (פיקסלים) לאחוזים, em, rem, vw ו-vh. ניתן לקבל מידע נוסף על יחידות יחסיות כאן.

האפשרות עיטור כוללת אפשרויות עבור קו תחתון וקו חוצה.

ממדים

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

חצים שמצביעים על הכפתור '+' ליד הממדים, אשר מציג אפשרויות שניתנות ללחיצה כדי להגדיר את המרווחים או השוליים.

יש ללחוץ על הסמל + שלצד ממדים כדי לבחור ולהפעיל את הגדרות הממדים של 'מרווחים' ו'שוליים'.

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

הגדרות השוליים ישפיעו על השטח מחוץ לגבולות הבלוק שנבחר.

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

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

חץ שמצביע על סמל הקישור לצד 'מרווחים' ו'שוליים', אשר פותח את הפקדים לממדים של החלק העליון, הימני, התחתון והשמאלי.

כדי לשנות את יחידת המידה בהגדרות של המרווחים והשוליים, יש ללחוץ על PX כדי להציג תפריט נפתח עם יחידות מידה נתמכות אחרות: %, EM,‏ REM‏, VW ו-VH.

הנפשת GIF שמדגימה את התהליך של לחיצה על PX כדי לפתוח את התפריט הנפתח של שאר יחידות המידה.
Copied to clipboard!