עיצוב הודעות

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

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

עיצוב של הודעת טקסט

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

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

פורמט סמל דוגמה לקוד טקסט שמוצג ב-Google Chat
מודגש * *שלום* שלום
נטוי _ (קו תחתון) _hello_ שלום
קו חוצה ~ ~שלום~ שלום
רווח קבוע ` (קו נטוי לאחור) שלום hello
בלוק גופן ברוחב אחיד ` ` ` (שלוש מירכאות כפולות) ```
Hello
World
```		 Hello
World
רשימה עם תבליטים * או - (קו מפריד) ואחריו רווח

* זהו הפריט הראשון ברשימה

* זהו הפריט השני ברשימה
  • זהו הפריט הראשון ברשימה
  • זהו הפריט השני ברשימה

לדוגמה, ראו את קובץ ה-JSON הבא:

    {
      "text": "Your pizza delivery *has arrived*!\nThank you for using _Cymbal Pizza!_"
    }

ההודעה הזו עם הטקסט המעוצב מוצגת במרחב משותף ב-Chat באופן הבא:

אפליקציית Cymbal Pizza שולחת הודעת טקסט שהמשלוח הגיע.

הצגת עיצוב הטקסט שנשלח בהודעה

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

  • תחביר נוסף של Markdown לטקסט
  • אזכורים של משתמשים
  • היפר-קישורים בהתאמה אישית
  • סמלי אמוג'י בהתאמה אישית

לדוגמה, נניח שהמשתמש שלח את הטקסט הבא:

התקבלה הודעה ב-Chat עם המילה

אם העיצוב של ההודעה בוצע באמצעות התפריט Format בממשק המשתמש של Chat, השדה text מכיל את הטקסט בלבד, והשדה formattedText מכיל את הרכיבים של ה-Markup, את הטקסט ואת ההיפר-קישור. בדוגמה הבאה מוצג טיוטה של הודעת טקסט עם מילה שמכילה היפר-קישור, פריטים ברשימה ומילה אחת בכתב מודגש:

טיוטת הודעה עם המילה

ההודעה מתקבלת בפורמט הבא:

    {
      "text": "I can meet there at:\nNoon\n3 pm\n5 pm\nWhat time works for you?",
      "formattedText": "I can meet <http://example.com|there> at:\n* Noon\n* 3 pm\n* 5 pm\nWhat time works for *you*?",
    }

אם תכללו בטקסט של ההודעה כתובת URL של קישור רגיל, כמו http://www.example.com/, מערכת Google Chat תשתמש בה כטקסט של הקישור ותוסיף לאותו טקסט היפר-קישור אוטומטי לכתובת ה-URL שצוינה.

כדי להוסיף טקסט חלופי לקישור, צריך להשתמש בתחביר הבא:

תחביר לדוגמה טקסט שמוצג ב-Google Chat
<https://example.com|Example website>

השימוש בקווים אנכיים ובטקסט הקישור הם אופציונליים, כך שהערכים <https://www.example.com/> ו-https://www.example.com/ זהים.

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

אפליקציות צ'אט יכולות לשלוח הודעות טקסט עם @mention של משתמש אחד או של כל המשתמשים במרחב משותף ב-Chat. באפליקציות ל-Chat אסור לאזכר משתמשים מבמרחבים שנמצאים במצב ייבוא או משתמשים שלא הצטרפו למרחב המשותף.

אזכור של משתמשים ספציפיים באמצעות @

כדי לציין משתמש מסוים בתיוג @, מוסיפים את הערך <users/{user}> להודעת הטקסט, כאשר {user} הוא המזהה של המשתמש. לדוגמה, נבחן את הודעת הטקסט הבאה שבה 123456789012345678901 מייצג את המזהה של המשתמש Mahan S.

{
    "text": "A customer has reported an issue. Assigning ticket #942 to <users/123456789012345678901>."
}

הודעת הטקסט תוצג כך:

מישהו מופיע באפליקציית Chat בהודעות טקסט.

אפשר לציין את הערך של users/{user} בדרכים הבאות:

  • אם אפליקציית Google Chat מגיבה להודעה שנשלחה מהמשתמש, תוכלו להשתמש בשדה message.sender.name של אירוע האינטראקציה MESSAGE.

  • אם אפליקציית Google Chat יוצרת הודעת טקסט אסינכררונית, אפשר לציין את הערך של users/{user} בדרכים הבאות:

    • משתמשים בשדה name של המשאב User ב-Google Chat, למשל users/123456789012345678901.
    • משתמשים בכתובת האימייל של המשתמש ככתובת חלופית לערך {user}. לדוגמה, אם כתובת האימייל היא mahan@example.com, תוכלו לציין את המשתמש כ-users/mahan@example.com. כדי להשתמש בכתובת אימייל חלופית, אפליקציית Google Chat צריכה לבצע אימות כמשתמש.

  • אם אתם משתמשים ב-People API, תוכלו גם להשתמש בשיטה people.get כדי לזהות את מזהה המשתמש.

אזכור כל המשתמשים באמצעות @

כדי ליצור הודעת טקסט עם אזכור של כל המשתתפים במרחב המשותף, מחליפים את {user} ב-all. בדוגמה הבאה ל-JSON מציינים את כל המשתמשים בהודעה:

{
    "text": "Important message for <users/all>: Code freeze starts at midnight tonight!"
}

עיצוב טקסט שמופיע בכרטיסים

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

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

פתיחת הכלי ליצירת כרטיסים

עיצוב טקסט של פסקה

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

פורמט דוגמה התוצאה שעבר רינדור
מודגש "This is <b>bold</b>." זה מודגש.
נטוי "This is <i>italics</i>." הטקסט הזה נטוי.
קו תחתון "This is <u>underline</u>." זהו קו תחתון.
קו חוצה "This is <s>strikethrough</s>." זהו קו חוצה.
צבע גופן "This is <font color=\"#FF0000\">red font</font>." זהו גופן אדום.
Hyperlink "This is a <a href=\"https://www.google.com\">hyperlink</a>." זהו היפר-קישור.
שעה "This is a time format: <time>2023-02-16 15:00</time>." זהו פורמט שעה: .
שורה חדשה "This is the first line. <br> This is a new line. אינץ' זו השורה הראשונה.
זו שורה חדשה.

הוספת סמלים לטקסט

כדי להציג סמלים לצד טקסט בכרטיס, תוכלו להשתמש בווידג'טים DecoratedText ו-ButtonList.

בקטעים הבאים מוסבר איך להשתמש בסמלים מובנים, בסמלי Material של Google או בסמלים מותאמים אישית בטקסט מקושט או בלחצנים.

שימוש בסמלים מ-Chat

כדי להשתמש בסמלים מובנים שזמינים ב-Chat, צריך לציין את אחת מהאפשרויות הבאות:

בטבלה הבאה מפורטים הסמלים המובנים הזמינים להודעות לגבי כרטיסים:

מטוס סימנייה
אוטובוס CAR
שעון CONFIRMATION_NUMBER_ICON
תיאור דולר ארה"ב
אימייל EVENT_SEAT
FLIGHT_ARRIVAL FLIGHT_DEPARTURE
HOTEL HOTEL_ROOM_TYPE
INVITE MAP_PIN
מינוי MULTIPLE_PEOPLE
PERSON PHONE
RESTAURANT_ICON SHOPPING_CART
STAR STORE
TICKET אימון
VIDEO_CAMERA VIDEO_PLAY

לפניכם דוגמה לכרטיס עם סמל של אימייל:

שימוש בסמלים של Google Material

אתם יכולים להשתמש בסמלי Google Material כדי לבחור מתוך יותר מ-2,500 אפשרויות של סמלים ולהתאים אישית את העובי, המילוי והרמה של הסמלים.

הנה דוגמה לכרטיס עם סמל של חומר לימוד של Google:

שימוש בסמלים מותאמים אישית

כדי להוסיף סמל בהתאמה אישית, צריך לכלול את השדה iconUrl ולציין את כתובת ה-URL המתאימה של הסמל.

דוגמה לסמל מותאם אישית: