سيتم إيقاف "إجراءات المحادثة" في 13 حزيران (يونيو) 2023. لمزيد من المعلومات، يُرجى الاطّلاع على إنهاء إجراءات المحادثة.

الردود المنسَّقة

تنظيم صفحاتك في مجموعات يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.

تضيف الردود المنسَّقة عناصر مرئية لتحسين تفاعلات المستخدم مع الإجراء. يمكنك استخدام أنواع الردود المنسّقة التالية كجزء من رسالة مطالبة:

  • البطاقة الأساسية
  • بطاقة الصورة
  • بطاقة جدول

عند تحديد استجابة منسّقة، استخدِم مرشحًا مع إمكانية الوصول إلى RICH_RESPONSE بحيث لا يعرض "مساعد Google" الاستجابة المنسّقة إلا على الأجهزة المتوافقة. يمكنك استخدام رد واحد منسّق فقط لكل كائن content في رسالة مطالبة.

البطاقة الأساسية

تم تصميم البطاقات الأساسية بحيث تكون مختصرة، لتقديم المعلومات الرئيسية (أو الملخص) للمستخدمين، والسماح للمستخدمين بمعرفة المزيد إذا اخترت ذلك (باستخدام رابط ويب).

استخدم البطاقات الأساسية بشكل أساسي لأغراض العرض، نظرًا لعدم وجود إمكانيات للتفاعل بدون زر. لربط زر بالويب، يجب أن تتوفّر أيضًا إمكانية WEB_LINK للسطح.

مثال على بطاقة أساسية على شاشة ذكية

أماكن إقامة

يتضمن نوع استجابة البطاقة الأساسية الخصائص التالية:

الخاصية النوع المتطلب الوصف
title سلسلة اختياري عنوان نص عادي للبطاقة. العناوين لخط وحجم ثابتين، ويتم اقتطاع الأحرف التي تتجاوز السطر الأول. يتم تصغير ارتفاع البطاقة في حال عدم تحديد عنوان.
subtitle سلسلة اختياري ترجمة نص عادي للبطاقة. العناوين لها خط وحجم ثابتين، ويتم اقتطاع الأحرف التي تتجاوز السطر الأول. يتم تصغير ارتفاع البطاقة في حال عدم تحديد عنوان فرعي.
text سلسلة الجملة الشرطية

محتوى نص عادي للبطاقة. يتم اقتطاع النص الطويل جدًا في آخر فاصل كلمات بعلامة حذف. يجب استخدام هذه السمة ما لم يتوفّر image.

يخضع هذا الموقع للقيود التالية:

  • 15 سطرًا كحدّ أقصى بدون صورة أو 10 أسطر تحتوي على image. وهذه القيمة هي 750 حرفًا تقريبًا (بدون صورة) أو 500 حرف (مع صورة). يُرجى العِلم أنّ الأجهزة الجوّالة تقتطع النص الذي يسبق الأسطح ذات الشاشات الأكبر حجمًا.
  • يجب ألا يحتوي النص على رابط.

تتوفّر مجموعة فرعية محدودة من Markdown:

  • سطر جديد مع مسافة مزدوجة متبوعة بـ \n
  • **bold**
  • *italics*
image Image اختياري الصورة المعروضة في البطاقة. يمكن أن تكون الصور بتنسيق JPG وPNG وGIF (سواء كانت متحركة أو غير متحركة).
image_fill ImageFill اختياري حد بين البطاقة وحاوية الصورة المطلوب استخدامها عندما لا تتطابق نسبة العرض إلى الارتفاع للصورة مع نسبة العرض إلى الارتفاع لحاوية الصورة
button Link اختياري زر يربط المستخدم بعنوان URL عند النقر عليه. ويجب أن يحتوي الزر على الخاصية name التي تحتوي على نص الزر، والخاصية url التي تحتوي على عنوان URL للرابط. قد لا يكون نص الزر مضللاً، ويتم التحقق منه أثناء عملية المراجعة.

نموذج التعليمات البرمجية

ياميل

candidates:
  - first_simple:
      variants:
        - speech: This is a card.
          text: This is a card.
    content:
      card:
        title: Card Title
        subtitle: Card Subtitle
        text: Card Content
        image:
          url: 'https://developers.google.com/assistant/assistant_96.png'
          alt: Google Assistant logo

JSON

{
  "candidates": [
    {
      "first_simple": {
        "variants": [
          {
            "speech": "This is a card.",
            "text": "This is a card."
          }
        ]
      },
      "content": {
        "card": {
          "title": "Card Title",
          "subtitle": "Card Subtitle",
          "text": "Card Content",
          "image": {
            "url": "https://developers.google.com/assistant/assistant_96.png",
            "alt": "Google Assistant logo"
          }
        }
      }
    }
  ]
}

Node.js

app.handle('Card', conv => {
  conv.add('This is a card.');
  conv.add(new Card({
    "title": "Card Title",
    "subtitle": "Card Subtitle",
    "text": "Card Content",
    "image": new Image({
      url: 'https://developers.google.com/assistant/assistant_96.png',
      alt: 'Google Assistant logo'
    })
  }));
});

JSON

{
  "responseJson": {
    "session": {
      "id": "session_id",
      "params": {}
    },
    "prompt": {
      "override": false,
      "content": {
        "card": {
          "title": "Card Title",
          "subtitle": "Card Subtitle",
          "text": "Card Content",
          "image": {
            "alt": "Google Assistant logo",
            "height": 0,
            "url": "https://developers.google.com/assistant/assistant_96.png",
            "width": 0
          }
        }
      },
      "firstSimple": {
        "speech": "This is a card.",
        "text": "This is a card."
      }
    }
  }
}

بطاقات الصور

تم تصميم بطاقات الصور بحيث تكون بديلاً أكثر بساطة للبطاقة الأساسية التي تحتوي أيضًا على صورة. استخدم بطاقة صورة عندما تريد مشاركة عرض صورة، وليست هناك حاجة إلى دعم النص أو المكونات التفاعلية.

أماكن إقامة

يتضمن نوع استجابة بطاقة الصورة الخصائص التالية:

الخاصية النوع المتطلب الوصف
url سلسلة مطلوب عنوان URL المصدر للصورة. يمكن أن تكون الصور بتنسيق JPG أو PNG أو GIF (مع إمكانية تحريكها وجعلها غير متحركة).
alt سلسلة مطلوب وصف نصي للصورة المراد استخدامها في إمكانية الوصول.
height int32 اختياري ارتفاع الصورة بالبكسل.
width int32 اختياري عرض الصورة بالبكسل.

نموذج التعليمات البرمجية

ياميل

candidates:
  - first_simple:
      variants:
        - speech: This is an image prompt.
          text: This is an image prompt.
    content:
      image:
        alt: Google Assistant logo
        url: 'https://developers.google.com/assistant/assistant_96.png'

JSON

{
  "candidates": [
    {
      "first_simple": {
        "variants": [
          {
            "speech": "This is an image prompt.",
            "text": "This is an image prompt."
          }
        ]
      },
      "content": {
        "image": {
          "alt": "Google Assistant logo",
          "url": "https://developers.google.com/assistant/assistant_96.png"
        }
      }
    }
  ]
}

Node.js

app.handle('Image', conv => {
  conv.add("This is an image prompt!");
  conv.add(new Image({
      url: 'https://developers.google.com/assistant/assistant_96.png',
      alt: 'Google Assistant logo'
  }));
});

JSON

{
  "responseJson": {
    "session": {
      "id": "session_id",
      "params": {}
    },
    "prompt": {
      "override": false,
      "content": {
        "image": {
          "alt": "Google Assistant logo",
          "height": 0,
          "url": "https://developers.google.com/assistant/assistant_96.png",
          "width": 0
        }
      },
      "firstSimple": {
        "speech": "This is an image prompt.",
        "text": "This is an image prompt."
      }
    }
  }
}

بطاقات الطاولة

تتيح لك بطاقات الجداول عرض بيانات جدولية في إجابتك (على سبيل المثال، الترتيب الرياضي ونتائج الانتخابات والرحلات الجوية). يمكنك تحديد الأعمدة والصفوف (ما يصل إلى 3 صفوف) التي يعرضها المساعد في بطاقة جدولك. يمكنك أيضًا تحديد أعمدة وصفوف إضافية، مع تحديد أولوياتها.

مثال على بطاقة جدول على شاشة ذكية

تعرض الجداول بيانات ثابتة ولا يمكن التفاعل معها. للحصول على إجابات تفاعلية عن الاختيارات، يمكنك استخدام استجابة اختيار مرئي بدلاً من ذلك.

أماكن إقامة

يتضمن نوع استجابة بطاقة الجدول الخصائص التالية:

الخاصية النوع المتطلب الوصف
title سلسلة الجملة الشرطية عنوان نص عادي للجدول. وتكون هذه السمة مطلوبة في حال ضبط السمة subtitle.
subtitle سلسلة اختياري ترجمة نص عادي للجدول. ولا يؤثر ذلك في تخصيص المظاهر في بطاقات الجداول.
columns مصفوفة TableColumn مطلوب رؤوس الأعمدة ومحاذاتها. يصف كل كائن TableColumn عنوان عمود مختلف ومحاذاته في الجدول نفسه.
rows مصفوفة TableRow مطلوب

بيانات صف الجدول. من المؤكّد ظهور الصفوف الثلاثة الأولى، ولكن قد لا تظهر صفوف أخرى على أسطح معيّنة. يمكنك إجراء الاختبار باستخدام المحاكي لتحديد الصفوف التي يتم عرضها على سطح معيّن.

يصف كل كائن TableRow خلايا صف مختلف في الجدول نفسه.
image Image اختياري الصورة مرتبطة بالجدول.
button Link اختياري زر يربط المستخدم بعنوان URL عند النقر عليه. ويجب أن يحتوي الزر على الخاصية name التي تحتوي على نص الزر، والسمة url التي تحتوي على عنوان URL للرابط. قد لا يكون نص الزر مضللاً، ويتم التحقق منه أثناء عملية المراجعة.

نموذج التعليمات البرمجية

توضح المقتطفات التالية كيفية تنفيذ بطاقة جدول:

ياميل

candidates:
  - first_simple:
      variants:
        - speech: This is a table.
          text: This is a table.
    content:
      table:
        title: Table Title
        subtitle: Table Subtitle
        columns:
          - header: Column A
          - header: Column B
          - header: Column C
        rows:
          - cells:
              - text: A1
              - text: B1
              - text: C1
          - cells:
              - text: A2
              - text: B2
              - text: C2
          - cells:
              - text: A3
              - text: B3
              - text: C3
        image:
          alt: Google Assistant logo
          url: 'https://developers.google.com/assistant/assistant_96.png'

JSON

{
  "candidates": [
    {
      "first_simple": {
        "variants": [
          {
            "speech": "This is a table.",
            "text": "This is a table."
          }
        ]
      },
      "content": {
        "table": {
          "title": "Table Title",
          "subtitle": "Table Subtitle",
          "columns": [
            {
              "header": "Column A"
            },
            {
              "header": "Column B"
            },
            {
              "header": "Column C"
            }
          ],
          "rows": [
            {
              "cells": [
                {
                  "text": "A1"
                },
                {
                  "text": "B1"
                },
                {
                  "text": "C1"
                }
              ]
            },
            {
              "cells": [
                {
                  "text": "A2"
                },
                {
                  "text": "B2"
                },
                {
                  "text": "C2"
                }
              ]
            },
            {
              "cells": [
                {
                  "text": "A3"
                },
                {
                  "text": "B3"
                },
                {
                  "text": "C3"
                }
              ]
            }
          ],
          "image": {
            "alt": "Google Assistant logo",
            "url": "https://developers.google.com/assistant/assistant_96.png"
          }
        }
      }
    }
  ]
}

Node.js

app.handle('Table', conv => {
  conv.add('This is a table.');
  conv.add(new Table({
    "title": "Table Title",
    "subtitle": "Table Subtitle",
    "image": new Image({
      url: 'https://developers.google.com/assistant/assistant_96.png',
      alt: 'Google Assistant logo'
    }),
    "columns": [{
      "header": "Column A"
    }, {
      "header": "Column B"
    }, {
      "header": "Column C"
    }],
    "rows": [{
      "cells": [{
        "text": "A1"
      }, {
        "text": "B1"
      }, {
        "text": "C1"
      }]
    }, {
      "cells": [{
        "text": "A2"
      }, {
        "text": "B2"
      }, {
        "text": "C2"
      }]
    }, {
      "cells": [{
        "text": "A3"
      }, {
        "text": "B3"
      }, {
        "text": "C3"
      }]
    }]
  }));
});

JSON

{
  "responseJson": {
    "session": {
      "id": "session_id",
      "params": {}
    },
    "prompt": {
      "override": false,
      "content": {
        "table": {
          "button": {},
          "columns": [
            {
              "header": "Column A"
            },
            {
              "header": "Column B"
            },
            {
              "header": "Column C"
            }
          ],
          "image": {
            "alt": "Google Assistant logo",
            "height": 0,
            "url": "https://developers.google.com/assistant/assistant_96.png",
            "width": 0
          },
          "rows": [
            {
              "cells": [
                {
                  "text": "A1"
                },
                {
                  "text": "B1"
                },
                {
                  "text": "C1"
                }
              ]
            },
            {
              "cells": [
                {
                  "text": "A2"
                },
                {
                  "text": "B2"
                },
                {
                  "text": "C2"
                }
              ]
            },
            {
              "cells": [
                {
                  "text": "A3"
                },
                {
                  "text": "B3"
                },
                {
                  "text": "C3"
                }
              ]
            }
          ],
          "subtitle": "Table Subtitle",
          "title": "Table Title"
        }
      },
      "firstSimple": {
        "speech": "This is a table.",
        "text": "This is a table."
      }
    }
  }
}

تخصيص ردودك

يمكنك تغيير مظهر الردود المنسقة عن طريق إنشاء مظهر مخصص لمشروع الإجراءات. ويمكن أن يكون هذا التخصيص مفيدًا في تعريف شكل وأسلوب فريدين للمحادثة عندما يستدعي المستخدمون إجراءاتك على إحدى الشاشات.

لتعيين مظهر رد مخصص، يمكنك إجراء ما يلي:

  1. في وحدة تحكّم الإجراءات، انتقِل إلى تطوير > تخصيص المظهر.
  2. اضبط أيًا مما يلي أو كل ما يلي:
    • لون الخلفية: يُستخدم كخلفية لبطاقاتك. بشكل عام، يمكنك استخدام لون فاتح للخلفية لتسهيل قراءة محتوى البطاقة.
    • اللون الأساسي: اللون الرئيسي لنصوص رؤوس بطاقاتك وعناصر واجهة المحل. بوجه عام، استخدم لونًا أساسيًا داكنًا للحصول على تباين أفضل مع لون الخلفية.
    • مجموعة الخطوط: تصف نوع الخط المستخدم في العناوين والعناصر النصية البارزة الأخرى.
    • نمط زاوية الصورة: تغيير مظهر زوايا البطاقات.
    • صورة الخلفية: استخدام صورة مخصصة بدلاً من لون الخلفية. قدِّم صورتين مختلفتين عندما يكون الجهاز السطحي في وضع أفقي أو رأسي. إذا كنت تستخدم صورة خلفية، فسيتم تعيين اللون الأساسي إلى اللون الأبيض.
  3. انقر على حفظ.
تخصيص المظهر في وحدة تحكم الإجراءات