Bu sayfada, Google Dokümanlar, E-Tablolar ve Slaytlar kullanıcılarının üçüncü taraf hizmetlerindeki bağlantıları önizlemesine olanak tanıyan bir Google Workspace eklentisinin nasıl oluşturulacağı açıklanmaktadır.
Google Workspace eklentileri, hizmetinizin bağlantılarını algılayabilir ve kullanıcılardan bunları önizlemelerini isteyebilir. Destek kaydı bağlantıları, satış potansiyelleri ve çalışan profilleri gibi birden fazla URL kalıbını önizlemek için bir eklenti yapılandırabilirsiniz.
Kullanıcılar bağlantıları nasıl önizler?
Kullanıcılar, bağlantıları önizlemek için akıllı çiplerle ve kartlarla etkileşim kurar.
Kullanıcılar bir dokümana veya e-tabloya URL yazdığında ya da yapıştırdığında Google Dokümanlar veya Google E-Tablolar, bağlantıyı akıllı çiple değiştirmelerini ister. Akıllı çipte, bağlantının içeriğinin simgesi ve kısa başlığı veya açıklaması gösterilir. Kullanıcı çipin üzerine geldiğinde, dosya veya bağlantı hakkında daha fazla bilgi içeren bir kart arayüzü görür.
Aşağıdaki videoda, kullanıcının bir bağlantıyı akıllı çipe nasıl dönüştürdüğü ve kartı nasıl önizlediği gösterilmektedir:
Kullanıcılar Slaytlar'da bağlantıları nasıl önizler?
Slaytlar'daki bağlantı önizlemelerinde üçüncü taraf akıllı çipleri desteklenmez. Kullanıcılar bir sunuya URL yazdığında veya yapıştırdığında Slaytlar, bağlantıyı çip yerine bağlantılı metin olarak başlığıyla değiştirmelerini ister. Kullanıcı, bağlantı başlığının üzerine geldiğinde bağlantıyla ilgili bilgilerin önizlemesini içeren bir kart arayüzü görür.
Aşağıdaki resimde, bir bağlantı önizlemesinin Slaytlar'da nasıl oluşturulduğu gösterilmektedir:

Ön koşullar
Apps Komut Dosyası
- Google Workspace hesabı
- Google Workspace eklentisi Eklenti oluşturmak için bu hızlı başlangıç kılavuzunu inceleyin.
Node.js
- Google Workspace hesabı
- Google Workspace eklentisi Eklenti oluşturmak için bu hızlı başlangıç kılavuzunu inceleyin.
Python
- Google Workspace hesabı
- Google Workspace eklentisi Eklenti oluşturmak için bu hızlı başlangıç kılavuzunu inceleyin.
Java
- Google Workspace hesabı
- Google Workspace eklentisi Eklenti oluşturmak için bu hızlı başlangıç kılavuzunu inceleyin.
İsteğe bağlı: Üçüncü taraf hizmetinde kimlik doğrulama ayarlama
Eklentiniz, yetkilendirme gerektiren bir hizmete bağlanıyorsa kullanıcıların bağlantıları önizlemek için hizmette kimlik doğrulaması yapması gerekir. Bu, kullanıcılar hizmetinizden bir bağlantıyı Dokümanlar, E-Tablolar veya Slaytlar dosyasına ilk kez yapıştırdığında eklentinizin yetkilendirme akışını çağırması gerektiği anlamına gelir.
OAuth hizmeti veya özel yetkilendirme istemi ayarlamak için Eklentinizi üçüncü taraf hizmetine bağlama başlıklı makaleyi inceleyin.
Eklentiniz için bağlantı önizlemeleri ayarlama
Bu bölümde, eklentiniz için bağlantı önizlemelerinin nasıl ayarlanacağı açıklanmaktadır. Bu işlem aşağıdaki adımları içerir:
- Eklentinizin manifest dosyasında bağlantı önizlemelerini yapılandırın.
- Bağlantılarınız için akıllı çip ve kart arayüzü oluşturun.
Bağlantı önizlemelerini yapılandırma
Bağlantı önizlemelerini yapılandırmak için eklentinizin manifest dosyasında aşağıdaki bölümleri ve alanları belirtin:
addOnsbölümünde, Dokümanlar'ı genişletmek içindocsalanını, E-Tablolar'ı genişletmek içinsheetsalanını ve Slaytlar'ı genişletmek içinslidesalanını ekleyin.Her alanda,
runFunctioniçerenlinkPreviewTriggerstetikleyicisini uygulayın (Bu işlevi aşağıdaki bölümde tanımlarsınız: Akıllı çip ve kart oluşturma).linkPreviewTriggerstetikleyicisinde hangi alanları belirtebileceğiniz hakkında bilgi edinmek için Apps Komut Dosyası manifestleri veya diğer çalışma zamanları için dağıtım kaynakları ile ilgili referans belgelerine bakın.Kullanıcıların eklentinin bağlantıları kendi adlarına önizlemesine izin verebilmesi için
oauthScopesalanına kapsamı ekleyinhttps://www.googleapis.com/auth/workspace.linkpreview.
Örneğin, bir destek kaydı hizmeti için bağlantı önizlemelerini yapılandıran aşağıdaki manifestin oauthScopes ve addons bölümüne bakın.
{
"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"
}
}
]
}
}
}
Örnekte, Google Workspace eklentisi bir şirketin destek kaydı hizmetiyle ilgili bağlantıların önizlemesini gösteriyor. Eklenti, bağlantıları önizlemek için üç URL
deseni belirtir. Bir bağlantı URL kalıplarından biriyle eşleştiğinde geri çağırma işlevi caseLinkPreview, Dokümanlar, E-Tablolar veya Slaytlar'da bir kart ve akıllı çip oluşturup görüntüler ve URL'yi bağlantı başlığıyla değiştirir.
Akıllı çip ve kartı oluşturma
Bir bağlantı için akıllı çip ve kart döndürmek üzere linkPreviewTriggers nesnesinde belirttiğiniz işlevleri uygulamanız gerekir.
Bir kullanıcı, belirtilen URL kalıbıyla eşleşen bir bağlantıyla etkileşime girdiğinde linkPreviewTriggers tetikleyicisi tetiklenir ve geri çağırma işlevi, etkinlik nesnesini EDITOR_NAME.matchedUrl.url bağımsız değişken olarak iletir. Bağlantı önizlemeniz için akıllı çip ve kart oluşturmak üzere bu etkinlik nesnesinin yükünü kullanırsınız.
Örneğin, bir kullanıcı Dokümanlar'da https://www.example.com/cases/123456 bağlantısının önizlemesini yaparsa aşağıdaki etkinlik yükü döndürülür:
JSON
{ "docs": { "matchedUrl": { "url": "https://www.example.com/support/cases/123456" } } }
Kart arayüzünü oluşturmak için bağlantıyla ilgili bilgileri görüntülemek üzere widget'ları kullanırsınız. Ayrıca, kullanıcıların bağlantıyı açmasına veya içeriğini değiştirmesine olanak tanıyan işlemler de oluşturabilirsiniz. Kullanılabilir widget'ların ve işlemlerin listesi için Önizleme kartlarında desteklenen bileşenler başlıklı makaleyi inceleyin.
Bağlantı önizlemesi için akıllı çip ve kart oluşturmak üzere:
- Eklentinizin manifest dosyasının
linkPreviewTriggersbölümünde belirttiğiniz işlevi uygulayın:- İşlev, bağımsız değişken olarak
EDITOR_NAME.matchedUrl.urliçeren bir etkinlik nesnesini kabul etmeli ve tek birCardnesnesi döndürmelidir. - Hizmetiniz yetkilendirme gerektiriyorsa işlevin yetkilendirme akışını da çağırması gerekir.
- İşlev, bağımsız değişken olarak
- Her önizleme kartı için arayüzde widget etkileşimi sağlayan geri çağırma işlevlerini uygulayın. Örneğin, "Bağlantıyı görüntüle" yazan bir düğme eklediyseniz bağlantıyı yeni bir pencerede açacak bir geri çağırma işlevi belirten bir işlem oluşturabilirsiniz. Widget etkileşimleri hakkında daha fazla bilgi edinmek için Eklenti işlemleri başlıklı makaleyi inceleyin.
Aşağıdaki kod, Dokümanlar için caseLinkPreview geri çağırma işlevini oluşturur:
Apps Komut Dosyası
Node.js
Python
Java
Önizleme kartları için desteklenen bileşenler
Google Workspace eklentileri, bağlantı önizleme kartları için aşağıdaki widget'ları ve işlemleri destekler:
Apps Komut Dosyası
| Kart Hizmeti alanı | Tür |
|---|---|
TextParagraph |
Widget |
DecoratedText |
Widget |
Image |
Widget |
IconImage |
Widget |
ButtonSet |
Widget |
TextButton |
Widget |
ImageButton |
Widget |
Grid |
Widget |
Divider |
Widget |
OpenLink |
İşlem |
Navigation |
İşlem Yalnızca updateCard yöntemi desteklenir. |
JSON
Kart (google.apps.card.v1) alanı |
Tür |
|---|---|
TextParagraph |
Widget |
DecoratedText |
Widget |
Image |
Widget |
Icon |
Widget |
ButtonList |
Widget |
Button |
Widget |
Grid |
Widget |
Divider |
Widget |
OpenLink |
İşlem |
Navigation |
İşlem Yalnızca updateCard yöntemi desteklenir. |
Tam örnek: Destek kaydı eklentisi
Aşağıdaki örnekte, Google Dokümanlar'da bir şirketin destek kayıtlarına giden bağlantıların önizlemesini yapan bir Google Workspace eklentisi yer almaktadır.
Örnekte şu işlemler yapılır:
- Destek kayıtlarına giden bağlantıların önizlemeleri (ör.
https://www.example.com/support/cases/1234). Akıllı çipte destek simgesi, önizleme kartında ise destek kaydı kimliği ve açıklama yer alır. - Kullanıcının yerel ayarı İspanyolca olarak ayarlanmışsa akıllı çip,
labelTextsimgesini İspanyolca olarak yerelleştirir.
Manifest
Apps Komut Dosyası
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"
}
]
}
}
}
Kod
Apps Komut Dosyası
Node.js
Python
Java
İlgili kaynaklar
- Google Kitaplar'daki bağlantıları akıllı çiplerle önizleme
- Eklentinizi test etme
- Google Dokümanlar manifest dosyası
- Bağlantı önizlemeleri için kart arayüzleri