Anasayfa./Bilgi./WordPress/İçerik detayları.

WordPress Tema Geliştirme Kılavuzu: Sıfırdan Başlayarak Özel Şablonlar Oluşturma

3 dakika okuma.
2026-03-19
2026-06-04
2,405
Aşağıdaki bağlantılar üzerinden alışveriş yaptığınızda, sizin için ek bir maliyet olmadan komisyon kazanıyorum.

Geliştirme Ortamı ve Temel Dosya Yapısı

Bir WordPress teması oluşturmaya başlamadan önce, verimli ve yapılandırılmış bir geliştirme ortamı oluşturmak çok önemlidir. Bu, sadece kodun düzenlenmesine yardımcı olmakla kalmaz, aynı zamanda sonraki bakım ve genişletmeler için de temel oluşturur. Standart bir WordPress teması, şu adreste bulunan bir dosyadır:/wp-content/themes/Katalogdaki klasörlerin içindeki dosyalar, belirli isimlendirme ve yapılandırma kurallarına uyar.

Çekirdek Dosyalar ve Klasörler

Her WordPress temasının en az iki dosya içermesi gerekmektedir:index.php和style.cssBunlar arasında,style.cssSadece bir stil şeması değil; aynı zamanda bir temanın “kimlik kartı”dır. Dosyanın baş kısmındaki yorum blokları, WordPress sisteminine tema ile ilgili bilgileri bildirmek için kullanılır. Tipik bir örnek…style.cssDosya başlığı aşağıdaki gibidir:

/*
Theme Name: My Custom Theme
Theme URI: https://example.com/my-theme
Author: Your Name
Author URI: https://example.com
Description: 这是一个从头开始构建的自定义WordPress主题。
Version: 1.0.0
License: GPL v2 or later
Text Domain: my-custom-theme
*/

Bu iki zorunlu dosyanın yanı sıra, işlevsel ve iyi yapılandırılmış bir tema genellikle aşağıdaki klasörleri ve dosyaları içerir:
* functions.phpKonunun işlevsel dosyasıdır; işlevler eklemek, menüler ve kenar çubukları gibi öğeleri kaydetmek için kullanılır.
* header.phpWeb sitesinin başlık (header) şablonu.
* footer.phpWeb sitesinin alt kısmı için kullanılan şablon.
* sidebar.php: Kenar çubuğu şablonu.
* page.php: Sayfa şablonu.
* single.php:Makale Ayrıntıları Sayfası Şablonu.
* archive.php:Makale Arşiv Sayfası Şablonu.
* 404.php404 Hata Sayfası Şablonu.
* search.phpArama Sonuçları Sayfası Şablonu.
* assets/İçerik: Statik kaynakları depolamak için kullanılır ve genellikle aşağıdakileri içerir:css/、js/、images/Alt dizinleri bekleyin.

Tavsiye edilen okuma Sıfırdan başlayarak: Özel WordPress teması oluşturmayı adım adım öğrenin.。

Yerel Geliştirme Ortamı Ayarları

Geliştirme ortamı kurmak için yerel sunucu ortam yazılımlarını (örneğin Local by Flywheel, XAMPP, MAMP) kullanmanız önerilir. Bu yazılımlar sayesinde kendi bilgisayarınıza WordPress, veritabanı (örneğin MySQL) ve PHP’yi kurabilir, çevrimdışı olarak geliştirme ve hata ayıklama işlemleri yapabilirsiniz; bu da çevrimiçi sunucuda doğrudan değişiklik yapmaya kıyasla çok daha verimlidir. Ayrıca, temalarınızın kodlarını yönetmek için sürüm kontrol sistemleri (örneğin Git) kullanmak en iyi uygulamadır.

UltaHost WordPress Sunucusu
30 gün iade garantisi, sınırsız bant genişliği ve veritabanı kullanımı, ücretsiz DDoS koruması; 3 yıllık abonelikte indirim (50%).
UltaHost LOGOSU Sayfaya erişin.

Temel tema şablonunu oluşturma

WordPress tema geliştirmenin temeli, şablon hiyerarşisi sistemidir. Sistem, kullanıcının ziyaret ettiği sayfa türüne göre, sayfayı renderlamak için uygun şablon dosyasını otomatik olarak seçer. Bu şablon dosyalarını anlamak ve doğru bir şekilde oluşturmak, tema geliştirmenin anahtarıdır.

Kafa ve taban şablonları.

Başlık Şablonu (Header Template)header.phpHer sayfanın baş kısmını oluşturmaktan sorumludur; bu genellikle HTML belge bildirimi, başlık etiketleri, meta bilgileri ve diğer temel yapı elemanlarını içerir.<head>Bölge (başlık, karakter seti, görünüm ayarları, eklenen stiller ve betikler içerir), ayrıca web sitesinin logosu ve ana navigasyon menüsü.header.phpGenellikle, sonunda bir çağrı yapılır.<body>Etiketin başlangıç kısmı ve…wp_body_openKanca.

Alt Şablonfooter.phpBu kısım, her sayfanın son bölümünü oluşturmakla sorumludur ve genellikle sayfa altı araç çubuğu, telif hakkı bilgileri, eklenen JavaScript dosyaları ve sayfanın kapatılması işlemlerini içerir.<body>和<html>Etiketler.

Diğer şablon dosyalarında, şu şekilde:get_header()和get_footer()Bu fonksiyonlar, web sitesinin yapısının tutarlı olmasını sağlamak için kullanılır.

Tavsiye edilen okuma WordPress Tema Geliştirme Kılavuzu: Sıfırdan Başlayarak Özel Temalar Oluşturmanın Tam Süreci ve En İyi Uygulamaları。

Ana Döngü ve İçerik Görüntüleme

WordPress’te “ana döngü” (main loop), temanın çekirdeğini oluşturan bir süreçtir ve makaleleri veritabanından alıp ekrana göstermek için kullanılır. Bu döngü genellikle…if ( have_posts() ) : while ( have_posts() ) : the_post();Yapı: Döngünün içinde, makale içeriğini çıkarmak için bir dizi şablon etiketi kullanabilirsiniz. Örneğin:the_title()、the_content()、the_excerpt()、the_permalink()、the_post_thumbnail()vs.

index.phpEn temel yedek şablon olarak, tam bir döngü yapısını içermelidir. Daha spesifik şablonlar ise…single.php(Bir makale için kullanılır) vepage.php(Bir bağımsız sayfa için kullanılır) Bu durumda, döngü içindeki gösterim şeklini ihtiyaca göre özelleştirebilirsiniz. Örneğin,single.phpGenellikle makalenin tam içeriği ve yorum listesi görüntülenir.page.phpBu durumda yalnızca içerik gösterilebilir; yayın tarihi ve yazar bilgileri görüntülenmeyebilir.

// 在 single.php 中一个典型的主循环示例
if ( have_posts() ) :
    while ( have_posts() ) : the_post();
        ?&gt;
        <article id="post-<?php the_ID(); ?>" no numeric noise key 1004>
            <header class="entry-header">
                <h1 class="entry-title"><?php the_title(); ?></h1>
                <div class="entry-meta">
                    | 作者:
                </div>
            </header>
            <div class="entry-content">
                <?php the_content(); ?>
            </div>
        </article>
        &lt;?php
        // 显示评论区
        if ( comments_open() || get_comments_number() ) :
            comments_template();
        endif;
    endwhile;
endif;

functions.php dosyasını kullanarak temanın özelliklerini geliştirebilirsiniz.

functions.phpDosya, temanızın “kontrol merkezi”dir; doğrudan görüntülenen şablona ait olmayan tüm işlevsel kodlar buraya eklenmelidir. Dosyanın işlevi, sürekli olarak aktif olan bir eklentiye benzer.

hosting.com Paylaşımlı Barındırma
AMD EPYC CPU'lar, NVMe SSD depolama ve LiteSpeed ile yüksek performans, 7/24, 7x7 uzman şirket içi destek, SSL, kaba kuvvet, kötü amaçlı yazılım ve DDoS koruması dahil gelişmiş güvenlik önlemleri, 73%'ye kadar tasarruf
hosting.com LOGO Sayfaya erişin.

Kayıtlı konuların menü ile entegrasyonu desteklenmektedir.

geçmek (bir fatura veya teftiş vb.)add_theme_support()Bir fonksiyon olarak, temanız için hangi WordPress çekirdek özelliklerinin desteklendiğini belirtebilirsiniz. Örneğin, makaleler için özel resimlerin etkinleştirilmesi, özelleştirilmiş logolar, makale formatları gibi özellikler modern temaların standart özellikleridir.

function my_theme_setup() {
    // 添加文章特色图像支持
    add_theme_support( 'post-thumbnails' );
    // 添加自定义徽标支持
    add_theme_support( 'custom-logo' );
    // 添加标题标签支持（由WordPress自动管理）
    add_theme_support( 'title-tag' );
    // 添加HTML5标记支持
    add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery', 'caption', 'style', 'script' ) );
}
add_action( 'after_setup_theme', 'my_theme_setup' );

Kayıt işlemleri ve navigasyon menüsü ayarları da buradan yapılır. Kullanımı oldukça basittir.register_nav_menus()Fonksiyon tanımı menüsüne gidin; ardından orada gerekli işlemleri yapabilirsiniz.header.phpÇince'de kullanılır.wp_nav_menu()Onu çağırmak için…

Stil tablolarını ve betikleri ekleyin.

Doğru yaklaşım, stil şablonlarını ve JavaScript dosyalarını birlikte kullanmaktır.wp_enqueue_style()和wp_enqueue_script()Fonksiyonlar kaydedilir ve sıraya alınır. Bu, bağımlılıkların doğru bir şekilde işlenmesini, tekrarlanan yüklemelerin önlenmesini ve eklentilerle uyumluluğu sağlar. Bu işlem şu adımlarda gerçekleştirilmelidir:wp_enqueue_scriptsKancada yapılır.

Tavsiye edilen okuma Sıfırdan Başlayarak: Yüksek Performanslı ve Özelleştirilebilir Bir WordPress Teması Oluşturma Kılavuzu。

function my_theme_scripts() {
    // 引入主题的主样式表
    wp_enqueue_style( 'my-theme-style', get_stylesheet_uri(), array(), '1.0.0' );
    // 引入自定义CSS文件
    wp_enqueue_style( 'my-custom-css', get_template_directory_uri() . '/assets/css/custom.css', array(), '1.0.0' );
    // 引入jQuery（WordPress已内置）和自定义JS
    wp_enqueue_script( 'my-custom-js', get_template_directory_uri() . '/assets/js/main.js', array( 'jquery' ), '1.0.0', true ); // true表示在底部加载
}
add_action( 'wp_enqueue_scripts', 'my_theme_scripts' );

Özel şablonlar ve sayfa şablonları oluşturma

WordPress, belirli sayfalar veya makaleler için özgün tasarımlar oluşturmanıza olanak tanır ve bu özellik esas olarak özel şablonlar (custom templates) ve sayfa şablonları (page templates) aracılığıyla sağlanır.

Özelleştirilmiş makale türleri ve kategorizasyon şablonları

Eğer kod veya eklentiler aracılığıyla özel makale türleri (örneğin “Ürün”) veya özel kategoriler (örneğin “Ürün Kategorileri”) oluşturduysanız, WordPress’in şablon yapısı da aynı şekilde geçerlidir. Örneğin, şu işlemleri yapabilirsiniz:single-product.php“Ürün” türüne ait tek sayfa görünümünü ayrı ayrı kontrol etmek için bir özellik oluşturmak gerekiyor.archive-product.phpÜrün listesi sayfasını kontrol etmek ve yeni ürünler oluşturmak için…taxonomy-product-category.phpBelirli ürün kategorilerinin arşiv sayfalarını kontrol etmek için kullanılır. Bu özellik, portföyler, e-ticaret siteleri gibi karmaşık içerik tabanlı web siteleri oluşturulmasında büyük bir esneklik sağlar.

InterServer Paylaşımlı Barındırma
Paylaşımlı hosting aylık $2.50 USD, ilk ay $0.1 USD promosyon kodu tryinterserver, 461 bulut uygulaması komut dosyası, tek tıklamayla yükleme.
InterServer LOGO. Sayfaya erişin.

Koşullu etiketler ve özelleştirilmiş sayfa şablonları

Koşullu etiketler (örneğin…)is_front_page()、is_page()、is_single()Bu, bir şablon dosyası içinde farklı koşullara göre farklı içeriklerin görüntülenmesini sağlar. Ancak daha güçlü bir yöntem, özel sayfa şablonları oluşturmaktır.

Temalar dizininde bir PHP dosyası oluşturabilir ve dosyanın başına, bunu bir sayfa şablonu olarak tanımlayan belirli bir yorum bloğu ekleyebilirsiniz. Daha sonra, WordPress arayüzünden belirli bir sayfa için bu şablonu seçebilirsiniz.

<?php
/**
 * Template Name: 全宽页面模板
 * Description: 一个没有侧边栏的全宽度页面模板
 */
get_header(); ?>
<div class="full-width-content">
    <?php
    while ( have_posts() ) : the_post();
        the_content();
    endwhile;
    ?>
</div>
<?php get_footer(); ?>

Ayrıca, WordPress 5.0’dan itibaren Gutenberg blok düzenleyicisi çekirdek bileşen haline geldi. Blok şablonları oluşturarak…block-template-canvas.php) veya kullanaraktheme.jsonBu dosya, temaların stilini, renk paletlerini ve bloklarını küresel olarak tanımlamayı sağlar; böylece daha modern ve görsel olarak etkileyici temalar oluşturulabilir.

Özetle.

Sıfırdan bir WordPress teması geliştirmek, sistematik bir iştir ve geliştiricilerin sadece PHP, HTML, CSS ve JavaScript bilgisine sahip olmalarını değil, aynı zamanda WordPress’in temel kavramlarını da derinlemesine anlamalarını gerektirir. Bu kavramlar arasında şablon hiyerarşisi, ana döngü, eklentiler (hooks) ve işlemler (actions), şablon etiketleri gibi konular yer alır. Standart bir klasör yapısı oluşturarak başlayarak, yavaş yavaş başlık, alt kısım ve temel şablon dosyalarını oluşturun ve bunları kullanarak temanızı geliştirin.functions.phpİşlevleri geliştirmek ve kaynakları doğru bir şekilde yüklemek için öncelikle gerekli adımları atın; ardından karmaşık sayfa düzenlemelerini özel şablonlar ve koşullu mantık kullanarak gerçekleştirin. Bu süreci takip ederek, tasarım gereksinimlerine tam olarak uygun, yüksek performanslı ve kolayca bakımı yapılabilecek özel temalar oluşturabilirsiniz. Böylece WordPress dünyasında en yüksek özgürlüğü ve kontrolü elde edersiniz.

Sıkça Sorulan Sorular.

Konu geliştirmek mutlaka sıfırdan mı başlamalıdır?

Mutlaka değil. Başlangıç seviyesindeki kullanıcılar veya hızlı bir şekilde öğrenmek isteyen geliştiriciler için, mevcut bir temel tema (Underscores, _s) veya bir üst tema (örneğin Genesis, Astra) ile başlamak mükemmel bir seçenektir. Bu temalar zaten standart dosya yapılarını ve temel kodları içerir; bu sayede üzerinde değişiklikler yapabilir ve özelleştirmeler yapabilirsiniz, ki bu da sıfırdan başlamaktan çok daha verimlidir.

style.css dosyası tamamen boş olabilir mi?

Hayır, bu mümkün değil. Stil bilgileri boş bırakılabilir; ancak dosyanın en üst kısmındaki tema bilgileri ile ilgili yorum bloğu mutlaka bulunmalı ve doğru biçimde düzenlenmelidir. Aksi takdirde WordPress temanızı tanıyamaz. Bu yorum bloğu, temanın WordPress arayüzündeki listelerde gösterilen adı, yazarı, açıklaması gibi bilgilerin kaynağıdır.

Nasıl temamı çok dilli (uluslararasılaştırılmış) hale getirebilirim?

WordPress'in uluslararası işlevlerini (örneğin) kullanmanız gerekir.__()、_e()Tüm çevrilmeye ihtiyaç duyan metin dizelerini `(` ve `)` işaretleriyle sarın. Daha sonra…style.css和functions.phpDoğru şekilde ayarlanmış.Text DomainVe Poedit gibi araçlar kullanarak oluşturun..potŞablon dosyaları ve bunlara karşılık gelen….po和.moÇeviri dosyası, profesyonel bir konu için olmazsa olmaz bir özelliktir.

Neden özel şablonum arka plan sayfa özelliklerinde gösterilmiyor?

Lütfen öncelikle özel sayfa şablonunuzun dosyasının temanın kök dizininde olup olmadığını kontrol edin. Ayrıca, dosyanın en üstündeki yorum bloğunun formatının tamamen doğru olduğundan emin olun; özellikle “Template Name:” satırı çok önemlidir. Dosya adında veya yolunda hata bulunursa, veya yorumların formatı yanlışsa, WordPress bu şablonu tanıyamaz.

Geliştirilmiş olan temayı nasıl yayınlayabilir veya başkalarının kullanımına sunabilirsiniz?

En standart yöntem, temanızın klasörünü bir ZIP dosyası olarak sıkıştırmaktır. Kullanıcılar, WordPress arayüzündeki “Görünüm” -> “Temalar” -> “Yeni Tema Ekle” -> “Tema Yükle” seçenekleri aracılığıyla bu ZIP dosyasını doğrudan yükleyip kurabilirler. Eğer temanızı WordPress’in resmi temalar dizinine yayınlamak istiyorsanız, güvenlik, kod kalitesi, uluslararası destek gibi konularda daha katı kod standartlarına ve inceleme süreçlerine uymanız gerekmektedir.

Bir sonraki adım, bundan sonra ne yapmalıyım?

Eğer bir WordPress web sitesi oluşturuyorsanız veya optimize ediyorsanız, performans optimizasyonu, eklenti yapılandırması ve tema özelleştirmesi ile ilgili konuları okumaya devam etmeniz önerilir.

Daha fazla okuma ve pratik bilgiler.

Aşağıdaki içerikler bu makalenin konusuyla ilgilidir ve daha fazla okumak için uygundur. Öncelikle mevcut sorununuza en yakın makaleden başlayın, sonra çevresel konulara doğru ilerleyin, genellikle daha iyi sonuçlar alırsınız.

Etiketler: