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

المتطلبات الأساسية
برمجة التطبيقات
- حساب على Google Workspace
- إضافة على Google Workspace لإنشاء إضافة، اتّبِع دليل البدء السريع هذا.
Node.js
- حساب على Google Workspace
- إضافة على Google Workspace لإنشاء إضافة، اتّبِع دليل البدء السريع هذا.
Python
- حساب على Google Workspace
- إضافة على Google Workspace لإنشاء إضافة، اتّبِع دليل البدء السريع هذا.
جافا
- حساب على Google Workspace
- إضافة على Google Workspace لإنشاء إضافة، اتّبِع دليل البدء السريع هذا.
(اختياري) إعداد المصادقة على خدمة خارجية
إذا كانت إضافتك تتصل بخدمة تتطلب تفويضًا، على المستخدمين المصادقة على الخدمة لمعاينة الروابط. يعني ذلك أنّه عندما يلصق المستخدمون رابطًا من خدمتك في ملف "مستندات Google" أو "جداول بيانات Google" أو "العروض التقديمية من Google" للمرة الأولى، يجب أن تستدعي إضافتك عملية التفويض.
لإعداد خدمة OAuth أو طلب تفويض مخصّص، اطّلِع على مقالة ربط إضافتك بخدمة خارجية.
إعداد معاينات الروابط لإضافتك
يوضّح هذا القسم كيفية إعداد معاينات الروابط لإضافتك، ويشمل ذلك الخطوات التالية:
- ضبط معاينات الروابط في بيان إضافتك
- إنشاء واجهة الشريحة الذكية والبطاقة لروابطك
ضبط معاينات الروابط
لضبط معاينات الروابط، حدِّد الأقسام والحقول التالية في بيان إضافتك:
- ضمن قسم
addOns، أضِف الحقلdocsلتوسيع "مستندات Google"، والحقلsheetsلتوسيع "جداول بيانات Google"، والحقلslidesلتوسيع "العروض التقديمية من Google". في كل حقل، نفِّذ مشغِّل
linkPreviewTriggersالذي يتضمّنrunFunction(يمكنك تحديد هذه الدالة في القسم التالي، إنشاء الشريحة الذكية والبطاقة).للتعرّف على الحقول التي يمكنك تحديدها في المشغِّل
linkPreviewTriggers، اطّلِع على المستندات المرجعية لـ بيانات Apps Script أو موارد النشر لأوقات التشغيل الأخرى.في الحقل
oauthScopes، أضِف النطاقhttps://www.googleapis.com/auth/workspace.linkpreviewليتمكّن المستخدمون من منح الإضافة إذن معاينة الروابط نيابةً عنهم.
على سبيل المثال، اطّلِع على قسمَي oauthScopes وaddons من البيان التالي الذي يضبط معاينات الروابط لخدمة طلبات الدعم.
{
"oauthScopes": [
"https://www.googleapis.com/auth/workspace.linkpreview"
],
"addOns": {
"common": {
"name": "Preview support cases",
"logoUrl": "https://www.example.com/images/company-logo.png",
"layoutProperties": {
"primaryColor": "#dd4b39"
}
},
"docs": {
"linkPreviewTriggers": [
{
"runFunction": "caseLinkPreview",
"patterns": [
{
"hostPattern": "example.com",
"pathPrefix": "support/cases"
},
{
"hostPattern": "*.example.com",
"pathPrefix": "cases"
},
{
"hostPattern": "cases.example.com"
}
],
"labelText": "Support case",
"logoUrl": "https://www.example.com/images/support-icon.png",
"localizedLabelText": {
"es": "Caso de soporte"
}
}
]
},
"sheets": {
"linkPreviewTriggers": [
{
"runFunction": "caseLinkPreview",
"patterns": [
{
"hostPattern": "example.com",
"pathPrefix": "support/cases"
},
{
"hostPattern": "*.example.com",
"pathPrefix": "cases"
},
{
"hostPattern": "cases.example.com"
}
],
"labelText": "Support case",
"logoUrl": "https://www.example.com/images/support-icon.png",
"localizedLabelText": {
"es": "Caso de soporte"
}
}
]
},
"slides": {
"linkPreviewTriggers": [
{
"runFunction": "caseLinkPreview",
"patterns": [
{
"hostPattern": "example.com",
"pathPrefix": "support/cases"
},
{
"hostPattern": "*.example.com",
"pathPrefix": "cases"
},
{
"hostPattern": "cases.example.com"
}
],
"labelText": "Support case",
"logoUrl": "https://www.example.com/images/support-icon.png",
"localizedLabelText": {
"es": "Caso de soporte"
}
}
]
}
}
}
في المثال، تعرِض إضافة Google Workspace معاينة لروابط خدمة طلبات الحصول على الدعم الخاصة بإحدى الشركات. تحدِّد الإضافة ثلاثة أنماط عناوين URL لمعاينة الروابط. عندما يتطابق رابط مع أحد أنماط عناوين URL، تنشئ دالة رد الاتصال caseLinkPreview بطاقة وشريحة ذكية وتعرضهما في "مستندات Google" أو "جداول بيانات Google" أو "العروض التقديمية من Google"، وتستبدل عنوان URL بعنوان الرابط.
إنشاء الشريحة الذكية والبطاقة
لعرض شريحة ذكية وبطاقة لرابط، عليك تنفيذ أي دوال حدّدتها في العنصر linkPreviewTriggers.
عندما يتفاعل المستخدم مع رابط يتطابق مع نمط عنوان URL محدّد، يتم تشغيل المشغِّل
linkPreviewTriggers وتمرِّر دالة رد الاتصال كائن الحدث
EDITOR_NAME.matchedUrl.url كمعلَمة. يمكنك استخدام حمولة كائن الحدث هذا لإنشاء الشريحة الذكية والبطاقة لمعاينة الرابط.
على سبيل المثال، إذا عاين المستخدم الرابط https://www.example.com/cases/123456 في "مستندات Google"، يتم عرض حمولة الحدث التالية:
JSON
{ "docs": { "matchedUrl": { "url": "https://www.example.com/support/cases/123456" } } }
لإنشاء واجهة البطاقة، يمكنك استخدام الأدوات لعرض معلومات عن الرابط. يمكنك أيضًا إنشاء إجراءات تتيح للمستخدمين فتح الرابط أو تعديل محتوياته. للاطّلاع على قائمة بالأدوات والإجراءات المتاحة، راجِع مقالة المكوّنات المتوافقة مع بطاقات المعاينة.
لإنشاء الشريحة الذكية والبطاقة لمعاينة الرابط:
- نفِّذ الدالة التي حدّدتها في قسم
linkPreviewTriggersمن بيان إضافتك:- يجب أن تقبل الدالة كائن حدث يحتوي على
EDITOR_NAME.matchedUrl.urlكمعلَمة وأن تعرض كائنCardواحدًا. - إذا كانت خدمتك تتطلب تفويضًا، يجب أن تستدعي الدالة أيضًا عملية التفويض.
- يجب أن تقبل الدالة كائن حدث يحتوي على
- لكل بطاقة معاينة، نفِّذ أي دوال رد اتصال توفّر تفاعلاً مع الأدوات للواجهة. على سبيل المثال، إذا أضفت زرًا بعنوان "عرض الرابط"، يمكنك إنشاء إجراء يحدِّد دالة رد اتصال لفتح الرابط في نافذة جديدة. لمزيد من المعلومات عن تفاعلات الأدوات، اطّلِع على مقالة إجراءات الإضافات.
ينشئ الرمز البرمجي التالي دالة رد الاتصال caseLinkPreview لمستندات Google:
برمجة التطبيقات
Node.js
Python
جافا
المكوّنات المتوافقة مع بطاقات المعاينة
تتوافق إضافات Google Workspace مع الأدوات والإجراءات التالية لبطاقات معاينة الروابط:
برمجة التطبيقات
| حقل Card Service | النوع |
|---|---|
TextParagraph |
التطبيق المصغَّر |
DecoratedText |
التطبيق المصغَّر |
Image |
التطبيق المصغَّر |
IconImage |
التطبيق المصغَّر |
ButtonSet |
التطبيق المصغَّر |
TextButton |
التطبيق المصغَّر |
ImageButton |
التطبيق المصغَّر |
Grid |
التطبيق المصغَّر |
Divider |
التطبيق المصغَّر |
OpenLink |
الإجراء |
Navigation |
الإجراء لا تتوفّر سوى طريقة updateCard. |
JSON
حقل البطاقة (google.apps.card.v1) |
النوع |
|---|---|
TextParagraph |
التطبيق المصغَّر |
DecoratedText |
التطبيق المصغَّر |
Image |
التطبيق المصغَّر |
Icon |
التطبيق المصغَّر |
ButtonList |
التطبيق المصغَّر |
Button |
التطبيق المصغَّر |
Grid |
التطبيق المصغَّر |
Divider |
التطبيق المصغَّر |
OpenLink |
الإجراء |
Navigation |
الإجراء لا تتوفّر سوى طريقة updateCard. |
مثال مُكتمل: إضافة طلب الحصول على الدعم
يعرض المثال التالي إضافة على Google Workspace تعرِض معاينة لروابط طلبات الدعم الخاصة بإحدى الشركات في "مستندات Google".
يفعل المثال ما يلي:
- يعرِض معاينة لروابط طلبات الدعم، مثل
https://www.example.com/support/cases/1234. تعرض الشريحة الذكية رمز دعم، وتتضمّن بطاقة المعاينة رقم الطلب ووصفًا. - إذا تم ضبط لغة المستخدم على الإسبانية، تترجِم الشريحة الذكية
labelTextإلى الإسبانية.
البيان
برمجة التطبيقات
JSON
{
"oauthScopes": [
"https://www.googleapis.com/auth/workspace.linkpreview"
],
"addOns": {
"common": {
"name": "Preview support cases",
"logoUrl": "https://developers.google.com/workspace/add-ons/images/support-icon.png",
"layoutProperties": {
"primaryColor": "#dd4b39"
}
},
"docs": {
"linkPreviewTriggers": [
{
"runFunction": "URL",
"patterns": [
{
"hostPattern": "example.com",
"pathPrefix": "support/cases"
},
{
"hostPattern": "*.example.com",
"pathPrefix": "cases"
},
{
"hostPattern": "cases.example.com"
}
],
"labelText": "Support case",
"localizedLabelText": {
"es": "Caso de soporte"
},
"logoUrl": "https://developers.google.com/workspace/add-ons/images/support-icon.png"
}
]
}
}
}
الرمز
برمجة التطبيقات
Node.js
Python
جافا
مراجع ذات صلة
- معاينة الروابط من "كتب Google" باستخدام الشرائح الذكية
- اختبار إضافتك
- بيان "مستندات Google"
- واجهات البطاقات لمعاينات الروابط