WordPress Iframe Ekleme

WordPress Iframe Ekleme

WordPress Iframe Ekleme: Adım Adım Rehber

Merhaba! Web sitenize harici içerikler eklemek, sitenizin işlevselliğini ve içeriğini zenginleştirmenin harika bir yoludur. Iframe kullanarak harici web sayfaları, videolar ve daha fazlasını WordPress sitenize kolayca ekleyebilirsiniz. Bu yazıda, WordPress sitenize iframe eklemenin adımlarını ve dikkat edilmesi gerekenleri detaylı bir şekilde anlatacağız. İşte “WordPress Iframe Ekleme” rehberi:

Referans Çalışmalarımı İnceleyin

Iframe Nedir?

Tanım ve Genel Bakış

Iframe (inline frame), bir HTML belgesi içine başka bir HTML belgesi eklemenizi sağlayan bir HTML etiketidir.

  • Özellikler:
    • Harici İçerik: Harici web sayfaları, videolar, haritalar ve daha fazlasını sitenize ekleyebilirsiniz.
    • Kolay Kullanım: Basit bir HTML etiketi kullanarak içerik ekleyebilirsiniz.
Neden Iframe Kullanmalısınız?

Iframe, sitenize çeşitli içerikleri eklemenin esnek ve etkili bir yoludur.

  • Özellikler:
    • Zengin İçerik: YouTube videoları, Google Haritalar ve diğer harici içerik kaynaklarını ekleyebilirsiniz.
    • Kullanıcı Deneyimi: Ziyaretçilerinize daha zengin ve etkileşimli içerikler sunabilirsiniz.

WordPress Iframe Ekleme Adımları

Adım 1: Iframe Kodunu Hazırlama

Eklemek istediğiniz içeriğin iframe kodunu alın.

  • Örnek Kod:
     
    <iframe src="https://www.example.com" width="600" height="400" frameborder="0" allowfullscreen></iframe>
     
  • Açıklama:
    • src: Iframe içinde görüntülenecek harici içeriğin URL’si.
    • width ve height: Iframe’in genişlik ve yükseklik değerleri.
    • frameborder: Çerçeve kenarlığını belirler (0 genellikle kenarlığı kaldırır).
    • allowfullscreen: Iframe içeriğinin tam ekran moduna geçmesine izin verir.
Adım 2: Iframe Kodunu WordPress’e Ekleme

Iframe kodunu WordPress sitenize ekleyin.

  • Adımlar:
    1. Yeni Gönderi veya Sayfa Oluşturma: “Gönderiler” > “Yeni Ekle” veya “Sayfalar” > “Yeni Ekle” sekmesine gidin.
    2. HTML Blok Kullanma: Gutenberg düzenleyicisinde, “Blok Ekle” butonuna tıklayın ve “Özel HTML” blokunu seçin.
    3. Iframe Kodunu Yapıştırma: Iframe kodunu HTML bloğuna yapıştırın.
    4. Yayınlama: Sayfanızı veya gönderinizi yayınlayın.
Adım 3: Klasik Düzenleyici Kullanarak Iframe Ekleme

Klasik düzenleyici kullanıyorsanız iframe kodunu eklemek için şu adımları izleyin.

  • Adımlar:
    1. Yeni Gönderi veya Sayfa Oluşturma: “Gönderiler” > “Yeni Ekle” veya “Sayfalar” > “Yeni Ekle” sekmesine gidin.
    2. Metin Moduna Geçiş: Düzenleyicinin sağ üst köşesindeki “Metin” sekmesine tıklayın.
    3. Iframe Kodunu Yapıştırma: Iframe kodunu metin düzenleyiciye yapıştırın.
    4. Yayınlama: Sayfanızı veya gönderinizi yayınlayın.

Benzer Kategorideki Yazılar

Iframe Kullanma İpuçları

Güvenlik

Iframe kullanırken güvenlik önlemlerine dikkat edin.

  • Öneriler:
    • Güvenilir Kaynaklar: Yalnızca güvenilir ve güvenli kaynaklardan gelen içerikleri iframe ile ekleyin.
    • SSL Kullanımı: HTTPS protokolü kullanan URL’leri tercih edin.
Stil ve Özelleştirme

Iframe’in görünümünü özelleştirerek sitenizle uyumlu hale getirin.

  • Öneriler:
    • CSS Kullanımı: Iframe’in stilini CSS ile özelleştirin. Örneğin:
       
      iframe {
      border: none;
      width: 100%;
      height: 500px;
      }
       
    • Responsive Tasarım: Iframe’inizi mobil uyumlu hale getirin. Örneğin:
       
      .responsive-iframe {
      position: relative;
      overflow: hidden;
      padding-top: 56.25%;
      }
      .responsive-iframe iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border: 0;
      }
       
Alternatif İçerik

Iframe kullanamadığınız durumlar için alternatif içerikler sunun.

  • Öneriler:
    • Noiframe Etiketi: Iframe desteklemeyen tarayıcılar için noiframe etiketi kullanın. Örneğin:
       
      <iframe src="https://www.example.com" width="600" height="400" frameborder="0" allowfullscreen></iframe>
      <noiframe>Tarayıcınız iframe desteğini kapalı. Lütfen <a href="https://www.example.com">bu bağlantıyı</a> ziyaret edin.</noiframe>
       

Sonuç

WordPress sitenize iframe eklemek, harici içerikleri sitenize entegre etmenin esnek ve etkili bir yoludur. Iframe kodunu hazırlama, WordPress’e ekleme ve güvenlik önlemleri gibi adımları izleyerek sitenize kolayca iframe ekleyebilirsiniz. Stil ve özelleştirme, güvenlik ve alternatif içerik gibi ipuçlarıyla iframe’lerinizi daha etkili ve kullanıcı dostu hale getirebilirsiniz.

Eğer WordPress iframe ekleme hakkında daha fazla bilgi edinmek veya profesyonel destek almak isterseniz, cagataydemir.com.tr adresinden hizmetlerime göz atabilirsiniz. Daha fazla ipucu ve güncel içerikler için LinkedIn profilimi takipte kalın!

Umarım bu rehber, WordPress sitenize iframe eklerken size yardımcı olur ve web sitenizin performansını artırmanıza katkı sağlar. Herhangi bir sorunuz veya yorumunuz varsa, lütfen benimle paylaşın!

Çağatay DEMİR

Web Developer

 

Paylaşın:

Picture of Çağatay Demir

Çağatay Demir

Orta Doğu Teknik Üniversitesi’nden mezun olduktan sonra Ege Üniversitesi’nde Uluslararası Bilgisayar bölümünde yüksek lisans eğitimime devam ettim. İzmir’de yaşıyorum.

Almanya, Avusturya, Belçika, Endonezya, Finlandiya, Fransa, Gürcistan, Kıbrıs, Türkiye gibi farklı ülke pazarlarında web tasarım çalışmaları yaptım. Birçok ülkede yer alan uluslararası bir koçluk firması olan ActionCOACH’un Fransa ve Türkiye şubelerinde web tasarımcı olarak çalışıyorum.

Dijital yeniliklikleri takip eden, işletmelerinin işlerini dijitalde büyütmelerine katkı sağlamak için çabalayan, potansiyellerini gerçeğe dönüştürmeye odaklanan biriyim.

Web Tasarım, E-Ticaret, WordPress, SEO, Dijital Marketing alanlarında freelance olarak hizmet veriyorum.

Bana Ulaşın

WordPress - Son Yazılarım

Blog Kategorileri

Hizmetlerim

Referanslarım

Benimle İletişime Geçin

İşletmenizi bugün dijitale taşıyalım!

Web tasarım, landing page, SEO, dijital marketing, pazaryeri mağaza yönetimi ihtiyaçlarınız için benimle iletişime geçin..
WordPress Kategorisinde

İlginizi Çekecek Yazılar

WordPress Bloglar

WordPress Bloglar

WordPress, kullanıcı dostu arayüzü ve geniş özellik yelpazesi ile blog yazmak için en popüler platformlardan biridir. Kendi blogunuzu başlatmak veya

WordPress Instagram

WordPress Instagram

Web sitenizi daha etkileşimli ve sosyal hale getirmek istiyorsanız, Instagram entegrasyonu harika bir seçenektir. WordPress sitenizde Instagram hesaplarınızı göstermek, ziyaretçilerinizle

WordPress Spam Mail Engelleme

WordPress Spam Mail Engelleme

WordPress sitenizde spam mailler, kullanıcı deneyimini olumsuz etkileyebilir ve sitenizin itibarını zedeleyebilir. Neyse ki, spam mail engellemek için kullanabileceğiniz çeşitli

WordPress Hosting Taşıma

WordPress Hosting Taşıma

Web sitenizi daha hızlı, güvenilir veya daha uygun maliyetli bir hosting sağlayıcısına taşımak istiyorsanız, doğru yerdesiniz. WordPress sitenizin hosting taşıma

WordPress Şirket Teması

WordPress Şirket Teması

WordPress, iş dünyasında güçlü ve profesyonel web siteleri oluşturmanın popüler yollarından biridir. Şirketiniz için doğru WordPress temasını seçmek, çevrimiçi varlığınızı

WordPress Web Tasarım

WordPress Web Tasarım

İnternetin hızla geliştiği bu dönemde, profesyonel bir web sitesine sahip olmak her işletme ve birey için büyük önem taşıyor. WordPress,

WordPress Google Harita Ekleme

WordPress Google Harita Ekleme

Web sitenize bir Google Harita eklemek, ziyaretçilerinizin işletmenizin konumunu bulmasını kolaylaştırır ve kullanıcı deneyimini artırır. WordPress sitenize Google Harita eklemenin

WordPress Güvenlik Önlemleri

WordPress Güvenlik Önlemleri

WordPress, dünyanın en popüler içerik yönetim sistemlerinden biri olmasına rağmen, güvenlik açıkları da maalesef zaman zaman ortaya çıkabilmektedir. Bu yazıda,

Blog Yazılarım

Etsy Komisyon Hesaplayıcı

Etsy Komisyon Hesaplayıcı

Etsy’de satış yaparken, platformun aldığı komisyon ve diğer ücretler, kâr marjınızı etkileyen önemli faktörlerdir. Etsy komisyonlarını ve ücretlerini doğru bir

Web Tasarım Kursu

Web Tasarım Kursu

Web tasarımı, günümüzde hızla büyüyen bir alan olup, dijital dünyada kariyer yapmak isteyenler için önemli fırsatlar sunar. Web tasarım kursları,

Mobil Web Site

Mobil Web Site

Mobil cihazların kullanımı hızla artarken, web sitenizin mobil uyumlu olması her zamankinden daha önemli hale geliyor. Mobil cihazlar üzerinden internete