Ghost

Ghost’un yerleşik Kod Enjeksiyonu özelliği, yayınızın global <head> ve </body> kısımlarına script eklemenizi sağlar. Tüm Ghost planları kod enjeksiyonunu destekler, böylece Wink bileşenlerini herhangi bir sayfa veya gönderiye kolayca gömebilirsiniz.

Wink scriptlerini site genelinde yükleyin

Ghost Yönetici panelinde, Ayarlar → Kod Enjeksiyonu bölümüne gidin.

Site Başlığı kutusuna stil sayfasını ekleyin:

<link rel="stylesheet" href="https://elements.wink.travel/styles.css">

Site Altbilgisi kutusuna script ve uygulama yükleyicisini ekleyin (YOUR_CLIENT_ID ile değiştirin):

<script src="https://elements.wink.travel/elements.js" type="module" defer></script>
<wink-app-loader client-id="YOUR_CLIENT_ID"></wink-app-loader>

Kaydet butonuna tıklayın.

Bir gönderiye veya sayfaya bileşen ekleyin

Ghost editörü, içeriğinizin herhangi bir yerine ham HTML eklemenizi sağlayan bir HTML kartı destekler.

Gönderiyi veya sayfayı Ghost editöründe açın.
Kart seçiciyi açmak için / yazın ve HTML seçeneğini seçin.

Bileşen HTML’sini yapıştırın, örneğin:

<wink-content-loader
  layout="HOTEL"
  id="YOUR_LAYOUT_ID"
></wink-content-loader>

Kart dışına tıklayarak önizleyin, ardından yayınlayın.

Sayfa başına kod enjeksiyonu

Sadece bir sayfada görünmesi gereken bir bileşen için Ghost, sayfa başına kod enjeksiyonunu da destekler:

Gönderi veya sayfa ayarlarını açın (editörde dişli simgesi).
Kod Enjeksiyonu bölümüne gidin.
Bileşen etiketini Altbilgi alanına ekleyin (global app-loader sadece site genelinde altbilgide olmalıdır).
Kaydedin.

Mevcut bileşenler

Bileşen	HTML etiketi	Amaç
İçerik yükleyici	`<wink-content-loader>`	Otel kartları, ızgaralar, haritalar gösterir
Arama	`<wink-lookup>`	Destinasyonlar için arama çubuğu
Arama butonu	`<wink-search-button>`	Güzergah seçiciyi açar
Hesap butonu	`<wink-account-button>`	Giriş / kullanıcı menüsü
Güzergah butonu	`<wink-itinerary-button>`	Mevcut güzergahı gösterir
Güzergah seçici	`<wink-itinerary-picker>`	Tam güzergah formu
Alışveriş sepeti	`<wink-shopping-cart-button>`	Sepet özeti butonu

Tam özellik referansı için Web Bileşenleri sayfasına bakın.