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

WordPress Tema Geliştirme Başlangıç Kılavuzu: Sıfırdan İlk Özel Temanızı Oluşturun

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

WordPress Tema Geliştirme Temel Kavramları

Kod yazmaya başlamadan önce, WordPress temalarının temel yapısını anlamak çok önemlidir. Bir tema esasen, belirli kurallara uygun bir dizi dosyayı içeren bir klasördür ve bu dosyalar birlikte web sitesinin görünümünü ve bazı işlevlerini belirler. Temel düşünce “şablon hiyerarşisi”dir; yani WordPress, ziyaret edilen sayfa türüne (örneğin ana sayfa, makale sayfası, özel sayfa) göre otomatik olarak ilgili şablon dosyasını seçer ve yükler.

Her konu iki temel dosya içermelidir:style.css 和 index.php。style.css Sadece stil sağlamakla kalmaz; aynı zamanda dosyanın baş kısmındaki yorumlar, temanın adı, yazarı, açıklaması gibi temayla ilgili meta bilgileri de içerir. Bu, WordPress’in bir temayı tanımasının tek yoludur.index.php Bu, varsayılan şablon dosyasıdır; daha spesifik şablonlar mevcut değilse, WordPress bunu kullanmak üzere geri döner.

Temalar, WordPress çekirdeğiyle şablon etiketleri (Template Tags) aracılığıyla etkileşim kurar. Bunlar, veritabanından içerikleri dinamik olarak almak ve görüntülemek için kullanılan PHP fonksiyonlarıdır. the_title() Makale Başlığı:the_content() Bu fonksiyonları anlamak ve doğru bir şekilde kullanmak, dinamik içerik gösteriminin anahtarıdır.

Tavsiye edilen okuma WordPress Tema Geliştirme Kılavuzu: Başlangıçtan Uzmanlığa。

Geliştirme ortamı kurma ve tema yapısını oluşturma

Verimli ve izole bir geliştirme ortamı, tema geliştirmenin ilk adımıdır. XAMPP, MAMP veya Laragon gibi yerel sunucu yazılımlarının kullanılması önerilir; bu yazılımlar, bilgisayarda hızlı bir şekilde PHP ve MySQL ortamı kurmanıza olanak tanır. WordPress’in temel dosyalarını yerel sunucunun kök dizinine yükleyin (örneğin: htdocs 或 www…) içinde.

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.

Daha sonra, WordPress kurulum dizininin… wp-content/themes/ Belirtilen yol altında, yeni temanız için bir klasör oluşturun; örneğin adını “new_theme” olarak belirleyin. my-first-themeBu klasör içinde, gerekli olan ilk dosyayı oluşturun:style.cssBaşlık yorumları aşağıdaki formata sıkı sıkıya uygun olmalıdır:

/*
Theme Name: 我的第一个主题
Theme URI: https://example.com/my-first-theme
Author: 你的名字
Author URI: https://example.com
Description: 这是一个用于学习的自定义 WordPress 主题。
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: my-first-theme
*/

Dosyayı kaydettikten sonra, WordPress arayüzünün “Görünüm” -> “Temalar” sayfasına gidin. Temanızın orada listelendiğini ve etkinleştirilebileceğini görmelisiniz.

Şimdi, ikinci zorunlu dosyayı oluşturun:index.phpBu, temanın ana şablon dosyasıdır. Başlangıçta, sadece temel HTML5 yapısını ve test amacıyla kullanılabilecek basit bir döngüyü içerebilirsiniz.

<!DOCTYPE html>
<html no numeric noise key 1008>
<head>
    <meta charset="<?php bloginfo( 'charset' ); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?php wp_head(); ?>
</head>
<body no numeric noise key 1005>
    <header>
        <h1>Benim özelleştirilmiş temam</h1>
    </header>
    <main>
        <?php
        if ( have_posts() ) :
            while ( have_posts() ) :
                the_post();
                ?>
                <article>
                    <h2><?php the_title(); ?></h2>
                    <div><?php the_content(); ?></div>
                </article>
                <?php
            endwhile;
        endif;
        ?>
    </main>
    <footer>
        <p>Web Sitesi Alt Kısmı Bilgileri</p>
    </footer>
    <?php wp_footer(); ?>
</body>
</html>

核心模板文件与函数详解

Konunun karmaşıklığı arttıkça, farklı işlevleri yerine getiren kodları özel şablon dosyalarına ayırmanız gerekecektir. WordPress’in şablon hiyerarşisi sistemi, mevcut sayfaya en uygun şablonu otomatik olarak bulup yükler.

Tavsiye edilen okuma Size, güçlü özelliklere sahip özelleştirilmiş bir WordPress teması oluşturmayı adım adım öğreteceğim.。

Oluştur header.php Dosya, olacak. index.php 中 <head> Bölüm ve <header> Bazı kod parçalarını buraya kopyalayın. Sonra… index.php Üst kısımda kullanılır. get_header() Bu fonksiyonu kullanarak onu içe aktarabilirsiniz. Aynı şekilde, oluşturabilirsiniz. footer.php Alt bilgileri saklayın ve bunları kullanın. get_footer() Getirin. Oluşturun. sidebar.phpVe kullanın. get_sidebar() Kodun modülerleştirilmesini ve yeniden kullanılmasını sağlar.

Farklı sayfa türleri için özel şablonlar oluşturulabilir:
* single.phpTek bir makaleyi göstermek için kullanılır.
* page.phpTek bir sayfayı göstermek için kullanılır.
* front-page.phpEğer mevcutsa, statik ana sayfa olarak kullanılacaktır.
* home.phpBlog makalelerinin indeksini göstermek için kullanılır (ana sayfa “En Yeni Makaleler” olarak ayarlandığında).
* archive.phpKategorileri, etiketleri, yazarları ve diğer arşiv sayfalarını göstermek için kullanılır.
* 404.php404 hata sayfasını göstermek için kullanılır.

Şablon dosyalarında, en temel yapı “döngü”dür (The Loop). Bu, WordPress’in veritabanından makaleleri alıp görüntülemek için kullandığı PHP kod bloğudur. Temel yapısı şu şekildedir:

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. 
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    <!-- 在这里输出文章内容，使用 the_title(), the_content() 等函数 -->
<?php endwhile; else : ?>
    <p>Üzgünüz, hiçbir içerik bulunamadı.</p>
<?php endif; ?>

fonksiyon bloginfo() 或 get_bloginfo() Web sitesinin temel bilgilerini elde etmek için kullanılır, örneğin: bloginfo( 'name' ) Web sitesi başlığı:bloginfo( 'stylesheet_url' ) 输出主题样式表 URL。

Stil, betik ve tema özelliklerinin genişletilmesi

Temaların stilinin doğru bir şekilde yüklenmesi ve çakışmaların önlenmesi için, stil dosyalarını ve betik dosyalarını doğrudan HTML içinde yazmak yerine, WordPress tarafından sağlanan fonksiyonlar kullanılarak bir kuyruğa eklemek gerekmektedir. <link> 或 <script> Etiketler. Bunlar, belirli bir konu (tema) üzerinden oluşturulmuştur. functions.php Dosya tarafından gerçekleştirilmiştir.

Oluştur functions.php Bu dosya, temanın özel özelliklerini eklemek, varsayılan davranışları değiştirmek veya betik stillerini kaydetmek için kullanılır. wp_enqueue_style() 和 wp_enqueue_script() Function:

Tavsiye edilen okuma WordPress Tema Geliştirme Rehberi: Sıfırdan Yüksek Performanslı Özel Temalar Oluşturma。

<?php
function my_first_theme_scripts() {
    // 注册并排入主样式表
    wp_enqueue_style( 'main-style', get_stylesheet_uri() );

// 注册并排入一个自定义 CSS 文件
    wp_enqueue_style( 'custom-style', get_template_directory_uri() . '/css/custom.css', array(), '1.0' );

// 注册并排入一个 JavaScript 文件，依赖于 jQuery
    wp_enqueue_script( 'my-script', get_template_directory_uri() . '/js/script.js', array( 'jquery' ), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_first_theme_scripts' );
?>

在 functions.php Ayrıca, şunları da kullanabilirsiniz: add_theme_support() Bu fonksiyonlar, makale özel görselleri, özelleştirilmiş logolar, makale formatları gibi temanın desteklediği özellikleri belirtmek için kullanılır.

// 支持文章特色图像
add_theme_support( 'post-thumbnails' );

// 支持自定义 Logo
add_theme_support( 'custom-logo', array(
    'height'      => 100,
    'width'       => 400,
    'flex-height' => true,
    'flex-width'  => true,
) );

// 在文章编辑器中添加编辑器样式
add_editor_style( 'editor-style.css' );

Bir konunun nihai stilinin genellikle nerede yazıldığı… style.css Veya fonksiyonlar aracılığıyla yüklenen diğer CSS dosyalarında. WordPress, `body` ve makaleler için birçok kullanışlı CSS sınıfı otomatik olarak ekler. home, single, page-id-{ID} Bu sınıf adlarını kullanarak hedefe yönelik stiller oluşturabilirsiniz.

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.

Özetle.

Bu makalenin adımlarını takip ederek, sıfırdan başlayarak temel bir WordPress özel teması oluşturmanın temel sürecini öğrendiniz. Temanın temel kavramlarını ve şablon yapılarını anlamaktan, gerekli ortamı kurmaya ve dosyaları oluşturmaya, ardından temel şablonları incelemeye, döngüler ve şablon etiketlerini anlamaya kadar; ve son olarak, nasıl... (The text seems incomplete here.) functions.php Stil ayarlarını, betikleri ve tema özelliklerini doğru bir şekilde eklemek önemlidir. Bu süreç temel olsa da, bir temanın geliştirilmesinin temel yapılarını kapsar. Daha sonra, alt temaların geliştirilmesi, özel makale türlerinin oluşturulması, gelişmiş tema seçenekleri, WooCommerce entegrasyonu gibi daha ileri düzey konuları keşfedebilir ve tema geliştirme becerilerinizi sürekli geliştirebilirsiniz.

Sıkça Sorulan Sorular.

Geliştirme konularında çalışmak için PHP bilmek zorunda mıyım?

Evet, PHP, WordPress’in temel programlama dilidir. Tema dosyaları esasen PHP dosyalarıdır ve bu dosyalarda HTML ile WordPress’in PHP fonksiyonları (şablon etiketleri) bir araya getirilerek sayfalar dinamik olarak oluşturulur. Sayfa oluşturucular kullanılsa bile, gelişmiş özellikleri özelleştirmek ve sorunları çözmek için PHP’yi anlamak gereklidir.

Konunun style.css dosyasının adı değiştirilebilir mi?

Olmaz.style.css Bu, WordPress’in bir tema tanıması için gerekli olan ve adı sabit olan bir dosyadır. Temanın tüm meta bilgileri (örneğin adı, yazarı) bu dosyanın başındaki yorumlar (comments) bölümünde tanımlanmıştır. Ancak bunları değiştirebilirsiniz. functions.php Belirtilen fonksiyon, diğer adlara sahip CSS dosyalarını kaydeder ve yükler; böylece stil bilgileri tamamlanır.

Bir temanın Çince’yi veya çevirileri desteklemesini nasıl sağlayabilirim?

Öncelikle, style.css Başlık yorumlarında doğru ayarlamalar yapılmalıdır. Text Domain(Örneğin) my-first-theme) ve tüm çevrilmesi gereken metinlerde bunu kullanın. __() 或 _e() Fonksiyonlar paketlenir. Daha sonra, Poedit gibi bir araç kullanılarak temalar taranır ve gerekli değişiklikler yapılır. .pot Şablon dosyasını oluşturun ve ilgili dil için gerekli içerikleri de ekleyin (örneğin: zh_CN.poÇeviri dosyasını hazırladıktan sonra, son adımda bunu derleyin. .mo Dosya, konunun (temanın) içine konulmuştur. languages Klasörün içinde.

Özel bir temaya menü özelliği nasıl eklenir?

Öncelikle, konunun… functions.php Dosyada kullanılan register_nav_menus() Fonksiyonların kaydedileceği bölümün konumu. Daha sonra, şablon dosyasında (örneğin…) header.phpMenüyü göstermek istediğiniz yere şunu kullanın: wp_nav_menu() Fonksiyon, zaten kayıtlı olan menüyü çağırır. Kullanıcılar, WordPress arayüzündeki “Görünüm” -> “Menüler” bölümünden bu menü pozisyonlarının içeriğini yapılandırabilirler.

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: