Kayıt Formları Oluşturma ve Gömme

Published: 16 Temmuz 2026 · Last updated: 21 Temmuz 2026 · By Marcus Biel

Gömülü Form, web sitenizdeki mevcut bir sayfanın doğrudan içine yerleştirilir. İçeriğin üzerinde görünmek yerine çevresindeki içeriğin bir parçası olarak kalır.

Gömülü Formlar blog yazılarında, kendi web sitenizdeki açılış sayfalarında, bülten bölümlerinde, kenar çubuklarında ve alt bilgilerde iyi çalışır. Form kodunu eklediğiniz konum, formun nerede görüneceğini belirler.

Bu kılavuz, Gömülü Formlara özgü adımları kapsar. Yaygın görsel düzenleme işlevleri, ana Kayıt Formu Oluşturucu kılavuzunda açıklanmıştır.

Gömülü Form Oluşturma

“Signup Forms”ı açın, “Create Form”a tıklayın ve “Embedded Form”u seçin. Anlaşılır bir dahili ad girin ve oluşturucuya devam edin.

Ayrıca Signup Forms Overview bölümünde formun adına tıklayarak mevcut bir formu düzenleyebilirsiniz.

Dahili ad ziyaretçilere otomatik olarak gösterilmez. Forma konumuna veya amacına göre “Ana Sayfa Bülteni”, “Blog Alt Bilgisi” ya da “Ürün Güncellemeleri” gibi bir ad verin.

Başlangıç Tasarımı Seçme

Gömülü Formlar boş form, standart form ve tasarlanmış dört şablon sunar:

• Sakin not
• Kupon şeridi
• Koyu editoryal
• Minimal mavi

Formun görüneceği web sitesinin alanına ve tonuna en uygun tasarımı seçin. Her başlangıç tasarımı, seçildikten sonra tamamen değiştirilebilir.

Gömülü Formu Tasarlama

Formu düzenlemek için “Layout” ve “Content” seçeneklerini kullanın. Gömülü Form; kayıt formunun yanı sıra destekleyici metinler, görseller, listeler, düğmeler, sosyal bağlantılar, abone sayacı, boşluklar veya ayraçlar içerebilir.

Dar bir kenar çubuğu veya alt bilgi için tek sütunlu tasarım genellikle daha kolay okunur. Daha geniş bir sayfa bölümünde iki sütunlu düzen, kısa bir açıklamayı veya görseli alanların yanına yerleştirebilir.

Abone alanlarını, zorunlu alanları, etiketleri, gizli etiketleri, ilerleme göstergesini ve isteğe bağlı abone sayacını seçmek için kayıt formu bloğunu seçin. Ardından form kapsayıcısını, alanları ve gönder düğmesini ayrı ayrı biçimlendirebilirsiniz.

Gömülü Form tuvalinin arka planını ve genel tasarım varsayılanlarını değiştirmek için “Page settings”i açın. Çevredeki web sitesini göz önünde bulundurun. Saydam veya sade bir arka plan genellikle daha doğal bir bütünlük sağlarken, kontrast oluşturan bir arka plan kayıt teklifinin öne çıkmasına yardımcı olur.

Düzenler, içerikler, katmanlar, alanlar, etiketler, tipografi ve görünümle ilgili tüm talimatlar Kayıt Formu Oluşturucusunu Kullanma bölümünde yer alır.

Kayıt Akışını Bağlama

Gönderimden sonra ne olduğunu, hangi Double Opt-in e-postasının gönderildiğini ve ziyaretçinin onaydan sonra ne gördüğünü incelemek için oluşturucu başlığındaki kayıt akışı kontrolünü kullanın.

Mevcut bir akışı seçebilir, atanmış akışı düzenleyebilir veya yeni bir akış oluşturabilirsiniz. Seçili akış başka formlarla paylaşılıyorsa, bu akışı düzenlemenin diğer formları da etkileyebileceğini unutmayın.

Önizleme ve Kaydetme

Formu web sitenize yerleştirmeden önce tamamını incelemek için “Preview”a tıklayın. Alan sırasını, etiketleri, hata alanını, düğme metnini ve destekleyici içeriğin miktarını kontrol edin.

Mevcut sürümü kaydetmek için “Save changes”a tıklayın. Formu gömmeye hazır olduğunuzda Signup Forms Overview bölümüne dönün.

Formu Etkinleştirme

Genel kodu kullanılmadan önce Gömülü Form etkin olmalıdır.

Form etkin değilse Signup Forms Overview bölümünde üç noktalı işlemler menüsünü açın ve “Activate”ı seçin. Etkin bir formda “Show Code Snippet” işlemi görünür.

Web sitenizde artık kullanılmaması gereken formları devre dışı bırakın. Devre dışı bırakma, tasarımını veya önceki rapor verilerini silmeden formu çevrimdışı duruma getirir.

JavaScript Kodunu Kopyalama

“Show Code Snippet”a tıklayın ve “JavaScript” sekmesini açın. Maildroppa, benzersiz form kimliğini içeren kısa bir komut dosyası sağlar.

Kod şu yapıyı izler:

<script async src="https://form.maildroppa.com/md-form-loader.js" data-md-form="[form-id]"></script>

Komple kodu, komut dosyası adresini veya form kimliğini değiştirmeden kopyalayın.

JavaScript seçeneği, kayıtlı mevcut formu Maildroppa form çalışma zamanı üzerinden yükler. Daha sonra Maildroppa’da aynı formu düzenleyip kaydettiğinizde, mevcut kod parçacığı yine o form kimliğine başvurur. Yalnızca metnini veya tasarımını değiştirmek için yeni bir form oluşturmanız gerekmez.

Formu Web Sitenize Ekleme

Komut dosyasını, Gömülü Formun görünmesini istediğiniz sayfa konumuna yapıştırın.

Kesin adımlar web sitenizin sistemine bağlıdır. Sayfa oluşturucuda veya içerik yönetim sisteminde özel HTML ya da komut dosyası kodunu kabul eden bir blok kullanın. Özel bir web sitesinde komut dosyasını ilgili şablona veya sayfa işaretlemesine ekleyin.

Bazı web sitesi düzenleyicileri güvenlik nedenleriyle komut dosyası etiketlerini kaldırır. Sayfayı yayımladıktan sonra form görünmüyorsa önce düzenleyicinin Maildroppa komut dosyasının tamamını koruyup korumadığını kontrol edin. Sistemin özel kod alanını kullanmanız veya web sitesini yöneten kişiden yardım istemeniz gerekebilir.

Aynı Gömülü Form parçacığını, aynı formu birden fazla konumda göstermek ve bu kurulumu test etmek gibi bilinçli bir amacınız yoksa, tek bir sayfaya birkaç kez yapıştırmayın.

HTML Sekmesini Kullanma

“HTML” sekmesi, oluşturulan form işaretlemesini sağlar. Bu seçenek, oluşturulan HTML ile doğrudan çalışmak istediğiniz özel uygulamalar için tasarlanmıştır.

Bu yöntemi seçerseniz işaretlemenin tamamını kopyalayın. Özel bir HTML entegrasyonu web sitenizin stillerinden ve uygulamasından etkilenebileceği için alanlarını, doğrulamayı, gönderimi ve onay akışını dikkatle test edin.

Normal Maildroppa tarafından yönetilen form için JavaScript kod parçacığı daha kısa entegrasyondur ve güncel genel form yapılandırmasını kimliği üzerinden yükler.

Gömülü Formu Test Etme

Kodu içeren web sitesi sayfasını yayımlayın veya önizleyin. Ardından formu bir ziyaretçi gibi test edin:

1. Formun doğru konumda göründüğünü kontrol edin.
2. Sayfayı geniş ve dar ekranlarda görüntüleyin.
3. Zorunlu tüm alanları doldurun.
4. Formu gönderin ve yanıtı inceleyin.
5. Double Opt-in e-postasını açın.
6. Adresi onaylayın ve son yanıtı inceleyin.
7. Abonenin ve gizli etiketlerin Maildroppa’da doğru göründüğünü doğrulayın.

Form web sitesi kapsayıcısından daha genişse oluşturucuda form genişliğini, sütun düzenini, iç dolguyu veya mobil yığın ayarlarını değiştirin. Düzen sorunlarını oluşturulan Maildroppa kodunu değiştirerek çözmekten kaçının.

Gömülü Formu Güncelleme

Maildroppa’da aynı formu açın, değişiklikleri yapın, önizleyin ve “Save changes”a tıklayın. Web sitenizdeki JavaScript kod parçacığı aynı form kimliğini kullanmaya devam eder ve kaydedilmiş genel yapılandırmayı yükler.

Formun geçici olarak kaldırılması gerekiyorsa Signup Forms Overview bölümünden devre dışı bırakın. Artık gerekli değilse, sayfada kullanılmayan kod kalmaması için kod parçacığını web sitesinden de kaldırın.