En çok ihtiyaç duyduğunuzda güvenilir WordPress eğitimleri.
WordPress Başlangıç Rehberi
WPB Kupası
25 Milyon+
Eklentilerimizi kullanan web siteleri
16+
Yıllık WordPress deneyimi
3000+
Uzmanlardan WordPress eğitimleri

WordPress Kod Düzenleyicisinde HTML Nasıl Düzenlenir (Yeni Başlayanlar İçin Kılavuz)

WordPress sitenizin tasarımı ve işlevi üzerinde daha fazla kontrol mü arıyorsunuz? HTML düzenlemeyi öğrenmek cevaptır.

HTML (HyperText Markup Language), içeriğinizi yapılandıran ve web tarayıcılarına sayfalarınızı nasıl görüntüleyeceklerini söyleyen koddur. Doğrudan düzenlemek, gelişmiş özelleştirme, belirli işlevler ekleme ve sorun giderme için kullanışlıdır.

WPBeginner'da kodla uğraşmaktan çekinen kullanıcılardan sık sık duyuyoruz, ancak WordPress'te HTML düzenlemek düşündüğünüzden daha kolaydır.

Bu makalede, WordPress kod düzenleyicisinde HTML'yi birkaç farklı yöntem kullanarak nasıl düzenleyeceğinizi göstereceğiz.

WordPress kod düzenleyicisinde HTML nasıl düzenlenir

WordPress'te HTML'yi Neden Düzenlemelisiniz?

WordPress, web sitenizin görünümünü değiştirmek ve tek bir kod satırına dokunmadan farklı öğeleri özelleştirmek için binlerce tema ve eklenti sunar.

Ancak, eklentilerin ve temaların kendi sınırlamaları vardır ve tam olarak aradığınız özellikleri sunmayabilirler. Sonuç olarak, web sitenizi istediğiniz gibi stilize edemeyebilirsiniz.

HTML düzenlemenin gerçekten faydalı olduğu yer burasıdır. HTML kodu kullanarak gelişmiş özelleştirmeleri kolayca gerçekleştirebilirsiniz. Sitenizin nasıl görüneceği ve işlev göreceği konusunda size çok fazla esneklik ve kontrol sağlar.

Ayrıca, HTML düzenlemeyi öğrenmek, kontrol paneline erişiminiz olmadığında WordPress web sitenizdeki hataları belirlemenize ve düzeltmenize de yardımcı olabilir.

Not: HTML düzenlemek istemiyorsanız ancak yine de tam özelleştirme seçeneklerine sahip olmak istiyorsanız, sürükle ve bırak WordPress sayfa oluşturucu gibi SeedProd kullanmanızı öneririz.

Bununla birlikte, bir WordPress web sitesinde HTML düzenlemenin farklı yollarına bakalım.

Blok düzenleyici ve klasik düzenleyiciyi kullanarak HTML'yi nasıl düzenleyeceğimizi ele alacağız ve ayrıca sitenize kod eklemenin kolay bir yolunu göstereceğiz. Tercih ettiğiniz bölüme atlamak için aşağıdaki bağlantılara tıklayabilirsiniz.

WordPress Blok Düzenleyicide HTML Nasıl Düzenlenir

WordPress blok düzenleyicisinde, gönderinizin veya sayfanızın HTML'ini düzenlemenin birden çok yolu vardır.

İlk olarak, içeriğinize HTML kodu eklemek için Özel HTML bloğunu kullanabilirsiniz.

Başlamak için WordPress kontrol panelinize gidin ve ardından yeni bir gönderi/sayfa ekleyin veya mevcut bir makaleyi düzenleyin. Ardından, sol üst köşedeki artı (+) işaretine tıklayın ve 'Özel HTML' bloğu ekleyin.

WordPress'te özel HTML bloğu ekleme

Ardından, bloğa özel HTML kodunuzu girin.

HTML kodunun düzgün çalışıp çalışmadığını ve içeriğinizin canlı web sitenizde nasıl görüneceğini kontrol etmek için 'Önizleme' seçeneğine de tıklayabilirsiniz.

WordPress Düzenleyicisinde Özel HTML Kodu

WordPress blok düzenleyicide HTML kodu eklemenin veya değiştirmenin bir başka yolu da belirli bir bloğun HTML'ini düzenlemektir.

Bunu yapmak için, içeriğinizdeki mevcut bir bloğu seçin ve ardından üç noktalı menüye tıklayın. Ardından, 'HTML olarak düzenle' seçeneğine tıklayın.

Üç noktaya tıklayın ve HTML olarak düzenle'yi seçin

Şimdi tek bir bloğun HTML'sini göreceksiniz. İçeriğinizin HTML'sini düzenlemeye devam edin.

Örneğin, nofollow bağlantısı ekleyebilir, metninizin stilini değiştirebilir veya başka kodlar ekleyebilirsiniz.

Bireysel bir bloğun HTML'sini düzenleyin

Tüm gönderinizin HTML'ini düzenlemek istiyorsanız, WordPress blok düzenleyicisindeki 'Kod Düzenleyici'yi kullanabilirsiniz.

Üç nokta seçeneğine tıklayarak kod düzenleyiciye erişebilirsiniz. Ardından açılır menüden 'Kod Düzenleyici'yi seçin.

Kod Düzenleyiciye Erişin

WordPress Klasik Düzenleyicisinde HTML Nasıl Düzenlenir

Eğer WordPress klasik düzenleyicisini kullanıyorsanız, Metin görünümünde HTML'yi kolayca düzenleyebilirsiniz.

Metin görünümüne erişmek için bir blog yazısını düzenleyin veya yenisini ekleyin. Klasik düzenleyicideyken, makalenizin HTML'ini görmek için 'Metin' sekmesine tıklayın.

HTML'i düzenlemek için Klasik Düzenleyici'deki Metin'e tıklayın

Bundan sonra, içeriğinizin HTML'ini düzenleyebilirsiniz. Örneğin, farklı kelimeleri belirginleştirmek için kalın yapabilir, metinde italik stil kullanabilir, listeler oluşturabilir, içindekiler tablosu ekleyebilir ve daha fazlasını yapabilirsiniz.

WordPress Widget'larında HTML Nasıl Düzenlenir

Sitenizin widget alanına HTML kodu ekleyip düzenleyebileceğinizi biliyor muydunuz?

WordPress'te Özel HTML widget'ı kullanarak kenar çubuğunuzu, altbilginizi ve diğer widget alanlarını özelleştirebilirsiniz. Örneğin, iletişim formları, harekete geçirici mesaj (CTA) düğmeleri, Google Haritalar ve diğer içerikleri yerleştirebilirsiniz.

WordPress yönetici panelinize giderek başlayabilir ve ardından Görünüm » Widget'lar'a gidebilirsiniz. Ardından, HTML kodu eklemek istediğiniz herhangi bir widget alanındaki 'Artı' simgesine tıklayın.

Mevcut widget alanları, kullandığınız WordPress temasına bağlı olacaktır. Örneğin, altbilgi, üstbilgi veya diğer alanlara ekleyebilmeniz mümkün olabilir.

Widget eklemek için Artı simgesine tıklayın

Ardından, widget blok menüsünde Özel HTML widget'ını arayın ve widget alanına otomatik olarak eklemek için tıklayın.

WordPress'e özel HTML widget'ı ekleyin

Bundan sonra, Özel HTML widget'ınıza tıklayabilir ve HTML kodunu girebilirsiniz.

İşiniz bittiğinde, ekranın sağ üst köşesindeki 'Güncelle' düğmesine tıklamayı unutmayın.

Widget bloğuna özel HTML kodu ekleyin

Artık Özel HTML widget'ının çalıştığını görmek için web sitenizi ziyaret edebilirsiniz.

Özel HTML Önizleme

WordPress Tema Düzenleyicisinde HTML Nasıl Düzenlenir

Web sitenizin HTML'sini düzenlemenin bir diğer yolu WordPress Tema Düzenleyicisini (Kod Düzenleyici) kullanmaktır.

Ancak, Tema Düzenleyicisinde kodu doğrudan düzenlemenizi önermiyoruz. Kod girerken yapılacak en ufak bir hata web sitenizi bozabilir ve WordPress kontrol paneline erişiminizi engelleyebilir.

Ayrıca, temanızı güncellerseniz, tüm değişiklikleriniz kaybolur.

Bununla birlikte, Tema düzenleyicisini kullanarak HTML düzenlemeyi düşünüyorsanız, herhangi bir değişiklik yapmadan önce web sitenizi yedeklemeniz iyi bir fikirdir.

Ardından, WordPress kontrol panelinizden Görünüm » Tema Düzenleyici'ye gidin. Şimdi tema dosyalarını doğrudan düzenleme hakkında bir uyarı mesajı göreceksiniz.

WordPress'te tema düzenleyici uyarısı

‘Anladım’ düğmesine tıkladığınızda, tema dosyalarınızı ve kodunuzu göreceksiniz.

Buradan, hangi dosyayı düzenlemek istediğinizi seçebilir ve değişikliklerinizi yapabilirsiniz.

WordPress Tema Düzenleyici

FTP Kullanarak WordPress'te HTML Düzenleme

WordPress tema dosyalarındaki HTML'yi düzenlemenin bir diğer alternatif yöntemi, dosya aktarım protokolü hizmeti olarak da bilinen FTP'yi kullanmaktır.

Bu, tüm WordPress barındırma hesaplarıyla birlikte gelen standart bir özelliktir.

Kod düzenleyici yerine FTP kullanmanın faydası, FTP istemcisini kullanarak sorunları kolayca düzeltebilmenizdir. Bu şekilde, HTML düzenlerken bir şeyler bozulursa WordPress kontrol panelinize erişiminiz engellenmez.

Başlamak için öncelikle bir FTP yazılımı seçmeniz gerekecektir. Bu öğreticide FileZilla'yı kullanacağız, çünkü Windows, Mac ve Linux için ücretsiz ve kullanıcı dostu bir FTP istemcisidir.

FTP istemcinizi seçtikten sonra, sitenizin FTP sunucusuna giriş yapmanız gerekecektir. Giriş ayrıntılarını barındırma sağlayıcınızın kontrol paneli kontrol panelinde bulabilirsiniz.

Giriş yaptıktan sonra, 'Uzak site' sütunu altında web sitenizin farklı klasörlerini ve dosyalarını göreceksiniz. wp-content » theme yolunu izleyerek tema dosyalarınıza gidin.

Artık web sitenizde farklı temalar göreceksiniz. Düzenlemek istediğiniz temayı seçin.

FTP istemcisinde tema dosyalarınıza gidin

Ardından, HTML'i düzenlemek için bir tema dosyasına sağ tıklayabilirsiniz. Örneğin, altbilgide değişiklikler yapmak istiyorsanız, footer.php dosyasına sağ tıklayın.

Birçok FTP istemcisi, dosyayı görüntülemenize ve düzenlemenize ve değişiklikleri yaptıktan sonra otomatik olarak yüklemenize olanak tanır. FileZilla'da bunu ‘Görünüm/Düzenle’ seçeneğine tıklayarak yapabilirsiniz.

Tema dosyanızı indirin ve düzenleyin

Ancak, herhangi bir değişiklik yapmadan önce düzenlemek istediğiniz dosyayı masaüstünüze indirmenizi öneririz.

HTML'yi düzenledikten sonra orijinal dosyayı değiştirebilirsiniz. Daha fazla ayrıntı için, WordPress'e dosya yüklemek üzere FTP kullanma konusundaki rehberimizi izlemenizi öneririz: WordPress'e dosya yüklemek için FTP kullanma.

WordPress'e Kolayca Kod Ekleme Yöntemi

WordPress'e kod eklemenin en kolay yolu, piyasadaki en iyi kod parçacığı eklentisi olan WPCode'u kullanmaktır.

WPCode Pro sürümü

WPBeginner ekibi bu eklentiyi, yeni başlayanların bile dakikalar içinde sitelerine özel kod ekleyebilmeleri için tasarladı. Ayrıca, eklentinin %100 ücretsiz olarak kullanılabilen bir lite sürümü de bulunmaktadır.

Kodunuzu tek bir yerde saklandığı için düzenlemeye yardımcı olur. Ayrıca, kodu manuel olarak düzenlerken oluşabilecek hataları önler.

Bir diğer faydası da, temanızı güncellemeye veya değiştirmeye karar verirseniz kodunuzun silinmesi konusunda endişelenmenize gerek olmamasıdır.

Yapmanız gereken ilk şey, web sitenize ücretsiz WPCode eklentisini yüklemek ve etkinleştirmektir. Daha fazla ayrıntı için, bir WordPress eklentisinin nasıl kurulacağına dair ayrıntılı eğitimimizi takip edebilirsiniz.

Eklenti etkinleştirildikten sonra, yönetici panelinizden Kod Parçacıkları » Üst Bilgi ve Alt Bilgi bölümüne gidebilirsiniz.

Ardından, HTML kodunu web sitenizin üstbilgi, gövde ve altbilgi kutularına ekleyebilirsiniz.

Örneğin, web sitenizde bir uyarı çubuğu görüntülemek istediğinizi varsayalım. HTML kodunu 'Gövde' kutusuna girebilir ve 'Değişiklikleri Kaydet' düğmesine tıklayabilirsiniz.

HTML kodunu WPCode eklentisini kullanarak ekleme

Bunun yanı sıra, üstbilgiye bir Google Analytics izleme kodu, Facebook pikseli ve TikTok reklam pikseli ekleyebilirsiniz. Veya eklentiyi kullanarak web sitenizin altbilgisine bir Pinterest düğmesi ekleyebilirsiniz.

WPCode ile kodun nereye çıktığına karar vermek de kolaydır. Örneğin, her gönderinin başına veya sonuna otomatik olarak bazı HTML kodları gösterebilirsiniz.

Daha fazla ayrıntı için, WordPress'te üstbilgi ve altbilgi kodunu nasıl ekleyeceğiniz hakkındaki rehberimize bakabilirsiniz.

Umuyoruz ki bu makale, WordPress kod düzenleyicisinde HTML'yi nasıl düzenleyeceğinizi öğrenmenize yardımcı olmuştur. Ayrıca, WordPress'e HTML formlarının nasıl ekleneceğine dair rehberimize veya web siteniz için WordPress kullanmanızın en önemli nedenlerine göz atmak isteyebilirsiniz.

Bu makaleyi beğendiyseniz, lütfen WordPress video eğitimleri için YouTube Kanalımıza abone olun. Bizi ayrıca Twitter ve Facebook'ta da bulabilirsiniz.

Açıklama: İçeriğimiz okuyucu desteklidir. Bu, bazı bağlantılarımıza tıklamanız durumunda komisyon kazanabileceğimiz anlamına gelir. WPBeginner'ın nasıl finanse edildiğini, neden önemli olduğunu ve bize nasıl destek olabileceğinizi görün. İşte editöryal sürecimiz.

Nihai WordPress Araç Seti

Araç Kitimize ÜCRETSİZ erişim kazanın - her profesyonelin sahip olması gereken WordPress ile ilgili ürün ve kaynaklardan oluşan bir koleksiyon!

Okuyucu Etkileşimleri

2 CommentsLeave a Reply

  1. Bir WordPress sayfasında, CSS ve JS içeren tam bir HTML dosyasını çalıştırmak gibi, HTML/CSS/JS çalıştırmanın bir yolu var mı? Bana önerebileceğiniz bir eklenti var mı?

Yanıt Bırakın

Yorum bırakmayı seçtiğiniz için teşekkürler. Lütfen tüm yorumların yorum politikamıza göre denetlendiğini ve e-posta adresinizin YAYINLANMAYACAĞINI unutmayın. Lütfen isim alanında anahtar kelime KULLANMAYIN. Kişisel ve anlamlı bir sohbet edelim.