Konaklamalar Takvimi - Tarih Seçici Gömme

Gabriela Garcia

Güncellenme 02 Mart 2026 15:12

Bu özellik, Kapsayıcı Deneyim 2.0’ı içeren Premium Embed Paketi olan tesisler için kullanılabilir. Mevcut MVP (Minimum Uygulanabilir Ürün), yani ilk işlevsel sürüm, misafirleri barındırılan Rezervasyon Motoru’na yönlendirir. Kapsayıcı Deneyim 2.0’a doğrudan yönlendirme desteği 2026’nın ilk çeyreği başlarında planlanmaktadır.

Bu, web sitende belirli bir oda için Hemen Rezervasyon Yap butonunu, tüm rezervasyon akışını yeniden oluşturmadan eklemenin basit bir yolunu sunar.

Konaklama Takvimi Embed, takvimi açan, misafirlerin tarihler seçmesini sağlayan ve her şeyi önceden doldurulmuş şekilde doğrudan rezervasyon motoruna gönderen hafif bir kapsayıcı web bileşenidir. Daha az engel, daha fazla rezervasyon. Herkes kazanır.

Bu Nedir (ve Ne Zaman Kullanılır)

Misafirlerin sadece “otel genelinde” değil, belirli bir oda veya birimi rezervasyon yapmasını istediğinde Konaklama Takvimi’ni kullan. Şu durumlar için idealdir:

Oda detay sayfaları
Oda listeleme sayfaları
Pazarlama veya kampanya açılış sayfaları
Tek bir konaklamayı öne çıkaran promosyon sayfaları

Not: iframe içine gömülmemelidir.

Misafirlerin Deneyimi

Misafir açısından süreç şöyle işler:

Misafir Hemen Rezervasyon Yap butonuna tıklar
Bir modal pencerede takvim açılır
Misafir giriş ve çıkış tarihlerini seçer
Misafir Devam Et butonuna tıklar
Yeni bir sekme açılır ve Rezervasyon Motorun, şu bilgilerle önceden doldurulmuş olarak gelir:
- Seçilen tarihler
- Doğru oda veya birim

Başlamadan Önce İhtiyacın Olanlar

Şunlara sahip olduğundan emin ol:

Cloudbeds Rezervasyon Motorun (Tesis Kodu)
Rezervasyon yapmak istediğin Oda ID’si (aşağıda açıklanmıştır)
Web sitenin HTML’ini düzenleme erişimi

Tesis kodunu bulmak için rezervasyon motoru bağlantını referans alabilir ve benzersiz tanımlayıcıyı çıkarabilirsin.

Seçenek 1: Oda Tipi ID’si

Misafirlerin bir oda kategorisi içindeki herhangi bir müsait odayı rezervasyon yapmasını istiyorsan bunu kullan. Oda ID’sini (rid) bulmak için:

Hesap → Ayarlar ➜ Tesis → Konaklamalar sekmesine git
Sonra ihtiyacın olan konaklama (oda tipi) adına tıkla
Tarayıcının adres çubuğuna bak; URL’nin en sonunda görünen sayı oda tipinin ID’sidir

Örneğin, https://hotels.cloudbeds.com/connect/100000#/manage/roomTypes/123456 URL’sinde → Oda ID’si 123456’dır.

Seçenek 2: Birim ID’si

Misafirlerin herhangi bir oda tipi yerine belirli bir fiziksel odayı (birimi) rezerve etmesini istiyorsan bu seçeneği kullan. Birim ID’sini bulmak için:

Hesap → Ayarlar ➜ Tesis → Konaklamalar sekmesine git, sonra gömmek istediğin oda birimini bul.
Belirli oda biriminin yanında bulunan Düzenle butonuna tıkla.
Tarayıcının Geliştirici Araçlarını aç ve Ağ sekmesini seç.
Ağ istekleri arasında [find_one] API çağrısını bul.
Yanıt veri yükünde "id" olarak etiketlenmiş alanı bul — bu değer kullanacağın Birim ID’sidir.

Adım 1: Cloudbeds Script’ini Ekle

Web sitenin <head> bölümüne aşağıdaki script’i ekle:

Not: Birinci adımdaki tüm script etiketleri Kapsayıcı Deneyim 2.0 ve tüm bileşenler için aynıdır. Daha önce başka bir gömme için kurduysan tekrar kurmana gerek yoktur. Sadece bir kez, web sitesinin (küresel) <head> bölümüne kurulması yeterlidir.

Önemli: Kapsayıcı Deneyim 2.0 web bileşen etiketlerini iframe içinde kullanma.

Bu kurulum kaydırma sorunlarına yol açabilir ve iframe zincirindeki her öğenin beyaz listeye alınmasını gerektirir — bu yapılandırma önerilmez.

Kullanıcı bir CMP kullandığında dikkat edilmesi gereken en iyi uygulamalar listesi:

Immersive Experience öğesini CMP etiketinden önce head bölümünün en başına ekle ve engellenmesini önleyen özelliği dahil et. Tüm platformlarda aynı olmayabileceği için dokümantasyonda hepsini belirtmektense, platforma göre farklılık gösterebilir
- Cookiebot: data-cookieconsent="ignore"
- OneTrust: data-ignore-consent="true"
- Quantcast: data-quantcast-ignore="true"
Aşağıdaki scripti CMP yönetici panelinde Gerekli olarak sınıflandır; yine, platforma göre farklılık gösterebilir

<script src="https://static1.cloudbeds.com/booking-engine/latest/static/js/immersive-experience/cb-immersive-experience.js" type="text/javascript"></script>

Adım 2: Tarih Seçici Butonunu Ekle

Hemen Rezervasyon Yap butonunun görünmesini istediğin yere bu etiketi yerleştir:

<cb-accommodation-date-picker  
property-code="TESİS_KODUNUZ"  
rid="ODA_ID_NİZ"
></cb-accommodation-date-picker>

Eklendikten sonra buton otomatik olarak görüntülenecektir.

İsteğe Bağlı Özelleştirme

Butonu ve arayüzü bu isteğe bağlı özelliklerle değiştirebilirsin:

Özellik	Ne İşe Yarar
button-label	Buton metnini değiştirir (varsayılan “Hemen rezervasyon yap”)
lang	Takvim ve etiketler için dili ayarlar
currency	Tesisin varsayılan para birimini geçersiz kılar
class-name	Özelleştirilmiş CSS sınıfı ekler, stil vermek için

Örnek:

<cb-accommodation-date-picker  
property-code="TESİS_KODUNUZ"  
rid="ODA_ID_NİZ"  
button-label="Bu Odayı Rezerve Et"  
lang="en"
></cb-accommodation-date-picker>

Misafirlerin Göreceği Takvim Özellikleri

Tesis ayarlarınıza bağlı olarak takvim şunları gösterebilir:

Rezervasyon kısıtlamaları (minimum konaklama süresi, kapalı tarihler vb.)
Günlük en düşük müsait fiyat
Aynı gün giriş (etkinse)
Tam yerelleştirilmiş dil ve formatlama

Tüm bunlar doğrudan Cloudbeds yapılandırmandan çekilir — ekstra kurulum gerekmez.

Davranışı Etkileyen Tesis Ayarları

Bu özellikler Cloudbeds içinde kontrol edilir:

Aynı gün rezervasyonlar – Bugün için rezervasyon yapılmasına izin verir
Kısıtlama göstergeleri – Takvimde rezervasyon kurallarını gösterir
En düşük fiyat gösterimi – Günlük en ucuz müsait fiyatı gösterir

Bir şey görünmüyorsa, ilk kontrol etmen gereken yer Cloudbeds ayarların.