WordPress, web siteleri oluşturmak için esnek ve kullanıcı dostu bir platform sunar. Özelleştirilmiş bir tema oluşturmak, sitenizin görünümünü tamamen kontrol etmenizi sağlar. İşte adım adım WordPress teması oluşturma rehberi:
1. Gereksinimler
- Yerel Sunucu Ortamı: XAMPP, MAMP veya Local by Flywheel gibi bir yerel sunucu kurulumu.
- Kod Editörü: Visual Studio Code, Sublime Text veya PHPStorm gibi bir editör.
- Temel Bilgiler: HTML, CSS, PHP ve JavaScript temelleri.
- WordPress Kurulumu: Yerel sunucuda WordPress’in kurulu olması.
2. Geliştirme Ortamının Hazırlanması
- Debug Modu Aktif Edin:
wp-config.phpdosyasındadefine('WP_DEBUG', true);ekleyerek hata ayıklamayı açın. - Tema Klasörü Oluşturun:
wp-content/themes/altında yeni bir klasör açın (örneğin,benim-temam).
3. Temel Dosyaların Oluşturulması
En az iki dosya gereklidir:
- style.css: Tema bilgileri ve stiller.
- index.php: Ana şablon dosyası.
style.css
/*
Theme Name: Benim Temam
Theme URI: https://orneksite.com/benim-temam
Author: Adınız
Author URI: https://siteniz.com
Description: Özel WordPress Temam.
Version: 1.0
Text Domain: benim-temam
*/4. functions.php Dosyası
Tema fonksiyonlarını ve özelliklerini eklemek için oluşturun:
<?php
// Temel özellikleri aktif eder
function benimtemam_setup() {
// Başlık etiketi desteği
add_theme_support('title-tag');
// Öne çıkan görseller
add_theme_support('post-thumbnails');
// Menü konumları
register_nav_menus(array(
'ana-menu' => __('Ana Menü', 'benim-temam')
));
}
add_action('after_setup_theme', 'benimtemam_setup');
// Stil ve scriptleri yükle
function benimtemam_scripts() {
wp_enqueue_style('benimtemam-style', get_stylesheet_uri());
wp_enqueue_script('benimtemam-script', get_template_directory_uri() . '/js/script.js', array(), '1.0', true);
}
add_action('wp_enqueue_scripts', 'benimtemam_scripts');5. Şablon Dosyaları
WordPress, template hierarchy (şablon hiyerarşisi) ile hangi dosyanın kullanılacağını belirler. Temel dosyalar:
header.php
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo('charset'); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<header>
<?php wp_nav_menu(array('theme_location' => 'ana-menu')); ?>
</header>footer.php
<footer>
<p>© <?php echo date('Y'); ?> <?php bloginfo('name'); ?></p>
</footer>
<?php wp_footer(); ?>
</body>
</html>index.php
<?php get_header(); ?>
<main>
<?php if (have_posts()) :
while (have_posts()) : the_post(); ?>
<article>
<h2><?php the_title(); ?></h2>
<?php the_content(); ?>
</article>
<?php endwhile;
endif; ?>
</main>
<?php get_footer(); ?>6. WordPress Döngüsü (Loop)
Döngü, içerikleri listelemek için kullanılır:
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<!-- İçerik Buraya -->
<?php endwhile; ?>
<?php else : ?>
<p>İçerik bulunamadı.</p>
<?php endif; ?>7. Dinamik İçerik ve Template Tag’ler
the_title(): Başlığı gösterir.the_content(): İçeriği gösterir.the_permalink(): Yazı linkini alır.get_template_part(): Parça dosyaları dahil eder (örneğin,get_template_part('content', 'page');).
8. Menü ve Widget Alanları
- Menü:
functions.php‘de kaydettikten sonraheader.phpiçindewp_nav_menu()ile çağırın. - Widget Alanı:
// functions.php
function benimtemam_widgets_init() {
register_sidebar(array(
'name' => 'Sidebar',
'id' => 'sidebar-1',
'before_widget' => '<div class="widget">',
'after_widget' => '</div>',
));
}
add_action('widgets_init', 'benimtemam_widgets_init');
// sidebar.php
<?php if (is_active_sidebar('sidebar-1')) : ?>
<?php dynamic_sidebar('sidebar-1'); ?>
<?php endif; ?>9. Tema Testi ve Hata Ayıklama
- Farklı tarayıcı ve cihazlarda test edin.
- WordPress Debug Log’unu kontrol edin.
- Theme Check eklentisi ile standartlara uygunluğu doğrulayın.
10. Child Theme Oluşturma
Tema güncellemelerinde özelleştirmelerinizi korumak için:
- style.css:
/*
Template: benim-temam
*/
@import url("../benim-temam/style.css");- functions.php: Parent tema fonksiyonlarını
get_template_directory()yerineget_parent_theme_file_path()ile çağırın.
Sonuç
Bu adımları takip ederek basit bir WordPress teması oluşturabilirsiniz. Geliştirme sırasında WordPress Codex ve topluluk kaynaklarından faydalanmayı unutmayın. Her adımda test yaparak sorunları anında çözebilir ve temanızı profesyonel seviyeye taşıyabilirsiniz! 🚀
