IHS Blog

WordPress Kodlama Standartları Kılavuzu

wordpress-kodlama-standartlari

WordPress‘in en güzel yanı açık kaynak(open-source) bir platform olmasıdır. Bu sayede WordPress’e katkıda bulunabilir ve WordPress’i daha da mükemmel yapabilirsiniz. Evet yanlış duymadınız. Siz de yapabilirsiniz.

Açık kaynaklı yazılımların tabii ki bir business tarafı var, fakat bunun yanındaki asıl amaç bellidir: “Haydi birlikte bir şeyler yapalım!” Bu amaçla WordPress’in Kodlama Standartları olabildiğince temiz ve işlevsel olması için bir dizi HTML, CSS, JavaScript ve PHP derlemesiyle yazılmıştır.

WordPress Kodlama Standartlarına Neden İhtiyaç Duyarız?

Gündelik yaşantımızda hepimiz farklıyız. Bu durum kod için de geçerli, yani herkesin yazım tarzı da farklı. HTML ile gayet başarılı iş çıkartabilen bir kişinin javascript çalışmaları gözleri kanatabilir. Bu durum her ne kadar kurallı kod sözdizimine aykırı gözükse de WordPress’te yazılan her satır birbirinden biraz farklı olabilir.

Bu farklılıklardan dolayı ve WordPress Kodlama Standartlarından dolayı sizden sonra gelenler sizin katkıda bulunduğunuz kodları anlayamayacaktır ve üzerine kendi kodlarını sorunsuzca ekleyebilecektir.

Katkıda Bulunurken Bilmeniz Gerekenler

Standartlara ilk baktığınız zaman biraz sınırlayıcı görünebilirler. Doğrusunu söylemek gerekirse biraz kısıtlayıcılar gerçekten. Eğer şu ankinden daha hafif kurallar olsaydı WordPress kodu ve işler biraz karmaşıklaşabilirdi.

Standartlar gerçekten oldukça kapsamlı, bu yüzden tüm detaylara körü körüne hâkim olmanız gerekmiyor. Sadece ihtiyacınız olan bölümlere bakıyor olmanız yeterlidir.

WordPress Kodlama Standartları Örnekleri

WordPress’in temelini oluşturan her dil için ayrı ayrı standartlar mevcut: PHP için, JavaScript için, HTML için ve CSS için.

HTML Örnekleri

Bir web sitesinin kaynak kodunu açtığınız zaman hiç “Nasıl olur da bunun daha iyisi yazılmaz?” diye düşündünüz mü? Eminiz düşündünüz. İşte bu yüzden HTML standartları var. Biraz parmaklarınızı yormanıza neden olacak W3C (World Wide Web Consortium) standartlarını görmek için buraya tıklayınız.

Çentikleme

Parantezin yanında en çok tartışılan unsurlardan biri de çentiklerdir. Fakat WordPress Codex, sekmelerin kullanması gerektiği için ve bayrakların sıraya girmesini sağladığı için çentiklerin kullanılması gerektiğini söylüyor.

İyi örnek:

<h1>Selam, Dunya!</h1>

    <div>

        <p>Hey, WordPress Milleti!</p>

    </div>

<h2>Baybay, Dunya!</h2>

Kötü örnek:

<h1> Selam, Dunya!</h1>

<div>

<p> Hey, WordPress Milleti!</p>

</div>

<h2> Baybay, Dunya!</h2>

Tırnak İşareti

Tırnak işaretlerini kullanın. Çift ya da tek olması size kalmış. Fakat öyle ya da böyle mutlaka kullanmanız gerekiyor.

İyi örnek:

<form>

E-mail Adresiniz: <br />

<input type=’text’ name=’email’><br />

<input type=’submit’ value=’Submit’>

</form>

Kötü örnek:

<form>

E-mail Adresiniz: <br />

<input type=text name=email><br />

<input type=submit value=Submit>

</form>

Yani kısaca tırnakları kullanınca iyi, kullanmayınca kötü.

CSS Örnekleri

CSS söz konusuysa standartların çoğunun okunabilirlikle ilgili olması muhtemeldir. WordPress’te birçok sınıf ve ids mevcut. Bu yüzden kodumuzu hazırlarken dikkatli olmazsak stil sayfaları can sıkıcı olabilir.

Yapı

WordPress Kodlama Standartlarına göre CSS’in her bir öğesi kendi satırında olmalı ve kendi parantezinde olmalı. Bunların yanında ek olarak başkalarının da takip edebilmesi için öğelerinize belirli isimler vermelisiniz.

İyi örnek:

#email-div-about,

#email-div-blog {

    text-align: center;

    display:block;

    margin: auto;

}

Kötü örnek:

.awesome-emails, .amazing-something { text-align: center; display:block; margin: auto; }

Hatta:

.awesome-emails,#amazing-stuff {

    text-align: center;

    display:block;

    margin: auto;

}

Özellikler

Diğer birçok değişken gibi özelliklerin de mümkün olduğunca özelleştirilmiş ve spesifik olması gerekiyor. Bu durum kullanıcılar için hayatı kolaylaştırsa da kodun genel boyunu biraz büyütür.

İyi örnek:

#form-submit-btn {

    display: block;

    background: #000;

    color: #fff;

    margin: 20px;

}

Kötü örnek:

#bjs-awesome-button {

    background: WHITE;

    color: #FFFFFF;

    border: 35PX;

    Margin-right: 30;

}

JavaScript Örnekleri

JavaScript konusunda çok sayıda WordPress Kodlama Standartı var. Standart JavaScript uygulamalarından çok da farklı olmadıkları için muhtemelen standartların çoğuna aşinasınız.

İyi örnek:

var b, j, k, awesome,

    // Buraya sekmeleri girmeniz gerekiyor!

    value = ‘Bir şey’;

Kötü örnek:

var b = true;

var j = false; // Bu kötü bir örnek olduğu için yanlış şeyler yapıldı!

var k = b + j;

var awesome = true;

Yorumlar

Yorumlar aslında JavaScript kodunun temel parçalarından biri değil. Ama birçoğumuz için oldukça önemli ve kabul edelim ki iyi belgelenmiş kodlar sanat eseri niteliği taşıyor. The Core ekibinin yazdığı bazı kodlar şöyle:

Tek satır:

function bjk();

//Bir sonraki satırı açıklayın

$( ‘beej’ ).beAwesome();

Çoklu Satır:

/*

 * Birden fazla satıra yorum yazarken

 * tıpkı burada olduğu gibi

 * yıldız işaretlerini kullandığınızdan emin olun.

 */

PHP Örnekleri

WordPress bir PHP yazılımıdır. Geliştiriciler tabii ki üzerine JavaScript’ten bir şeyler katıyor fakat yine de yazılımın büyük kısmı PHP altyapılı.

PHP Tag’leri

Php etiketleri kendi satırlarında olmalıdır ve kısaltılmamalıdır.

İyi örnek:

<div>

    <?php

        echo ‘Selam Dunya!’;

    ?>

</div>

Ya da:

<div>

    <?php echo ‘Selam Dunya!’; ?>

</div>

Kötü örnek:

<div>

    <?

       echo ‘Selam Dunya!’;

    ?>

</div>

Adlandırma

PHP ile birçok şeyi yapmak mümkün. Bu kadar imkân biraz karmaşıklığı da beraberinde getiriyor. WordPress’in kodlama standartları doğrultusunda PHP’nin uzun kodlarına bulaştıysanız bazı adlandırma işlemleriyle kargaşayı önleyebilirsiniz.

Nasıl Katkıda Bulunabilirsiniz?

Temel standartları biliyor olmanız katkıda bulunmak için yeterlidir. Bunun için de en iyi yer make.wordpress.org‘dur. Çünkü WordPress’in yapıldığı yer burası.

Belgelerden çekirdeğe kadar, destekten her türlü kodlama dillerine kadar her şeyin konuşulduğu Slack toplantılarına katılabilirsiniz. Ayrıca düzenli olarak yapılan WordCamp panellerine de katılabilirsiniz.

Sizde hemen WordPress’e özel oluşturduğumuz IHS Worpress paketlerimizden birini satın alıp hemen websitenizi geliştirmeye başlayabilirsiniz.

Exit mobile version