Özel Kod Gömme - Webflow Yardım

Last updated on 10/23/2025@mrbirddev
Özel Kod Gömme - Webflow Yardım

Kod Gömme öğesini kullanarak sitenize özel kod blokları ekleyin ve her türlü özel işlevselliği açın.

Kod Gömme öğesi yalnızca HTML, <style> etiketlerinde CSS ve <script> etiketlerinde JS destekler. Sunucu tarafı dillerini (örneğin, Perl, PHP, Python, Ruby) bir Kod Gömme öğesinde entegre edemezsiniz.
Özel kod, Webflow'un temel işlevselliğiyle çakışabilecek gelişmiş bir değişikliktir. Bu nedenle, Webflow herhangi bir özel kodun işlevselliğini veya tam uyumluluğunu garanti edemez. Ayrıca, destek ekibimiz özel kod kurulumu veya sorun giderme konularında doğrudan yardım sağlayamaz, çünkü bu konular müşteri destek politikamızın kapsamı dışındadır. Özel kodla ilgili sorunlarla karşılaşırsanız, lütfen Webflow Forumunda bize bildirin, burada tüm Webflow topluluğu (personel dahil) ek yardım ve kaynaklar sağlayabilir.

Kod Gömme öğesi nasıl eklenir

Tasarımınıza veya zengin metin öğesine üçüncü taraf kodu veya kendi özel kodunuzu gömebilirsiniz.

Bir Kod Gömme öğesindeki özel kod 50.000 karakteri aşamaz. Gömlemek istediğiniz kod daha uzunsa, başka bir sunucuda saklayabilir ve gömmenizdeki betiğe referans verebilirsiniz. Ayrıca, üçüncü taraf bir araç kullanarak özel kodunuzu küçültebilir veya kodu birden fazla Gömme öğesine bölebilirsiniz (bu, herhangi bir JavaScript işlevini bozmadığı sürece).

Özel kodu doğrudan tasarımınıza nasıl ekleyebilirsiniz

  • Gömlemek istediğiniz kodu panonuza kopyalayın
  • Ekle panelini açın ve Webflow tuvaline bir Kod Gömme öğesi ekleyin
    1. adımda kopyaladığınız özel kodu yapıştırın
  • Modali kaydedin ve kapatın
Özel kodunuzun açılış ve/veya kapanış etiketleri varsa, kodunuzun beklendiği gibi çalışmasını sağlamak için bunları eklediğinizden emin olun. Ayrıca, özel kodunuza <html>, <body> veya <head> etiketlerini eklemeyin, aksi takdirde web siteniz/düzeniniz bozulur.
Kodun daha kolay görüntülenmesi ve düzenlenmesi için satır kaydırma varsayılan olarak etkindir, ancak bu ayarı kod düzenleyici içindeki Satır kaydırma onay kutusunun işaretini kaldırarak kapatabilirsiniz. Ayrıca, “maksimize et” simgesine tıklayarak tam ekran düzenlemeyi etkinleştirebilirsiniz.
Profesyonel ipucu: Siteniz boyunca aynı gömülü içeriği yeniden kullanmak istiyorsanız, Kod Gömme öğenizi yeniden kullanılabilir bir bileşene dönüştürmek için bileşenleri kullanabilirsiniz.

Zengin metin öğesine özel kod nasıl eklenir

  • Gömlemek istediğiniz kodu panonuza kopyalayın
  • Özel kodunuzu eklemek istediğiniz zengin metin öğesine imlecinizi yerleştirin
  • Ekleme menüsünü açmak için “artı” simgesine tıklayın ve özel kod düğmesine tıklayın
    1. adımda kopyaladığınız özel kodu yapıştırın

Özel kodunuzda dinamik içerik nasıl kullanılır

Gömülü koda Koleksiyon alanlarını dahil ederek çeşitli kullanımlar için bilgileri dinamik olarak çekebilirsiniz. Daha fazla bilgi edinin: Webflow Yardım Merkezi'nde Dinamik gömüler bölümüne bakın.

Kod Gömme öğesi nasıl düzenlenir

Kod Gömme öğesindeki kodu düzenlemek ve kod düzenleyicisini açmak için birkaç yol vardır. Şunları yapabilirsiniz: - Tuşuna çift tıklayarak tuval üzerindeki Kod Gömme öğesini seçin - Tuval üzerindeki Kod Gömme öğesini seçin ve enter tuşuna basın - Tuval üzerindeki Kod Gömme öğesini seçin ve ayar “dişli” simgesine tıklayın - Tuval üzerindeki Kod Gömme öğesini seçin ve Ayarlar paneli altındaki Kod Gömme ayarları bölümünde Kod düzenleyicisini aç seçeneğine tıklayın
Bilmekte Fayda Var: Code Embed öğenizi tuvalde göremiyorsanız, Navigator panelinden bulup seçebilirsiniz. Ardından, Ayarlar panelini açın ve kodunuzu düzenlemek için Code Embed ayarları altında Kod düzenleyicisini aç seçeneğine tıklayın.

Code Embed öğesinde boyutları nasıl ayarlayabilirsiniz

Eğer Code Embed öğesindeki özel kod boyutlandırmayı veya boyutları açıkça belirtmiyorsa, içerik genellikle üst öğesinin tam genişliğini kaplayabilir. Genişliği ve yüksekliği ayarlamak için özel kodunuza height="100%" width="100%" ekleyebilirsiniz ve bu, gömme öğesinin ve içeriğin genişliğini ve yüksekliğini Stil panelinden ayarlamanıza olanak tanır.

Gömülü içeriği nasıl önizleyebilirsiniz

<iframe></iframe> veya <style> etiketleriyle sarılmış özel kod, tuvalde veya zengin metin öğenizde bir önizleme gösterecektir, ancak bazı kod gömmeleri yalnızca canlı web sitesinde görüntülenebilir. Kod düzenleyicide bir etiket kullanıldığında, Tasarımcıda o öğe için bir yer tutucu göreceksiniz.

Önizleme, yayınlama veya sitenizi dışa aktarma işlemi gerçekleştirdiğinizde, yerleştirdiğiniz yerdeki betik ve özel kod çalışacaktır.

Özel kodun etkileri önizleme modunda görünür, ancak siteniz yayınlanana kadar canlı hale gelmez.
Özel betikleri önizleme ve yorum modlarından hariç tutmak için kodunuzu aşağıdaki HTML yorumu içine alın:
Buradaki tüm kod hariç tutulacaktır

Daha fazla bilgi edinin: Test ve geri bildirim için .webflow.io'yu sahne alanı olarak kullanmayı görün.

SSS ve sorun giderme ipuçları

Code Embed öğesinde sunucu tarafı dilleri kullanabilir miyim?
Code Embed öğesinde sunucu tarafı dilleri (örneğin, Perl, PHP, Python, Ruby) entegre edemezsiniz. Code Embed öğesi yalnızca HTML, <style> etiketlerinde CSS ve <script> etiketlerinde JS destekler.

50.000 karakter sınırını Kod Gömme öğesi için artırabilir miyim?
Özel kod, Kod Gömme öğesinde 50.000 karakteri geçemez. Gömlemek istediğiniz kod daha uzunsa, başka bir sunucuda saklayabilir ve gömmenizdeki betiğe referans verebilirsiniz. Ayrıca, üçüncü taraf bir araç kullanarak özel kodunuzu küçültebilir veya kodu birden fazla Kod Gömme öğesine bölebilirsiniz (bu, JavaScript işlevlerini bozmadığı sürece).

Yardım edin! Özel kodum çalışmıyor!
Kodunuzun uygun açılış ve/veya kapanış etiketlerini içerdiğinden ve <html>, <body> veya <head> etiketlerini içermediğinden emin olun.

Ağustos 2020 itibarıyla, yeni yayınlanan Webflow siteleri jQuery v3.5.1 içerir. Özel kodla başka jQuery sürümlerini içe aktarmak, sitenizde çakışmalara ve beklenmedik davranışlara neden olabilir. onClick, onHover gibi DOM olaylarını etkileyen betikler de beklenmedik davranışlara neden olabilir.

Özel kodun, Webflow'un temel işlevselliğiyle çakışabilecek gelişmiş bir değişiklik olduğunu unutmamak önemlidir. Bu nedenle, Webflow herhangi bir özel kodun işlevselliğini veya tam uyumluluğunu garanti edemez.

Destek ekibimiz, özel kod kurulumu veya sorun giderme konusunda doğrudan yardım sağlayamaz, çünkü bu konular müşteri destek politikamızın kapsamı dışındadır. Özel kodla ilgili sorunlarla karşılaşırsanız, lütfen Webflow Forum'da bize bildirin; burada tüm Webflow topluluğu (personel dahil) ek yardım ve kaynaklar sağlayabilir.

Webflow yardımına geri dön

Last updated on 10/23/2025@mrbirddev
Recent Articles
Loading...