HTML ve CSS ile kodlanmış sayfaları WordPress'e dönüştürmek ve page-{slug}.php gibi özel şablonları kullanarak her sayfa için benzersiz bir düzen oluşturmak, biraz daha karmaşık bir süreçtir. İşte adım adım bir rehber:
1. Temel WordPress Tema Dosyalarını Oluşturma
Öncelikle, temel WordPress tema dosyalarını oluşturun:
style.css: Temanın CSS stil bilgilerini içerir.index.php: Ana WordPress döngüsünü (loop) içeren temel şablon dosyası.functions.php: Temanın fonksiyonlarını ve WordPress'e özel özellikleri ekler.
2. Tema Klasörü Oluşturma
WordPress'in /wp-content/themes/ dizininde yeni bir klasör oluşturun ve temanıza bir isim verin.
3. HTML İçeriğin WordPress Şablonlarına Dönüştürülmesi
Varolan HTML sayfalarınızı WordPress şablonlarına dönüştürün. Örneğin, about.html adında bir sayfanız varsa, bu içeriği page-about.php adında bir WordPress şablon dosyasına aktarın.
4. WordPress Döngüsünü Kullanma
Her şablon dosyasında, WordPress döngüsünü (loop) kullanarak içeriği dinamik hale getirin. Örnek:
<?php get_header(); ?>
<!-- HTML içeriği buraya ekleyin -->
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
the_content();
endwhile;
endif;
?>
<?php get_footer(); ?>
5. Özel Sayfa Şablonları
Özel sayfa şablonları (page-{slug}.php), WordPress'in belirli bir sayfa için otomatik olarak kullanacağı şablonlardır. {slug} kısmı, sayfanın URL'sindeki benzersiz adıdır. Örneğin, URL'de yourdomain.com/about varsa, page-about.php kullanılır.
6. CSS ve JavaScript Entegrasyonu
functions.php dosyasını kullanarak, orijinal HTML sitenizdeki CSS ve JavaScript dosyalarını temanıza entegre edin. wp_enqueue_style ve wp_enqueue_script fonksiyonları bu iş için kullanılır.
7. Header ve Footer Dosyaları
header.php ve footer.php dosyalarını oluşturun. Bu dosyalar, sitenizin genel başlık ve altbilgi kısımlarını içerir ve diğer şablon dosyalarında çağrılır.
8. Test ve Ayarlar
Yeni oluşturduğunuz tema ile sitenizi çeşitli cihazlarda ve tarayıcılarda test edin. Her şeyin düzgün çalıştığından emin olun.
9. İleri Düzey Özellikler
Daha fazla özelleştirme için, özel yazı tipleri, özel post tipleri, kısa kodlar ve widget'lar ekleyebilirsiniz.
Bu süreç, WordPress ve PHP ile ilgili temel bir anlayış gerektirir. WordPress'in resmi belgeleri ve çevrimiçi kaynaklar, bu süreçte size yol gösterici olabilir. HTML ve CSS'ten WordPress'e geçiş yaparken, web geliştirme becerilerinizi genişletmek ve derinleştirmek için harika bir fırsattır.
Bu adımlar içerisinde parça parça takıldığınız her kısmı yine soru olarak yazarsanız açıklamak isterim.