WORDPRESS TEMASI YAPIMI İÇİN BİLİNMESİ GEREKENLER

Merhabalar, bu makalede WordPress teması yapımı için bilmeniz gerekenleri ve kısaca bunların nasıl kullanılacaklarını açıklamaya çalışacağım. Sıfırdan başlayanlar için bilinmesi gerekenler çok fazla görünebilir ama biraz araştırma ve dene yanıl yöntemiyle kendinizi geliştirebilir ve o hayal ettiğiniz temalara sahip olabilirsiniz. Ayrıca yeni bir tema oluşturmanın tüm yükünü kendi üzerinizde tutmak zorunda değilsiniz. Bu işi tasarımcı, arayüz kodlayıcı ve ve programcı olarak 3 kişi ortak çalışarak da yapabilir. İş bölümü yapmak çoğu projede olduğu gibi bu projede de size büyük bir avantaj sağlayacaktır.

Makaleyi bilinmesi gereken Programlama Dilleri ve Programlar olarak ikiye ayrıdım. Böyle daha anlaşılır olur umarım.

Programlama ve Mark-Up Dilleri

HTML / XHTML / DHTML

HTML, tüm web sayfalarının temelinde olan bir Mark-Up dildir. HTML normal bir web sayfası yapmak için en gerekli olan ve kısmen yeterli olan bir dildir. Ancak HTML ile yapılacak sayfalar oldukça basit ve sade görünen sayfalar olacaktır. Ayrıca XHTML standartlarına da uygun olmayacaktır. HTML öğrenmesi oldukça zevkli bir dildir, tema ve hatta temadan ziyade web site yapmak isteyenlerin ilk olarak öğrenmesi gereken dildir.

XHTML, HTML kodlarının bir standarda bağlanmış şeklidir. Temel olarak yine aynı HTML’dir. Günümüzde artık HTML kavramının yerini XHTML almaktadır. HTML öğrendikten sonra, XHTML öğrenmek çok daha kolay olacaktır. Çünkü kodlar arasında fazla bir fark yoktur. XHTML’yi temamızın ana şablonunu oluştururken CSS ile bir bütün olarak kullanmalıyız. Bununla birlikte XHTML kullanıyoruz çünkü SEO’ya önem veriyoruz. Arama motorlarında üst sıralarda çıkmak bazılarımızın asıl amacıdır, bu yolda HTML yerine XHTML kullanmak mantıklı olacak harekettir çünkü günümüzde arama motorları sitelerin web standartlarına uygun olup olmadığına da bakmaktadırlar. XHTML kurallarını w3 school’dan ulaşabilirsiniz. Ayrıca bazı arkadaşlara yararlı olacağını düşündüğüm, “XHTML kuralları” adlı bir makaleyide en kısa sürede yazmak istiyorum.

DHTML ise HTML kodlarının Javascript dili ile güçlendirilmiş ve bir nevi hareket kazandırılmış halidir. Buna en güzel örnek tasarımlardaki kayan haberler/resimler bloklarıdır diyebiliriz.

CSS

CSS, oluşturmuş olduğumuz web sayfamıza şekil verebileceğimiz, güçlü bir stil şablonlama aracıdır. WordPress temalarının olmazsa olmazlarındandır. Bununla birlikte CSS günümüzün en gözde ve vazgeçilmez kavramlarından biridir. Bu nedenle öğrenmek bir avantaj veya ihtiyaçtan ziyade bir zorunluluk olmuştur bu zamanda.

Tema yapımında diğer PHP dosyalarından ayrı olarak bir de CSS dosyası (style.css) oluşturulur. Bu dosyada öncelikle temanın temel bilgisi bulunur. Ardından dilerseniz yine bu dosyayı kullanarak, dilerseniz de kendi stil dosyalarınızla temanıza şekil verebilirsiniz.

PHP

PHP, günümüzde Web programcılığı alanında kullanılan en önemli dillerden biridir. WordPress’in temelini de oluşturan bu dil, doğal olarak temaların da kodlanmasında kullanılır. CSS ve HTML ile kodlamış olduğunuz tasarımın işlev kazanması ve WordPress ile bütünleşmesi için az veya çok PHP bilmek zorundasınız.

WordPress’de tema yapabilmek için üst düzey bir PHP bilgisine sahip olmanız gerekmez, belli başlı fonksiyonlar var. Bunlardan birkaçını örnek olması amacıyla açıklayacağım.

Yazdığımız yazıya ait etiketleri gösteren fonksiyon : <?php the_tags(__(‘Etiketler : ‘), ‘, ‘, ‘, ‘); ?>
Yazıyı yazan kullanıcının ismini getiren fonksiyon : <?php the_author() ?>
Eski yazıları listeleyen fonksiyon : <?php previous_posts_link(‘Eski Yazılar &raquo;’) ?>

Bunlar gibi birçok hazır WordPress fonksiyonu bulunmaktadır. Hepsini burada açıklayamayacağım için, internette “wordpress fonksiyonları” diye arayarak istediğiniz fonksiyonları bulabilirsiniz. Bunun dışında kendiniz de ihtiyacınıza göre PHP’den faydalanabilir, ihtiyacınız olan fonksiyonları yazabilir ve temanızı güçlendirebilirsiniz.

Programlar

PHOTOSHOP

Yaptığımız WordPress temasının görsel anlamda güzel ve özgün olması, birçok WordPress kullanıcısının ilk aradığı özelliktir. Temamızın arayüzü de ilk göze çarpan ve sitenin tüm havasını veren öğesidir. Arayüzümüzü tasarlamada bize yardımcı olacak programların başında da Photoshop gelir.

FIREWORKS

Photoshop yerine kullanılacak güzel bir alternatif olarak karşımıza çıkar. Eğer herhangi bir grafik tasarım programı kullanmayı bilmiyorsanız tavsiyem Fireworks’tür. Kullanımı Photoshop’a göre oldukça kolaydır.

DREAMWEAVER

Kod yazarken kullanacağınız programın kalitesi hem işinizi kolaylaştırır hem de size zaman kazandırır. Zamandan tasarruf etmek amacıyla kodları düzenleyen, renklendiren, kodun 1-2 harfini yazdığınızda tamamını getiren programlar kullanmak, birçok yazılımcının kullandığı bir yöntemdir. Bu konuda en çok kullanılan program da Dreamweaver‘dır. Burada dikkat etmeniz gereken birkaç önemli detay var. Bazı programlar gereğinden fazla kod ekleyebiliyor. Gereksiz kod hiçbir zaman size bir fayda sağlamaz. Bazı programlar ise XHTML’ye aykırı kodlar kullanabiliyorlar. Bunlara dikkat ediniz.

NOTEPAD++

Dreamweaver kullanmak istemeyenler için güzel bir alternatiftir. Yakuter’in de Notepad++ desteklediğini vurgulayarak, notepad kullanımı ile ilgili birkaç site içi bağlantı verelim.

Notepad Kullanarak Hata mı YapıyorumYakuter Kod Yazarken

Son Sözler

Bu yazımda kısaca WordPress teması yapımı için gerekli olan konulardan bahsettim. Unuttuklarım varsa yorumlarınızda belirtirseniz sevinirim. Ayrıca lütfen hatalarımı bildirmekten de çekinmeyiniz.

Son olarak Yakuter’e böylesine güzel bir platformda yazı yazma imkanı verdiği için çok teşekkür ederim. Sağlıcakla kalmanız dileğiyle…

DEVAMINI OKUYUN
  • ismail

    yazılarını takip ediyorum hocam , en başta senin teman çok hoş :)

  • Eray Alakese

    Bazen bir eklenti için, bazen de başka sebeplerle wordpress doosyalarında güncelleme yapmam gerekebiliyor. Notepad ile güncelliyordum. Çok sonra farkettim ki Notepad ile güncellediğim zaman dosyaya BOM kodu ekliyor ve bu bazı tarayıcılarda soorun çıkartıyor. Mesela IE ve Chrome'de RSS yayınım düzgün gözükmüyordu. Tek tek BOM karakteri içeren tüm dosyaları temizlemek zorunda kaldım. Ama Notepad yerine Notepad++ kullandığınızda böyle bir sorunla karşılaşmıyorsunuz.

    • Bu çok doğru. Notpad++ bu konuda gayet iyi. Ayrıca karakteri bozulmuş dosyaları biçim menüsünden utf8 without bom diyerek düzeltmek de çok kolay.

  • Öncelikle bu güzel ve temel bilgiler için teşekkür ederim Cem. Başlangıç seviyesindeki arkadaşlar için oldukça anlaşılır bir yazı olmuş. Yazının sonunda internette bulunan ve WordPress tema yapımını anlatan Türkçe makalelerin bağlantılarını da verseymişsin süper olurmuş ;)

  • umut

    wordpress bir çok işsize iş kapısı açmıştır :) koddan çok az anlayan bir kişi bile okuyacağı birkaç e-kitap ile başlangıç seviyesinde temalar hazırlayabilir.

    • Aynen öyle, birkaç güzel kaynakla yapılmayacak şey yok.

  • Temasına hastayım, turuncu-sarı karışımı başlıklar çok hoşuma gidiyor. :)

  • Mert Canatan

    ne zamandır böyle adam gibi bir yazı bekliyordum, saol :)

  • latif

    uzun zamandır öyle bir yazıyı bekliyordum.Bu yazı iyi değerlendirip kendime özgün bir tema yapmak istiyorum.Paylaşım için teşekkür ederim.

  • Arslan

    Emeğine sağlık çok güzel bir yazı olmuş. WordPress Tema konusu açılmışken bir yazıyla da ben eşlik etmeyi planlıyorum. Bakalım Erhan abi buna ne diyecek :)

    • Merak ettim ama bak şimdi :)

  • selami şahin

    güzel de bir örnek verseydin yada örnek yapan bi adres.

  • Yazar

    Keşke bu kadar kolay olsa. Tasarım bile insanın aklına gelmiyor :D

  • Cengiz Akyazı

    Güzel bir makale olmuş. Elinize sağlık.

  • Kemal Gürler

    Çok güzel yazı olmuş elinize sağlık. CSS bilgisine sahip kişilerin PHP'e -en azından başlangıç seviyesinde bir tema için- ihtiyacı yok aslında. Starkers WordPress temasına yerleştirebilirler tasarımlarını direk :)

  • Tema yapmak için başlangıç seviyesinde ya da iyi derecede Php bilmek gerek, PHP'yi ne kadar iyi bilirseniz o kadar esnek temalar (fonksiyonel) yapabilirsiniz.

  • cgrmedia.tk

    Oldukça faydalı bir paylaşım olmuş. Teşekkürler.

  • Halil ibrahim

    çok teşekkürler kardeşim . okurken birşeylerin değiştigini hissettiriyor.

  • orçun

    wordpress teması için gerekli olmasada sitenizin hoş görünmesi için ufak flash animasyonlar yapmakta fayda var. flashların siteye kazandırdıkları dinamizm son kullanıcıda ciddi karşılık buluyor.

    • cdmr1991

      Kesinlikle katılıyorum, görsellik bazıları için çok önemli.

  • teşekkürler

  • Tolga LEVENT

    Makaleniz için teşekkürler, sayenizde bilmediğim birçok şeyi öğreniyorum.

  • Emre Çolak

    Kesinlike NOTEPAD++ kullanış, basit, sade :) Makale içinde teşekkürler..

  • eynal kaplıcaları

    bana wordpress teması yapmak için bir program tavsiye edebilirmisiniz cem bey

    • cdmr1991

      WordPressde tema yapmak için geliştirilmiş bir program yok sanırım, fakat tasarım konusunda Dreamweaver işe yarayabiliyor.
      Kendi temanızı kendiniz yapmak istiyorsanız, bence ufaktan CSS öğrenmelisiniz. CSS öğrenince yavaş yavaş tema editlemeye başlarsınız. Sonrası da gelir diye düşünüyorum.

    • Desmal Yeşilmen

      Artisteer programı var, fakat yaptıktan sonra baya bi editlemeniz gerekiyor. Ama temanın çatısını kurup geliştirmek için gayet güzel bir program diye düşünüyorum..

  • halil ibrahim

    aslında tema yapmak gibi bir amacım yok vede pekte anlamıyorum açıkçası ama yazınızın içerigi basit anlaşılır üslubla ele alınmış bu çok hoşuma gitti. ve bu işlerin nasıl yürüdügünüde temelden bilmek adına benim için bir kaç defa okunması lagzım gereken bir yazı olmuş. kardeşim eline saglık…

    • cdmr1991

      Teşekkürler, amacımızı tam olarak açıklamışsın. : )

  • Yakut hocam güzel anlatım olmuş, ellerine sağlık.

  • süper anlatmışsın hocam birtaz daha araştırma yaparsam inanın tema yapmaya başlayacağım

  • cevher

    Çok önemli bilgiler çok çok tşk.ler

  • notepad olsun yeterli erhan :)

  • Seo

    Başlangıç seviyesi için gayet iyi bir makale olmuş , elinize sağlık.

  • wordpress fonksiyonlarının tümünü verebilirdin aslında.hepsinin aynı başlıkta toplanması yeni başlayanlar açısından yararlı olurdu.

  • Bende yakında bir tema yapmayı düşünüyordum. Yazdıklarınızı uygulayacağım. Teşekkürler..

  • fikir

    genel anlamda güzel bir yazı

  • güzel bir anlatım olmuş. başlangıç seviyesindeki arkadaşlar için faydalı olacaktır.

  • kafkasya

    bunlar başlangıç seviyesi ise ben hiç başlamamalıyım bu işe. çok zor ve zahmetli görünüyor.

  • oyun oyna

    Çok güzel ve açıklayıcı makalelerinizin devamını beklioruz

  • partigiano

    Merhaba, ben sizin temadaki gibi yorumlara cevapla button'u koymak istiyorum, bizimle bunu paylaşabilirseniz sevinirim

  • SEOLOG

    Severek Takip ettiğim bloglar arasında yer almaktasınız. Başarılarınızın devamını dilerim.

  • Chat

    Seoyu Sayenizde Azda Olsa Gün Geçdikçe Öğreniyorum Teşekkürler

  • can dogan

    Başlangıç seviyesi için iyi bir makale olmuş, bloğunuzun sıkı takipçilerindenim, elinize sağlık başarılı mutlu yıllar dilerim.

  • Gerçekten güzel bir yazı olmuş.

  • atilla

    iyi güzelde resimli anlatımı yokmu

  • tercüme

    Gayet güzel bir paylaşım olmuş. Ellerinize sağlık teşekkür ediyorum.

  • resimli anlatım olsa güzel olurdu,

  • SacReD

    Çok yararlı bilgiler vermişsiniz teşekkürler.Elinize sağlık

  • süper bir haber olmuş teşekürler…

  • cemil

    merhabalar, wordpresste yeniyim, istediğim herhangi bir sayfada eklenti çalıştırmak istiyorum bunu nasıl yaparım, şimdiden teşekkürler