Anasayfa Blog Wordpress WordPress Özel Alan / Meta Box Kullanımı ve Advanced Custom Fields Eklentisi

WordPress Özel Alan / Meta Box Kullanımı ve Advanced Custom Fields Eklentisi

WordPress’te özel alanlar, hazırladığınız web sitesinin özel ihtiyaçlarını karşılamak için kullanılır. WordPress, sayfanıza içerik girerken kategori, öne çıkan görsel, açıklama metni gibi birkaç veri girebileceğiniz alan sunsa da, bundan çok daha fazlasına ihtiyacınız olabilir. Portfolyo sayfası hazırlarken müşterinizi de ayrı bir alanda belirtmek isteyebilir ya da araba galerisi sayfası hazırlarken araba özelliklerinin girmek için birkaç farklı özel alana ihtiyacınız olabilir. Bu özel alanları içerik ekleme bölümüne yazmayız, çünkü sayfanın tasarımını değiştirmemiz gerektiğinde ya da bu alanlarla ilgili küçük bir değişiklik bile yapmamız gerektiğinde tüm içerikleri baştan düzenlemeye çalışmak doğru ve profesyonelce bir yaklaşım da değildir.

Eklenti Kullanmadan WordPress’in Custom Fields Özelliği Nasıl Kullanılır?

Kendi oluşturduğumuz temada ve yine kendi oluşturduğumuz custom post type’larda eklenti kullanmadan custom field oluşturmak istediğimizde, öncelikle temamızın functions.php dosyasının support özelliğine, yeni içerik eklerken girdiğimiz sayfada custom fields alanının görünmesi için ‘custom-fields’ ibaresini eklememiz gerekiyor.

'supports' => array( 'title', 'editor', 'thumbnail','custom-fields'),

Custom Field oluştururken, müşteri olarak bir içerik eklediğimizi düşünelim. single.php dosyalarında, eklediğimiz custom field’ı görüntülemek için de aşağıdaki kod yapısını kullanıyoruz. Aynı zamanda eğer alan boşsa da, sayfada görünmemesini sağlıyoruz.

ID, 'musteri',true)): ?>
    Müşteri: ID, 'musteri',true); ?>

Advanced Custom Fields (Gelişmiş Özel Alanlar) Eklentisi ile Özel Alan (Custom Fields) Oluşturma

WordPress’te özel alanlar (custom fields) için bir eklenti kullanıyoruz ki tema yapımı ile ilgilenenler için WordPress’in en başarılı eklentilerinden biri. Advanced Custom Fields (ACF) WordPress’e kurmamız gereken eklentinin ismi. Bu eklenti ile admin panelinde özel alanlar oluşturup, temamızda bu özel alanlara girilen verilerin görünmesini sağlayabiliyoruz. Eklentiyi kurduktan sonra yönetim panelinin sol tarafındaki menüde Custom Fields (Özel Alanlar) başlığı altında eklentimiz görünecek. Sonrasında çalışmalarımıza başlayabiliriz.

Yeni bir özel eklemek için Custom Fields (Özel Alanlar) menüsünün altındaki Add New (Yeni Ekle) sayfasını açalım. Bu sayfa üzerinde ilk olarak basit bir metin alanı oluşturalım. Bu metin alanı yönetim panelinde, görünmesini istediğimiz yerde görünecek ve buraya girilen kayıt yine temamız içerisinde görünmesini istediğimiz yerde görünecek.

Text

Field oluşturmak için gerekli bilgileri girdikten ve Field Type olarak Text’i seçtikten sonra bu özel alanın hangi sayfada çıkması gerektiğini seçiyoruz. Kaydettikten sonra aşağıdaki kodu tema dosyamıza yazıyoruz. Field ID yazan yeri, oluşturduğumuz özel alanın ismiyle değiştirmeyi unutmuyoruz.


Aşağıdaki kod şablonunu da kullanabiliyoruz.


If else koşulu ile birlikte özel alanları kullanmak da isteyebiliriz. Eğe özel alan dolu değilse göstermemesi gibi.


Textfield ve WYSIWYG Editörü

Textfield, birden fazla satır için kullanılan metin alanları oluşturmak için kullandığımız özel alan türü. Kullanımı text (metin) alanıyla aynı. Ancak o şekilde yaptığımızda paragrafları paragraf olarak değil, tek düze yazı şeklinde gösterecek. Bunun önüne geçmek için aşağıdaki şekilde kod satırları kullanıyoruz. nl2br, new line to break anlamına geliyor.


Textfield’ları, WYSIWYG editörü ile birlikte kullanmak da mümkün. Field Type olarak Wysiwyg Editor seçeneğini seçmemiz gerekli. Bu seçenekle, tıpkı WordPress’in varsayılan editörü gibi sadece görsel girdi ya da sadece kodlardan oluşabilecek metin girdisi oluşturabiliyoruz. Tabii bu sefer nl2br kodunu kullanmamıza gerek yok. Media Upload butonun da iptal edebilme özelliği bu seçeneğin özellikleri arasında.

[postlink id=”5330″ title=”Wordpress’te Custom Post Type Kullanımı”]

Özel alanlar eklerken Field Type seçenekleri size birçok özel alan türü eklemenize olanak tanıyor. Numara, e-posta adresi, URL adresi, parola gibi alanlar ile birlikte çok daha fazlasını oluşturabiliyorsunuz. Her biri kendi içinde farklı ve kullanışlı alt seçenekleri ile birlikte geliyor. Örneğin; e-posta alanı oluşturursanız o alana mutlaka e-posta girmeniz gerekiyor, ön yüzde de mailto ile birlikte yazarsanız maile link verecektir.

File Upload ve Image

İçerik eklerken dosya yükleyebileceğiniz ve ziyaretçilerinizin de o dosyayı indirmeleri için File Upload özelliğini kullanmamız gerekiyor. File Upload özelliğini görsel yükleme ve ziyaretçilerinize görsel sunma mantığıyla da kullanabilirsiniz. Sonuçta bu özellik size bir URL veriyor ve siz de o URL’yi istediğiniz gibi kullanabiliyorsunuz.




	Görseli İndir

Download kelimesi varken linke tıklarsanız dosya bilgisayarınıza inecektir, download kelimeisini kaldırırsanız görsel tarayıcınızda açılacaktır.

Özellikle görselleri görüntülemek için kullanılan Image alanını da aşağıdaki şekilde kullanabiliyoruz.




	

Select, Checkboxes ve Radio Button

Birkaç seçenek arasında seçim yapmak için kullanılan Select’i Custom Field olarak kullanmak için seçenekleri aşağıdaki gibi girmeniz gerekiyor. Önce ID, sonra da size görünmesini istediğiniz seçenek. Varsayılan değer alanına da varsayılan olarak seçilmesini istediğiniz seçeneğin ID’sini yazmanız yeterli. Kullanılan programlar ve programlama dilleri ile bir örnek yapalım.

photoshop : Adobe Photoshop
illustrator : Adobe Illustrator
htmlcss : HTML ve CSS
wordpress : WordPress

Select’i sayfa içerisinde kullanmak için aşağıdaki kodlardan faydalanıyoruz.




	Programlar: 

Yönetim panelinde Select Multiple Values seçeneğini seçerseniz de tekli değil, çoklu seçim yapmanıza olanak tanıyor. Return format kısmının Label olarak seçili olduğuna emin olun.



Radyo butonlar tek seçim sağladıkları için aşağıdaki kodu kullanmamız yeterli.



Button Groups

Seçimlerin tasarımları daha hoş birer buton halinde görünmesini istediğinizde kullanabilirsiniz.

[postlink id=”5281″ title=”Wordpress Teması Nasıl Yapılır?”]

True or False

True, false seçeneklerini de sayfa içerisinde if else döngüsü ile gösterebilirsiniz.



	True

	False

Yorum Ekle

Yeşilce Mh. Dalgıç Sk. No:334418 Kağıthane / İSTANBUL
Sosyal Medyada Takip Et

Hızlı Menü

BumerangData bir İTÜ Çekirdek girişimidir.

© 2024 DijitalAjans.Info.tr. Tüm Hakları Saklıdır. | Powered By BUBERKA