Kendi Temasını Yapmak İsteyenler İçin WordPress Kodları

6 Min. Okuma
WordPress kodları

WordPress, dünya genelinde milyonlarca web sitesinin alt yapısını oluşturur. Ancak sadece hazır temaları kullanmak yerine, kendi temanızı oluşturmak istiyorsanız, WordPress kodları konusunda bilgi sahibi olmanız gerekir. Bu yazımızda, bir WordPress temasını sıfırdan oluşturmanız için gerekli tüm temel kodları, dosya yapılarını ve ipuçlarını adım adım anlatacağız.

Neden Kendi Temanı Yapmalısın?

Hazır temalar her ne kadar pratik olsa da, çoğu zaman istediğiniz tasarımı, hızı ve işlevselliği sunmaz. Kendi temanızı oluşturmak, sitenizi tam anlamıyla özelleştirmenize olanak tanır. SEO dostu, hafif ve mobil uyumlu bir site için en iyi yöntem, kendi temanızı geliştirmektir.

Ancak bunun için HTML, CSS, PHP ve özellikle WordPress kodları hakkında temel bir bilgiye sahip olmalısınız. Neyse ki bu rehber, başlangıç seviyesinden ileri düzeye kadar herkes için uygundur.

WordPress Tema Yapısına Giriş

WordPress temaları belirli bir dosya yapısına sahiptir. Bu yapıyı anlamadan WordPress kodları ile çalışmak zordur. En temel tema yapısı aşağıdaki gibi olmalıdır:

markdown
/wp-content/themes/benim-temam/
- style.css
- index.php
- functions.php
- header.php
- footer.php
- sidebar.php
- page.php
- single.php

Bu dosyalar, sitenizin görünümünü ve yapısını tanımlar. Aşağıda her bir dosya için temel kodlara değineceğiz.

1. style.css – Tema Bilgisi ve Stil

css
/*
Theme Name: Benim Temam
Theme URI: https://ornek.com/
Author: Adınız
Description: Kendi yaptığınız tema
Version: 1.0
*/

Bu kod bloğu, WordPress’in temayı tanıması için gereklidir. Ayrıca bu dosyada tüm CSS stil tanımlarınız yer alır.

2. index.php – Temanın Ana Dosyası

php

<?php get_header(); ?>

<main>
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
the_title(‘<h2>’, ‘</h2>’);
the_content();
endwhile;
endif;
?>
</main>

<?php get_footer(); ?>

Bu dosya, sitenizin ana sayfasının nasıl görüntüleneceğini tanımlar. Diğer dosyalar bulunmazsa, WordPress otomatik olarak index.php dosyasını kullanır.

3. header.php ve footer.php

Bu dosyalar sitenizin başlık ve altbilgi kısmını kontrol eder.

header.php:

php
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<title><?php bloginfo('name'); ?></title>
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>

footer.php:

php
<footer>
<p>© <?php echo date('Y'); ?> - Tüm hakları saklıdır.</p>
</footer>
<?php wp_footer(); ?>
</body>
</html>

Bu dosyalar, her sayfada otomatik olarak çağrılır ve site yapısını standart hale getirir.

4. functions.php – Temanın Beyni

Bu dosyada temaya özel fonksiyonlar, menüler, özel alanlar ve destek eklenir.

php
<?php
function benim_temam_setup() {
add_theme_support('title-tag');
add_theme_support('post-thumbnails');
register_nav_menus([
'main-menu' => 'Ana Menü'
]);
}
add_action('after_setup_theme', 'benim_temam_setup');

Bu kod, WordPress kodları içinde en önemlilerindendir çünkü temanın tüm işlevlerini buradan kontrol edebilirsiniz.

5. single.php ve page.php

Bu dosyalar sırasıyla tekil yazı sayfalarını ve sayfa şablonlarını tanımlar.

single.php:

php

<?php get_header(); ?>

<article>
<h1><?php the_title(); ?></h1>
<div><?php the_content(); ?></div>
</article>

<?php get_footer(); ?>

page.php:

php

<?php get_header(); ?>

<div class=”pagecontent“>
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
the_title(‘<h1>’, ‘</h1>’);
the_content();
endwhile;
endif;
?>
</div>

<?php get_footer(); ?>

6. WordPress Kodları ile Menü ve Widget Alanları

Tema içerisine dinamik menü ve widget alanları eklemek için aşağıdaki kodları kullanabilirsiniz.

functions.php:

php
function benim_temam_widgets() {
register_sidebar([
'name' => 'Sidebar Alanı',
'id' => 'sidebar-1',
'before_widget' => '<div class="widget">',
'after_widget' => '</div>',
'before_title' => '<h3>',
'after_title' => '</h3>',
]);
}
add_action('widgets_init', 'benim_temam_widgets');

7. Temaya Script ve Stil Dosyası Ekleme

php
function benim_temam_assets() {
wp_enqueue_style('temam-style', get_stylesheet_uri());
wp_enqueue_script('temam-js', get_template_directory_uri() . '/script.js', [], false, true);
}
add_action('wp_enqueue_scripts', 'benim_temam_assets');

Bu kodlar, CSS ve JS dosyalarınızı WordPress’e uygun şekilde dahil eder.

8. WordPress Kodları ile SEO Uyumlu Tema

SEO uyumu için dikkat edilmesi gereken bazı WordPress kodları vardır. Örneğin:

php
<title><?php wp_title('|', true, 'right'); ?></title>
<meta name="description" content="<?php bloginfo('description'); ?>">

Ayrıca, içeriklerde the_title() ve the_excerpt() gibi fonksiyonları doğru kullanmak, tema SEO’su için önemlidir.

9. Tema Testi ve Hataları Giderme

Temanızı oluşturduktan sonra mutlaka şu testleri yapın:

  • Mobil uyumluluk testi

  • W3C HTML ve CSS doğrulama

  • PageSpeed Insights performans testi

  • Tema birimleri test verisi yükleme

Kodlarda hata veya eksik varsa, WordPress hata loglarında uyarı alırsınız. Bunlara dikkat etmek, kullanıcı deneyimi ve SEO açısından kritiktir.

10. Bonus: Gelişmiş WordPress Kodları

Kendi temanızı geliştirirken aşağıdaki ileri seviye fonksiyonları da kullanabilirsiniz:

  • custom_post_type() ile özel yazı türleri

  • add_theme_support('custom-logo') ile özel logo desteği

  • get_template_part() ile modüler yapı oluşturma

  • WP_Query kullanarak özel sorgular

Bu tür WordPress kodları, temanızı daha güçlü ve esnek hale getirir.

Sonuç: Temanızı Kodlarla Güçlendirin

Kendi temanızı sıfırdan yapmak başlangıçta zor görünse de, doğru adımlarla ilerlerseniz oldukça kolay ve tatmin edici bir süreçtir. Yukarıda verdiğimiz temel WordPress kodları, sizin bu süreci daha profesyonelce yönetmenize yardımcı olacak.

Unutmayın, iyi bir tema sadece görsel olarak değil; kod yapısı, hız ve SEO açısından da güçlü olmalıdır.

Sıkça Sorulan Sorular

WordPress teması yaparken hangi dil bilgisine ihtiyaç var?
HTML, CSS ve PHP bilmek yeterlidir. JavaScript ise gelişmiş işlevler için gereklidir.

Hazır tema mı özel tema mı SEO açısından daha iyi?
Özel olarak kodlanmış hafif temalar, SEO açısından genellikle daha avantajlıdır.

WordPress kodları ile hangi özellikleri ekleyebilirim?
Menü, widget, logo desteği, özel sayfalar, dinamik içerik gibi birçok özellik ekleyebilirsiniz.

Hazırladığınız tema ile fark yaratmak istiyorsanız, bu rehberdeki WordPress kodları ile temel yapı taşlarını oluşturabilir, kendi dijital kimliğinizi yaratabilirsiniz.

Hazır olduğunuzda bu yazıyı blog sitenizde kolaylıkla yayınlayabilir veya özelleştirerek kullanabilirsiniz. İsterseniz yazının görsellerini, kod dosyalarını veya demo yapısını da hazırlayabilirim. Yardımcı olmamı ister misiniz?

Diğer WordPress Eğitimleri: WordPress Yazı Nasıl Eklenir

Bu Makaleyi Paylaş
Yorum yapılmamış