WordPress ve Divi’de Sayfalarla Nasıl Çalışılır: Eksiksiz Adım Adım Rehber
WordPress, internetin %43’ünden fazlasını güçlendiriyor — ve bunun iyi nedenleri var. Sezgisel arayüzü, geniş eklenti ekosistemi ve esnek içerik yönetimi yetenekleri, onu solo blogculardan kurumsal düzey işletmelere kadar herkes için tercih edilen CMS haline getiriyor. WordPress’i Elegant Themes tarafından sunulan Divi teması ile birleştirdiğinizde, tek bir kod satırı yazmadan etkileyici, profesyonel sayfalar tasarlamanıza olanak tanıyan bir sürükle ve bırak görsel oluşturucunun kilidini açarsınız.
Bu kapsamlı kılavuzda, Divi Builder kullanarak WordPress’te sayfaları tam olarak nasıl oluşturacağınızı, özelleştireceğinizi, düzenleyeceğinizi ve yayınlayacağınızı öğreneceksiniz. İlk web sitenizi oluşturuyor olsanız da mevcut bir siteyi geliştiriyor olsanız da, bu eğitim bilmeniz gereken her şeyi kapsar.
WordPress’te Sayfalar Nedir? (ve Blog Yazılarından Nasıl Farklıdırlar)
Teknik adımlara geçmeden önce, bir WordPress sayfasının gerçekte ne olduğunu — ve blog yazısından nasıl farklı olduğunu anlamak önemlidir.
| Özellik | Sayfalar | Yazılar |
|---|---|---|
| İçerik türü | Statik, kalıcı | Zamana bağlı, dinamik |
| Organizasyon | Hiyerarşik (üst/alt) | Kronolojik (tarihe göre) |
| Tipik kullanım alanları | Hakkında, İletişim, Ana Sayfa, Hizmetler | Blog makaleleri, haber güncellemeleri |
| RSS akışında görünür | Hayır | Evet |
| Kategorileri/etiketleri destekler | Hayır | Evet |
Sayfalar, web sitenizin yapısal omurgasıdır. Sık sık değişmeyen ve kategorize edilmesi veya etiketlenmesi gerekmeyen içeriği barındırırlar. Hakkımızda, İletişim, Hizmetler veya Ana Sayfanızı düşünün — bunların tümü WordPress sayfalarının klasik örnekleridir.
Bu ayrımı anlamak, içeriğinizi nasıl organize edeceğiniz ve sunacağınız konusunda daha akıllı kararlar almanıza yardımcı olur.
Ön Koşullar: Başlamadan Önce Neye İhtiyacınız Var
Bu kılavuzu takip etmek için aşağıdakilerin yerinde olduğundan emin olun:
- Güvenilir bir hosting ortamında canlı bir WordPress kurulumu
- Divi teması yüklü ve etkinleştirilmiş (Elegant Themes’den kullanılabilir)
- WordPress panosuna yönetici erişimi
- Web sitenizin yapısı ve hedefleri hakkında temel bir anlayış
Hosting ortamınızı hala kuruyorsanız, AlexHost’tan VPS Hosting‘i düşünün — tam kök erişimi, özel kaynakları ve WordPress’i optimal hızda çalıştırma esnekliğini sağlayan yüksek performanslı, ölçeklenebilir bir çözüm. Daha küçük projeler veya kişisel siteler için, Paylaşımlı Web Hosting WordPress ile tamamen uyumlu, uygun fiyatlı ve başlangıç dostu bir alternatiftir.
Adım 1: WordPress Panonuza Giriş Yapın
Tercih ettiğiniz web tarayıcısını açarak WordPress yönetici paneline gidin. Varsayılan URL şu şekildedir:
http://yourdomain.com/wp-adminKullanıcı adınız ve şifrenizi girin, ardından Giriş Yap‘ı tıklayın. WordPress Panosuna ulaşacaksınız — tüm web sitenizin merkezi kontrol paneli.
> Pro İpucu: Birden fazla WordPress sitesini yönetiyorsanız veya daha akıcı bir yönetici deneyimi istiyorsanız, merkezi sunucu ve site yönetimi için tek bir sezgisel arayüzden cPanel VPS kullanmayı düşünün.
Adım 2: Yeni Bir WordPress Sayfası Oluşturun
Panoya girdikten sonra, yeni bir sayfa oluşturmak için şu adımları izleyin:
- Sol taraftaki navigasyon menüsünde, Sayfalar‘ı bulun ve tıklayın
- Sayfalar listesinin üstünde Yeni Ekle‘ye tıklayın (veya üst yönetici çubuğunda + Yeni > Sayfa kısayolunu kullanın)
- WordPress blok editörüne (Gutenberg) yönlendirileceksiniz
Başlık ve Temel İçerik Ekleme
- Üstteki “Başlık ekle” alanına tıklayın ve sayfa adınızı yazın (örn. *Hakkımızda*, *İletişim*, *Hizmetler*)
- Aşağıdaki içerik alanında, Gutenberg blok editörünü kullanarak metin blokları, görseller, başlıklar, düğmeler ve diğer öğeleri ekleyebilirsiniz
- Herhangi bir blok türünü hızlı bir şekilde aramak ve eklemek için editörde “/” kısayolunu kullanın
Bu aşamada, standart WordPress editörü ile çalışıyorsunuz. Ancak, gelişmiş görsel özelleştirme istiyorsanız — ve Divi kullanıyorsanız — bir sonraki adımda Divi Builder’ı etkinleştirmek isteyeceksiniz.
Adım 3: Divi Builder’ı Etkinleştirin ve Kullanın
Divi Builder, standart WordPress editörünü güçlü, görsel bir sürükle-bırak tasarım ortamına dönüştürür. İşte nasıl etkinleştireceğiniz ve kullanacağınız:
Divi Builder’ı Etkinleştirme
Sayfanızı editörde açtıktan sonra, içerik alanının üst kısmında belirgin bir düğme göreceksiniz:
“Divi Builder’ı Etkinleştir” — tıklayın.
WordPress size üç başlangıç seçeneği sunacaktır:
| Seçenek | En İyi Kullanım |
|---|---|
| Sıfırdan Oluştur | Tam yaratıcı kontrol ile özel düzenler |
| Önceden Hazırlanmış Düzen Seç | Divi’nin 800+ şablon kütüphanesini kullanarak hızlı başlangıçlar |
| Mevcut Sayfayı Klonla | Zaten oluşturduğunuz bir sayfanın tasarımını çoğaltma |
Projenize en uygun seçeneği belirleyin ve Oluşturmaya Başla‘yı tıklayın.
Divi Builder Yapısını Anlama
İçerik eklemeden önce, Divi’nin düzen hiyerarşisini nasıl organize ettiğini anlamak yardımcı olur:
Section
└── Row
└── Column
└── Module- Bölümler en büyük konteynerlerdir — sayfanın tam genişliğini kaplarlar
- Satırlar bölümlerin içinde yer alır ve sütun yapısını tanımlar (1, 2, 3 sütun, vb.)
- Sütunlar bir satır içindeki bireysel dikey bölümlerdir
- Modüller gerçek içerik öğeleridir (metin, resimler, düğmeler, formlar, vb.)
Adım 3a: Bölümler ve Satırlar Ekleme
- Tuval altındaki mavi “+” simgesini tıklayarak yeni bir Bölüm ekleyin
- Bölüm türünü seçin: Normal, Tam Genişlik veya Özel
- Bölümün içinde, “+” simgesini tıklayarak bir Satır ekleyin
- Tercih ettiğiniz sütun düzenini seçin (örneğin, iki sütunlu tasarım için 1/2 + 1/2)
Adım 3b: Modüller Ekleme
Modüller, her Divi sayfasının içerik yapı taşlarıdır. Bir tane eklemek için:
- Bir sütun içindeki gri “+” simgesini tıklayın
- Bir modül kütüphanesi görünecek — ihtiyacınız olan modülü arayın veya göz atın
- Modülü düzeninize eklemek için tıklayın
Yaygın olarak kullanılan Divi modülleri şunları içerir:
- Metin Modülü — paragraflar, başlıklar ve biçimlendirilmiş metin için
- Resim Modülü — fotoğraflar, grafikler ve illüstrasyonlar için
- Düğme Modülü — CTA’lar ve navigasyon bağlantıları için
- Kaydırıcı Modülü — hero görüntü karuseleri için
- İletişim Formu Modülü — potansiyel müşteri yakalama ve sorgulamalar için
- Blurb Modülü — simge + metin özellik kutuları için
- Video Modülü — gömülü video içeriği için
- Testimonial Modülü — sosyal kanıt ve incelemeler için
- Kod Modülü — özel HTML, CSS veya JavaScript kod parçacıkları için
Adım 3c: Modülleri Özelleştirme
Ayarlar panelini açmak için herhangi bir modüldeki kalem (düzenleme) simgesini tıklayın. Ayarlar üç sekmeye organize edilmiştir:
1. İçerik Sekmesi
Modülün gerçek içeriğini yapılandırın — metin, resimler, bağlantılar, düğme etiketleri, form alanları, vb.
2. Tasarım Sekmesi
Modülün görsel görünümünü kontrol edin:
- Tipografi — yazı tipi ailesi, boyutu, ağırlığı, satır yüksekliği, harf aralığı
- Renkler — arka plan, metin, kenarlık, simge renkleri
- Boşluk — padding ve margin kontrolleri (duyarlı kesme noktaları ile)
- Kenarlıklar ve Gölgeler — yuvarlatılmış köşeler, kutu gölgeleri, kenarlık stilleri
- Boyutlandırma — genişlik, yükseklik, maksimum genişlik kısıtlamaları
3. Gelişmiş Sekme
Geliştirici düzeyinde ayarlara erişin:
- CSS Sınıfları ve Kimlikler — özel stil kancaları için
- Özel CSS — modüle özgü CSS’yi doğrudan yazın
- Görünürlük — modülü masaüstü, tablet veya mobil cihazlarda göster/gizle
- Animasyonlar — giriş animasyon efektleri ve zamanlaması
> Tasarım İpucu: Divi’nin duyarlı kontrolleri, masaüstü, tablet ve mobil görünümler için farklı değerler ayarlamanıza olanak tanır. Yayınlamadan önce sayfanızı her üç kesme noktasında da önizleyin.
Adım 4: Sayfalarınızı Hiyerarşilerle Organize Edin
Web siteniz büyüdükçe, sayfaları organize etmek hem kullanıcı deneyimi hem de SEO için kritik hale gelir. WordPress, ilgili sayfaları ortak bir ana sayfa altında iç içe yerleştirmenizi sağlayan ana-alt sayfa hiyerarşilerini destekler.
Ana-Alt Sayfa İlişkisi Oluşturma
- Bir sayfayı düzenlerken, blok editöründe sağ taraftaki kenar çubuğuna bakın
- Sayfa‘ya tıklayarak sayfa ayarları panelini genişletin
- Sayfa Özellikleri bölümünü bulun
- Ana Sayfa altında, açılır menüye tıklayın ve ana sayfa olarak atamak istediğiniz sayfayı seçin
Örnek hiyerarşi:
Services (parent)
├── Web Design (child)
├── SEO Consulting (child)
└── Content Marketing (child)Bu yapı daha temiz URL’ler oluşturur (örn. yoursite.com/services/web-design/) ve arama motorlarının sitenizin içerik mimarisini daha iyi anlamasına yardımcı olur.
Adım 5: Sayfaları Navigasyon Menünüze Ekleyin
Bir sayfa oluşturmak, onu otomatik olarak web sitenizin navigasyonuna eklemez. Bunu manuel olarak bir menüye eklemeniz gerekir.
- WordPress panosunda Görünüm > Menüler‘e gidin
- Mevcut bir menüyü seçin veya Yeni Menü Oluştur‘a tıklayın
- Sayfalar panelinde, eklemek istediğiniz sayfaların yanındaki kutuyu işaretleyin
- Menüye Ekle‘ye tıklayın
- Menü öğelerini yeniden sıralamak veya açılır alt menüler oluşturmak için sürükleyip bırakın
- İşiniz bittiğinde Menüyü Kaydet‘e tıklayın
> En İyi Uygulama: Birincil navigasyon menünüzü en önemli sayfalarınıza odaklandırın. Ziyaretçileri bunaltmamak için maksimum 5–7 üst düzey öğeyi hedefleyin.
Adım 6: SEO ve Performans için Sayfa Ayarlarını Yapılandırın
Yayınlamadan önce, arama motoru görünürlüğünü ve kullanıcı deneyimini etkileyen temel sayfa ayarlarını yapılandırmak için bir moment ayırın.
Permalink (URL Slug)
- Blok editörü kenar çubuğunda Permalink bölümünü bulun
- URL slug’ını kısa, açıklayıcı ve anahtar kelime açısından zengin olacak şekilde düzenleyin
- Numaralarla otomatik oluşturulan slug’lardan kaçının (örn.
/?p=123) - İyi örnek:
yoursite.com/about-us/ - Kötü örnek:
yoursite.com/?page_id=47
Öne Çıkan Görsel
- Sosyal paylaşım görünümünü ve görsel tutarlılığını iyileştirmek için ilgili bir öne çıkan görsel atayın
Sayfa Şablonu
- Bazı temalar (Divi dahil) birden fazla sayfa şablonu sunar (örn. tam genişlik, kenar çubuğu yok)
- Sayfa Özellikleri > Şablon altında uygun şablonu seçin
SEO Meta Verileri
- Yoast SEO veya Rank Math gibi bir SEO eklentisi kullanıyorsanız, şunları doldurun:
- Meta başlığı — birincil anahtar kelimeyi dahil edin
- Meta açıklaması — ilgi çekici 150–160 karakterlik bir özet yazın
- Odak anahtar kelimesi — hedef arama teriminizi ayarlayın
Adım 7: Sayfanızı Kaydedin, Önizleyin ve Yayınlayın
Sayfa tasarımınız ve ayarlarınızdan memnun olduğunuzda, canlı yayına geçme zamanı gelmiştir.
Divi Builder’da Kaydetme Seçenekleri
Divi Builder arayüzünün sağ üst köşesinde şunları bulacaksınız:
- Save Draft — çalışmanızı kaydeder ancak herkese açık hale getirmez
- Preview — sayfanızın canlı önizlemesini yeni bir sekmede açar
- Publish/Update — sayfayı web sitenizde canlı yayına alır
Blok Editöründen Yayınlama
Divi Builder’dan çıkıp standart blok editörüne dönüşünüzde:
- Yayınlamadan kaydetmek için Save Draft öğesine tıklayın
- Sayfanın ön uçta nasıl göründüğünü gözden geçirmek için Preview öğesine tıklayın
- Canlı yayına almaya hazır olduğunuzda Publish öğesine tıklayın
- Onay panelinde tekrar Publish öğesine tıklayarak onaylayın
> Önemli: Yayınlamadan önce sayfanızı hem masaüstü hem de mobil cihazlarda önizleyin. Divi’nin duyarlı tasarım araçları güçlüdür, ancak manuel inceleme otomatik araçların kaçırdığı sorunları yakalar.
Gelişmiş İpuçları: WordPress ve Divi’den Daha Fazla Yararlanın
Genel Şablonlar için Divi Theme Builder’ı Kullanın
Divi Theme Builder (Divi 4.0+ sürümünde mevcuttur), başlıklar, altbilgiler ve belirli yazı/sayfa türleri için genel şablonlar oluşturmanıza olanak tanır. Bu, her sayfayı manuel olarak düzenlemeden tüm siteniz genelinde tasarım tutarlılığını sağlar.
Düzenlemeleri Divi Kütüphanesine Kaydedin
Tasarladığınız bir bölümü veya düzeni sevdiyseniz, diğer sayfalar arasında yeniden kullanmak için Divi Kütüphanesine kaydedin. Bu, iş akışınızı önemli ölçüde hızlandırır.
Divi’nin A/B Testini (Bölünmüş Test) Etkinleştirin
Divi, bir modülün, bölümün veya sayfanın farklı sürümlerini birbirine karşı test etmenize ve hangisinin daha iyi performans gösterdiğini görmenize olanak tanıyan yerleşik bir bölünmüş test aracı içerir — dönüşüm oranı optimizasyonu için paha biçilmez.
Sitenizi SSL ile Güvenli Hale Getirin
Henüz yapmadıysanız, WordPress sitenizin HTTPS üzerinde çalıştığından emin olun. SSL sertifikası, kullanıcı güveni, veri güvenliği ve Google sıralaması için gereklidir. AlexHost, tüm WordPress barındırma ortamlarıyla uyumlu ve kurulması kolay SSL Sertifikaları sunmaktadır.
Özel Bir Alan Adı Kullanın
Profesyonel bir alan adı, markanızı güçlendirir ve arama sonuçlarında tıklama oranını artırır. AlexHost’un Alan Adı Kaydı hizmeti aracılığıyla alan adınızı doğrudan kaydedebilir ve yönetebilirsiniz; yüzlerce TLD uzantısı desteği mevcuttur.
Yaygın Sorunları Giderme
| Sorun | Muhtemel Neden | Çözüm |
|---|---|---|
| Divi Builder düğmesi görünmüyor | Tema etkinleştirilmemiş veya eklenti çatışması | Divi’nin etkin tema olduğunu doğrulayın; çatışmaları belirlemek için eklentileri tek tek devre dışı bırakın |
| Sayfa değişiklikleri kaydedilmiyor | Tarayıcı önbelleği veya oturum zaman aşımı | Tarayıcı önbelleğini temizleyin; yeniden oturum açın ve tekrar deneyin |
| Sayfa mobilde farklı görünüyor | Duyarlı ayarlar yapılandırılmamış | Mobil özel değerleri ayarlamak için Divi’nin duyarlı modunu kullanın |
| Yavaş sayfa yükleme hızı | Çok fazla modül veya optimize edilmemiş görüntüler | Divi’nin yerleşik performans ayarlarını etkinleştirin; görüntüleri sıkıştırın |
| Sayfa menüde görünmüyor | Navigasyon menüsüne eklenmemiş | Görünüm > Menüler bölümüne gidin ve sayfayı manuel olarak ekleyin |
| Kalıcı bağlantı 404 hatası döndürüyor | Kalıcı bağlantı yapısı güncellenmemiş | Ayarlar > Kalıcı Bağlantılar bölümüne gidin ve Değişiklikleri Kaydet’e tıklayın |
Sonuç
WordPress’te Divi teması kullanarak sayfalarla çalışmak, kodlama gerektirmeden profesyonel web siteleri oluşturmak için olağanüstü güçlü ve esnek bir araç seti sunar. Bu kılavuzdaki adımları izleyerek şunları yapabilirsiniz:
- Oluşturun net başlıklar ve içerikle iyi yapılandırılmış WordPress sayfaları
- Tasarlayın Divi’nin sürükle ve bırak oluşturucusunu kullanarak görsel olarak etkileyici düzenler
- Düzenleyin sayfalarınızı daha iyi UX ve SEO için mantıksal hiyerarşilere
- Yapılandırın kalıcı bağlantılar, meta veriler ve şablonlar gibi temel ayarları
- Yayınlayın tüm cihaz türlerinde önizlemeden sonra güvenle
WordPress’in içerik yönetimi gücü ve Divi’nin görsel tasarım yeteneklerinin kombinasyonu zor yenilir. Ve altında doğru barındırma altyapısı ile siteniz hızlı, güvenli ve ölçeklenmeye hazır olacaktır.
Kaynak yoğun WordPress projeleri, yüksek trafikli siteler veya adanmış bilgi işlem gücüne ihtiyaç duyulan uygulamalar için, AlexHost’un Dedicated Servers seçeneğini keşfedin — kurumsal düzey donanım, tam sunucu özelleştirmesi ve talep gören iş yükleri için maksimum performans sunuyor.
*Bir sonraki WordPress projenizi oluşturmaya hazır mısınız? Sağlam bir temel ile başlayın — doğru barındırmayı seçin, Divi’yi kurun ve harika görünen ve daha da iyi sıralanan sayfalar oluşturmak için bu kılavuzu izleyin.*
tasarruf edin