Sitem: kendi sitenizdeki widget'lar
"Sitem" bölümü, zaten bir sitesi olanlar içindir. Bizim vitrinimize taşınmanıza ve bir şeyleri aktarmanıza gerek yok: mevcut sitenize tek bir kod satırı eklersiniz ve ardından ihtiyacınız olan ürünleri panelde açma/kapama düğmeleriyle etkinleştirirsiniz.
Nerede açılır: Admin paneli → Pazarlama → "Sitem" (admin.masamenu.tr).
<script> etiketi ekleyebileceğiniz herhangi bir platformda çalışır: WordPress, Tilda, Wix, Shopify, Webflow, Bitrix, InSales, OpenCart, özel yazılmış site, sayfa oluşturucu açılış sayfası.
Site adresi ve kurulum kodu#
Bölümün ilk alanı — sitenizin adresidir (örneğin, example.com). Bunu kullanarak kurulumu kontrol eder ve widget'larda doğru bağlantıları oluştururuz.
Sonra — kurulum kodu. Bu tek bir satırdır:
<script src="https://cdn.masamenu.tr/site/v1.js" data-domain="YOUR-DOMAIN" async></script>
Bunu bir kez ekleyin — <head> içine veya </body> etiketinden önce. Site koduna bir daha dönmenize gerek yok: widget bileşimi sayfadaki etiketlerle değil, panelde açma/kapama düğmeleriyle belirlenir. Widget'ı açtınız — birkaç dakika içinde sitede görünür, kapattınız — kaybolur.
Daha önce widget etiketlerini ayrı ayrı manuel olarak eklediyseniz, çalışmaya devam ederler: tek yükleyici onları görür ve widget'ı ikinci kez başlatmaz.
Popüler platformlarda kurulum#
«Kurulum Kodu» penceresinde her platform için bir sekme vardır — aşağıdakiyle aynı adımlarla.
Her platformun burada kendi çıpası var; bağlantıyı siteyi düzenleyen kişiye adımları yeniden anlatmak yerine doğrudan gönderebilirsiniz: #html, #google-tag-manager, #wordpress, #tilda, #wix, #shopify, #webflow, #squarespace — örneğin /tr/docs/site-widgets#tilda.
Her platformda geçerli olanlar, her blokta tekrar etmemek için:
- etiket tüm site için bir kez eklenir — ortak şablona, tek bir sayfaya değil;
- site kurucularında (Tilda, Wix, Webflow, Squarespace) değişiklik, site yeniden yayınlanana kadar yalnızca düzenleyicide kalır;
- kontrolü canlı sitede yapın, düzenleyicinin önizlemesinde değil;
- sitenin önünde bir önbellek ya da CDN varsa temizleyin: hem ziyaretçiye hem de kontrolümüze etiketsiz bir kopya sunulabilir;
- kurulum kontrolünün yine de göremeyecekleri — aşağıdaki ayrı bölüm.
HTML#
Şablonuna erişebildiğiniz her site: elle yazılmış, açılış sayfası, statik site üreteci.
- Kod satırını kopyalayın: Pazarlama → «Benim sitem».
- Sitenin ortak şablonundaki
<head>içine veya</body>öncesine yapıştırın. - Ortak şablon yoksa (sayfalar ayrı dosyalarsa) her sayfaya ekleyin.
- Değişikliği sunucuya yükleyin, siteyi açın ve «Kurulumu kontrol et»e basın.
Google Tag Manager#
Şablona erişiminiz yoksa ama sitede GTM zaten varsa uygundur.
- Etiketler → Oluştur → tür «Özel HTML».
- Kod satırını yapıştırın, tetikleyici — «Tüm sayfalar», kaydedin.
- **«Yayınla»**ya basın: kapsayıcı sürümü yayınlanmadıkça canlı sitede etiket yoktur.
⚠️ GTM'den yüklenen etiketi «Kurulum kontrolü» hiçbir zaman göremez — bu bir hata değil, yöntemin sonucudur: «Kurulum kontrolünün göremedikleri». Siteyi açıp gözünüzle bakın.
WordPress#
- WordPress paneli (
siteniz/wp-admin), yönetici yetkisi gerekir. - Güvenli yol: Eklentiler → Yeni ekle → header/footer'a kod ekleyen herhangi bir eklenti → ayarlarında satırı Header alanına yapıştırın → kaydedin.
- Eklentisiz yol: Görünüm → Tema Dosyası Düzenleyicisi →
header.php(kapanan</head>öncesi) veyafooter.php(</body>öncesi) → «Dosyayı güncelle». - Siteyi açın ve «Kurulumu kontrol et»e basın.
⚠️ Ana temanın dosyalarındaki değişiklikler tema güncellenince kaybolur — WordPress belgeleri de bunu uyarır. Kod ekleme eklentisi veya alt tema güncellemeden sağ çıkar. Önbellek eklentisi (W3 Total Cache, WP Rocket vb.) varsa önbelleği temizleyin, yoksa kontrol sayfanın eski kopyasını görür.
💡 Widget'lar için ayrı bir eklenti gerekmez: hepsini tek etiket getirir. Cenaly Consent eklentisi başka bir şeydir — yalnızca çerez banner'ının etiketini sizin yerinize kurar (bkz. Cookies ve onay).
Tilda#
- Proje listesinde ilgili sitenin «Site ayarları» bölümünü açın (sayfanın değil, projenin ayarları).
- «Daha fazla» bölümü (bazı hesaplarda «Kod ekleme» olarak adlandırılır) → «head içine eklenecek HTML kodu» alanı.
- Satırı yapıştırın ve kaydedin.
- Projenin tüm sayfalarını yeniden yayınlayın — aksi halde kod yalnızca düzenleyicide kalır.
- Canlı siteyi açın ve «Kurulumu kontrol et»e basın.
💡 Etiket yalnızca tek bir sayfada gerekiyorsa aynı alan «Sayfa ayarları» → «Ek» içinde de vardır; o zaman o sayfayı yeniden yayınlayın.
Wix#
- Site yayında, alan adı bağlı olmalıdır: bu, özel kod için Wix'in kendi koşuludur.
- Settings → Development & integrations → Custom Code.
- «+ Add Custom Code» → satırı yapıştırın, parçaya anlaşılır bir ad verin.
- Tüm sayfalara (All pages) uygulayın, bir kez yüklensin, yerleşim — Head. Kaydedin.
- Publish'e basın, canlı siteyi açın ve «Kurulumu kontrol et»e basın.
⚠️ Wix'te kod parçaları alan adına bağlıdır: siteye başka bir alan adı atarsanız parçalar silinir, etiketi yeniden yapıştırmanız gerekir.
Shopify#
- Shopify yönetimi → Online Mağaza → Temalar.
- İlgili temada «…» → Duplicate: kopya, geri dönüş yolunuzdur.
- Aynı yerde «…» → Kodu düzenle.
- Solda Layout klasörü →
theme.liquiddosyası → satırı kapanan</head>(veya</body>) öncesine yapıştırın → Save. - Mağaza vitrinini açın ve «Kurulumu kontrol et»e basın.
⚠️ Değişiklik mağazaya değil, temaya aittir: temayı değiştirir ya da yeniden oluşturursanız etiketi yenisine yapıştırın, aksi halde widget'lar eski temayla birlikte kaybolur. Shopify'ın ödeme sayfaları rastgele tema betiklerine kapalıdır — widget'lar vitrin için tasarlanmıştır.
Webflow#
- Projenin Site settings bölümü → Custom code sekmesi.
- Head code alanı → satırı yapıştırıp kaydedin. Bu alana yalnızca betiğin kendisi yazılır:
html,head,bodyetiketleri eklenmez. - Publish'e basın — özel kod düzenleyicide ve önizlemede çalışmaz.
- Yayınlanan siteyi açın ve «Kurulumu kontrol et»e basın.
⚠️ Webflow site ayarlarındaki özel kod alanları ücretli Site plan ile açılır. Widget yalnızca tek bir sayfada gerekiyorsa, sayfanın kendi ayarlarında kendi kod alanları vardır.
Squarespace#
- Site paneli → Website → Website Tools → Code Injection.
- Header alanı (her sayfanın
<head>bölümüne girer) → satırı yapıştırın → Save. - Canlı siteyi açın ve «Kurulumu kontrol et»e basın.
⚠️ Code Injection paneli Core, Plus, Advanced planlarında ve bazı eski Squarespace planlarında bulunur. Sayfa içi Code Block bunun yerine geçmez: kodu tek bir sayfaya koyar, oysa widget'lar tüm sitede gereklidir.
Adımlar platformların resmi yardım belgelerine göre doğrulanmıştır. Platform bir menü öğesinin adını değiştirirse bize değil, kendi yardım merkezine güvenin — ve bize haber verin, düzeltelim.
Sekiz widget#
Her widget, bir açma/kapama düğmesi ve ayarlar dişlisi olan ayrı bir karttır. Widget'ların topladığı veriler panelin normal bölümlerine düşer — site için ayrı bir "gelen kutusu" oluşturmanıza gerek yok.
| Widget | Ziyaretçi ne görür | Veriler nereye düşer | Dokümantasyon |
|---|---|---|---|
| 🍪 Çerezler ve onay | Kategorili onay banner'ı ve ayarlar ekranı | Onay günlüğü, çerez bildirimi | Çerezler ve onay |
| 💬 Sohbet: yapay zekâ asistanı ve operatörler | Sayfada sohbet balonu | "Sohbet" bölümü — WhatsApp, Telegram, e-posta, Messenger/Instagram ile birlikte | Misafirlerle sohbet |
| 💡 Pop-up'lar ve formlar | Promosyonlar, çıkış teklifleri, e-posta toplama, sayaçlar | Kampanyalar ve istatistikleri | Etkileşim kampanyaları |
| 📅 Masa rezervasyonu | "Masa ayırt" butonu | "Masalar" bölümü — rezervasyonlar ve salon planı | Masa rezervasyonları |
| 🗓️ Online randevu | "Randevu al" butonu: hizmet → uzman → saat | "Randevular" bölümü | Randevu günlüğü |
| 🛒 Online sipariş | "Sipariş ver" butonu, sitenizin üzerinde sepet ve sipariş tamamlama | "Siparişler" bölümü | Kendi sitenizde online sipariş |
| 📚 Destek merkezi | Yayınlanmış yardım makaleleriyle "?" butonu | Makaleler — "Bilgi tabanı"nda, yardım analitiği de aynı yerde | Destek merkezi |
| ⚖️ Yasal belgeler | Gizlilik politikası, koşullar vb. bağlantıları veya metni | Sayfalar bizim hostingimizde, yeniden yayınlama siteyi kendiliğinden günceller | Yasal belgeler |
Yükleme sırası rastgele değil: çerez banner'ı ilk başlar, böylece sitenizdeki diğer widget'lar ve üçüncü taraf analitikleri ziyaretçinin çerezler konusunda zaten verdiği kararı görür.
İki widget yalnızca düğmeyle değil, içerikle de etkinleşir:
- Online randevu menüde en az bir "Hizmet" türünde kalem olduğunda görünür;
- Destek merkezi — en az bir yayınlanmış yardım makalesi olduğunda.
Çevrimiçi randevu widget'ı ayrıntılı#
Ayarlar — «Çevrimiçi Randevu» kartı → dişli: düğmenin rengi, metni, ekrandaki köşesi ve dili. Ayarların hemen altında, yalnızca bu widget'ı kuracaksanız diye ona özel hazır kod satırı da bulunur.
Dil. Varsayılan — otomatik: widget, üzerinde bulunduğu sayfanın dilinde konuşur ve 45 dil bilir. Yalnızca gereken sözlük yüklenir, bu yüzden sitenin hızını etkilemez. Listeden tek bir dili sabitleyebilirsiniz — örneğin site iki dilliyse ama randevuları tek dilde almak istiyorsanız.
Belirli bir hizmete veya uzmana bağlantılar. Widget etiketine öznitelikler ekleyebilirsiniz — misafir doğrudan gereken adıma düşer:
| Öznitelik | Ne yapar |
|---|---|
data-service="hizmet id" |
hizmet önceden seçilidir — sitenizdeki hizmet açıklamasının yanında «Randevu al» düğmesi. Tanımlayıcı, «Menü» bölümünde kalemin yanında görünür |
data-master="uzman id" |
uzman önceden seçilidir — belirli bir uzmanın sayfası için; uzmanın tanımlayıcısı çalışanın tanımlayıcısıyla aynıdır |
data-open="true" |
randevu paneli düğmeye basılmadan kendiliğinden açılır — ayrı bir «Randevu al» sayfası için |
Eskimiş bir tanımlayıcı (hizmetin adı değişti, uzman işten ayrıldı) widget'ı bozmaz: sessizce ilk adımdan başlayan normal seçimi gösterir.
Randevuya kadar daha az adım:
- tek hizmet veya tek uygun uzman varsa — gereksiz ekran gösterilmez;
- «⚡ En yakın: bugün 17:30» çipi tek dokunuşla randevu aldırır, takvim ise boş saati olan ilk günde kendiliğinden açılır;
- ad, telefon ve e-posta misafirin cihazında hatırlanır: tekrar randevu alırken alanlar zaten doludur, «Ben değilim» bağlantısı ise onları siler;
- telefonda panel tam ekran açılır, randevu düğmesi klavyenin altında kaybolmaz;
- widget klavyeyle kullanılabilir ve ekran okuyucu tarafından doğru okunur.
E-posta. E-posta alanı isteğe bağlıdır; misafir adresini bıraktıysa ziyaret ayrıntılarını ve «Randevuyu yönet» bağlantısını içeren bir mektup alır, ziyareti bu bağlantıyla kendisi taşır veya iptal eder. Ayrıntılar — Randevu defteri bölümünde.
Widget ne getirdi. Randevu defterindeki «🌐 Sitedeki widget» düğmesi 7, 30 veya 90 günlük huniyi gösterir: düğme kaç kez görüldü, kaç misafir paneli açtı, iletişim adımına geldi ve randevu aldı, dolu saat yüzünden kaç randevu kaybedildi. Siteden gelen randevuların yanında ise «Siteden» rozeti bulunur.
Kurulum kontrolü#
«Kurulumu Kontrol Et» butonu sitenizi açar ve sayfanın kaynak HTML'ini okur. Yanıtta:
- «Widget kodu sitede bulundu» — tek etiket yerinde;
- «Yalnızca ayrı widget etiketleri bulundu» — eski tekil eklemeler çalışıyor, tek etiket yok;
- «Sitedeki kod başka bir lokasyona ait» — etikette başkasına ait bir
data-domainvar (birden fazla işletmede sık yapılan bir hata); - «Bu sayfada widget kodu yok» — etiket görünmüyor.
⚠️ Kontrol tek bir sayfanın kaynak HTML'ini okur. Etiketi tarayıcıda Google Tag Manager veya başka bir betik ekliyorsa, kontrol bunu göremez — bu bir hata değildir. Yöntemin sınırında kalan diğer durumlar aşağıda toplanmıştır: «Kurulum kontrolünün göremedikleri».
Aynı analiz herkese açık, panele girmeden de yapılabilir — «Site kontrolü» sayfası: adresi yazın, sayfanın HTML’ini okur ve sayaçlarla reklam pikselllerini adlarıyla, onay banner’ının durumunu (bizim, başka bir sağlayıcının ya da hiç) ve etiketimizin açık widget’larıyla görünüp görünmediğini gösterir. Siteyi bağlamadan önce kontrol etmek ve bağlantıyı geliştiriciye ya da müşteriye vermek için kullanışlıdır.
Kurulum kontrolünün göremedikleri#
Yöntem basit ve dürüsttür: tek bir adresin kaynak HTML'i için tek bir istek, tarayıcı olmadan. Sunucunun döndürdüğünü okur ve işaretlemede yollarımızı içeren <script src="…"> ararız. Yapamadıklarının listesi buradan çıkar — bu bir arıza değil, yöntemin sınırıdır.
| Durum | Kontrol ne der | Gerçekte nasıl anlaşılır |
|---|---|---|
| Etiketi Google Tag Manager ya da başka bir betik tarayıcıda ekliyor | «kod yok» | Siteyi açın: widget ya vardır ya yoktur. Geliştirici araçlarında Network sekmesi, filtre site/v1.js |
| Sitenin başka bir sayfası: etiket ana sayfanın şablonunda var ama blog veya katalog sayfalarında yok | «site adresi» alanındaki adres hakkında yanıt | Alana iç sayfanın tam adresini yazıp kontrolü yeniden çalıştırın |
| SPA (istemci tarafında çizilen React, Vue vb.): işaretlemeyi JS tarayıcıda oluşturur | widget sitede çalışsa bile «kod yok» | Gözünüzle bakın. Etiketi uygulamanın içine değil, sunucu şablonuna ya da index.htmle koymak daha güvenlidir |
| SPA içinde sayfa yeniden yüklenmeden gezinme | hiçbir şey: kontrol sitede tıklamaz, yalnızca ilk sunucu yanıtını görür | Bölümleri kendiniz gezin — widget sayfada yaşar ve bu geçişleri atlatır |
Site yalnızca http:// üzerinden yanıt veriyor ya da giriş, IP filtresi veya bot korumasının arkasında |
kontrol hatası | Kontrol yalnızca https üzerinden ve kimlik doğrulaması olmadan gider; böyle bir siteye kendiniz bakın |
| Çok büyük sayfa | işaretlemenin ilk 512 KB'ı okunur | Etiketin yeri şablondaki <head>tir — orada sayfanın başında olur |
| Arka arkaya üçten fazla yönlendirme | hata | Son adresi yazın |
| Platformun ya da CDN'in önbelleği etiketsiz bir kopya sunuyor | «kod yok» | Önbelleği temizleyip tekrarlayın |
| Etiket var ama widget çalışmıyor (ödenmemiş, anahtar kapalı, gösterim koşulları) | «kod bulundu» | Bu başka bir konudur — widget'ın kendi makalesine bakın |
Kontrolün iyi gördüğü şeyler: etiketimizin kaynak işaretlemede olup olmadığı, tek yükleyici mi yoksa ayrı etiketler mi olduğu ve içindeki data-domainin kime ait olduğu — yani «kodu komşu lokasyondan kopyalamak» hatasını yakalar.
Herkese açık «Site kontrolü» sayfasının sınırı da tam olarak aynıdır: kaynak HTML'i okur, betikleri çalıştırmaz. Gerçek çerezleri ve tarayıcıda yüklenenleri yalnızca CMP tarayıcısı toplar — bkz. Cookies ve onay.
Widget'ı ayrı bir bölüm olarak çıkarma#
Widget'lardan biri sizin ana ürününüzse (örneğin yalnızca pop-up'ları veya yalnızca çerez banner'ını kullanıyorsanız), «Pazarlama → Sitem → kart → dişli» yolu çok uzun. Kartta «Kenar çubuğuna çıkar» butonu bulunur — widget kendi menü öğesini alır ve tek tıkla açılır.
Bu, arayüzünüzün bir ayarıdır: yalnızca bölümün görünürlüğünü yönetir, widget'ın sitedeki çalışmasını değil.
Ne ücretsiz, ne ücretli eklenti#
Widget'ların bir kısmı aboneliğe dahildir, bir kısmı ise «Eklentiler» bölümünden eklenti olarak bağlanır: Rezervasyon, Popup'lar ve Formlar, Destek Merkezi ve Hukuki Belgeler ücretli olarak işaretlenmiştir — kartta «Ücretli Eklenti» rozeti bulunur. Anahtar bu durumda kilitlenmez: sizde zaten çalışan bir widget aniden kapanmaz. Planlar ve ödeme — Uygulama Mağazası ve Abonelik bölümlerinde.
İlgili bölümler#
- Site oluşturucu — kendi siteniz yoksa ve bizim vitrinimize ihtiyacınız varsa
- Kendi kodunuzla vitrin (headless) — siteyi geliştiriciniz yazıyorsa ve verileri bizden alıyorsa
- Kendi alan adınız — kendi alan adınızı vitrinimize bağlama
Sık sorulan sorular#
Kendi sitemden vazgeçmem mi gerekiyor? Hayır. Widget'lar sitenizin üzerinde yaşar, tasarımı ve hostingi değiştirmezsiniz.
Birden fazla widget varsa kaç etiket eklemeliyim? Bir tane. Widget bileşimi — panelde açma/kapama düğmeleriyle belirlenir.
Widget'lar siteyi yavaşlatır mı?
Yükleyici asenkron (async) olarak bağlanır ve sayfanın çizimini engellemez; her widget yalnızca etkinleştirilmişse ayrı küçük bir dosya olarak yüklenir.
Birden fazla işletmem var — ne yapmalıyım?
Widget'lar konum bazında yapılandırılır: bölümün üstündeki listeden konumu seçin ve onun kurulum kodunu alın. Her sitenin kendi data-domain değeri vardır.
Widget'ları birkaç farklı siteye koyabilir miyim? Evet, tek bir konumun etiketi birden çok sayfaya veya siteye eklenebilir — veriler tek bir konuma gelir.