• הודעות
  • אשכולות
  • רשומים
  • לייקים
  • מחוברים כרגע
הרשמה לאתר הרשמה באמצעות facebook

המדריך השלם לשימוש בטבלאות באתר - מבסיסי ועד מתקדם

  1. 01-10-2015 23:22 #1
    הסמל האישי שלOIympus
    19,276
    5466
    03-07-13
    OIympus מנותק מנהל ראשי, ראש צוות הגהה ומפקח צוות דיבורים לשעבר
    בן
    המדריך השלם לשימוש בטבלאות באתר - מבסיסי ועד מתקדם
    שלום גולשים יקרים,
    במדריך זה נציג את השימוש הבסיסי ואף המתקדם בטבלאות באתר. במדריך נציג דברים בסיסיים כמו איך ליצור טבלה, להוסיף ולהסיר עמודות או שורות וכן דברים מתקדמים יותר כמו איך לצבוע שורות ועמודות בטבלה או לצבוע את קווי הטבלה בצבעים שונים.

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

    המדריך השלם לשימוש בטבלאות באתר - מבסיסי ועד מתקדם

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

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

    המדריך השלם לשימוש בטבלאות באתר - מבסיסי ועד מתקדם

    שורות & עמודות:
    פונקציית השורות והעמודות נותנת אפשרות ביצירת הטבלה לקבוע כמה שורות וכמה עמודות יהיו לטבלה.

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

    המדריך השלם לשימוש בטבלאות באתר - מבסיסי ועד מתקדם

    שימו לב - ניתן לקבוע את רוחב הטבלה ע"פ אחוזים, 100% יתנו לטבלה את הרוחב של כל האשכול, 50% את רוחב מחצית מהאשכול וכו'.

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

    המדריך השלם לשימוש בטבלאות באתר - מבסיסי ועד מתקדם

    אך כאשר הטבלה מוצגת בהודעה או באשכול היא נראית ככה:
    123
    456
    789

    טבלה עם גבול חיצוני נראית כך:
    123
    456
    789

    ולבסוף, טבלה בעלת רשת מלאה, נראית כך:
    123
    456
    789

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

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

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

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

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


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

    נערך לאחרונה על ידי OIympus, 02-10-2015 בשעה 00:48

  2. 01-10-2015 23:23 #2
    הסמל האישי שלOIympus
    19,276
    5466
    03-07-13
    OIympus מנותק מנהל ראשי, ראש צוות הגהה ומפקח צוות דיבורים לשעבר
    בן
    מתקדם:
    לפני שאתחיל במדריך המתקדם, שימו לב שגם משתמשים שלא יודעים להשתמש בקודים יכולים ללמוד ולהצליח, למרות שזה נראה מסובך.
    בכדי להשתמש במדריך הזה הידע הקודם היחידי שעליכם לבוא איתו הוא זיהוי אותיות בשפה האנגלית והדבר הבא שאלמד אתכם:
    באתר ישנה אפשרות להגיע לקוד המקור של ההודעה שאתה כותב ובכך לשנות מאפיינים שונים באופן הצגת ההודעה. בכדי להגיע לקוד המקור, עליכם להשתמש בכלי שמסומן בתמונה הבאה:


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


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



    "הדברים" המפחידים האלה בתוך הסוגריים נקראים Tags, כדי שלא תיבהלו, צירפתי ופירטתי בתמונה מה תפקידו של כל Tag.
    בכדי לשנות את צבע השורה, עליכם לשנות מעט את ה-Tag שתפקידו לפתוח שורה ולתת לו מאפיינים (בדיוק כמו המאפיינים שבפתיחת הטבלה).

    המאפיין שניתן ל- Tag הוא מאפיין של צבע, נשנה את ה- Tag הזה:
    קוד:
    [TR]
    ונוסיף לו את המאפיין הבא:
    קוד:
    [TR="bgcolor: #XXXXXX"]
    ברגע זה, הוספנו מאפיין חדש שנקרא bgcolor (קיצור של background color), לשורה שבחרנו. כעת, שימו לב שסימנתי באדום חלק מסויים. החלק הזה מסמל את הצבע בו תהיה השורה ומכיוון שעברנו למצב קוד מקור הכל נמצא בקודים, כך גם הצבעים. תוכלו למצוא את רשימת הצבעים המלאה והקודים שלהם באתר הזה.

    לאחר שבחרתי צבע שנראה לי מתאים, זה נראה כך:
    קוד:
    [TR="bgcolor: #7094FF"]
    התוצאה של הטבלה שיצאה לי, לפניכם:


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



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

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



    לאחר מכן, חזרו למצב קוד המקור ואתם תראו את הריבוע שלכם בצורה הזו:



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

    נשנה את ה- Tag הזה:
    קוד:
    [TD]
    ונוסיף לו את המאפיין הבא:
    קוד:
    [TD="bgcolor: #XXXXXX"]
    גם כאן, תוכלו להיעזר באתר הבא בכדי לבחור את הקוד לצבע שמתאים לכם.

    לאחר שבחרתי צבע שנראה לי מתאים, הקוד נראה כך:
    קוד:
    [TD="bgcolor: #7094FF"]
    התוצאה של הטבלה שיצאה לי, לפניכם:
    נועם!


    בהודעה הבאה תקבלו כמה בונוסים מיוחדים, ביניהם תראו איך צובעים קווי גבול בטבלה
    נערך לאחרונה על ידי OIympus, 02-10-2015 בשעה 00:49

  3. 02-10-2015 00:37 #3
    הסמל האישי שלOIympus
    19,276
    5466
    03-07-13
    OIympus מנותק מנהל ראשי, ראש צוות הגהה ומפקח צוות דיבורים לשעבר
    בן
    צביעת קווי גבול בטבלה:
    קו גבול בטבלה הוא הקו המפריד המתווסף לטבלה באפשרות ההצגה הנקראת "גבול חיצוני" ובנוסף "רשת מלאה". בברירת המחדל של הפורום, הקו נצבע בצבע שחור ובמדריך זה נלמד איך לשנות את הצבע שלו ולהכניס קצת חיים לטבלה!

    בכדי לשנות את צבע קו הגבול של הטבלה, עלינו להוסיף שני Tag חדש הנקרא "COLOR" ו- Tag נוסף שיסגור אותו. את שני ה- Tags נוסיף בפתיחת הטבלה ולאחר סגירתה.



    כפי שלמדנו במדריכים הקודמים עלינו להוסיף מאפיין ל- Tag הפתיחה:
    קוד:
    [COLOR=#XXXXXX]
    סוגר:
    קוד:
    [/COLOR]
    לאחר בחירת הצבע:
    קוד:
    [COLOR=#3366cc]
    ולבסוף, כך נראית הטבלה:




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

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

    לאחר שאיתרנו את סוג הטבלה, כל שעלינו לעשות הוא לשנות אותו לסוג הטבלה שאנחנו רוצים, סוג הטבלה "הנסתרת" בקוד הוא: "cms_table".
    קוד:
    class: cms_table
    ולבסוף, כך נראית הטבלה:


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


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


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


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


    בברכה,
    צוות תמיכה
    נערך לאחרונה על ידי OIympus, 02-10-2015 בשעה 10:28

מקרא דרגות:  » יו"ר » מנכ"ל » מנהל ראשי » מפקח » מנהל בכיר » מנהל פורום » צוות תוכן » משתמש כבוד » היכל התהילה » Champ » משקיען כבוד » Winner