WordPress

WordPress Yazı Alanına Metabox Nasıl Eklerim?

Son güncelleme: 06 Eylül 2014

Merhaba arkadaşlar, bugün ne yazsam ne yazsam diye düşünürken aklıma geldi metabox ile ilgili yazı yazayım.

Evet gelelim Metabox’ı yazımıza nasıl ekleriz.

1. Adım:

İlk önce functions.php‘yi açıyoruz ve <?php tagından hemen sonra aşağıdaki kodu yazarak metabox.php‘yi çağırıyoruz.

include_once("metabox.php");

2. Adım:

Notepad++(Siz hangi kod editörünü kullanıyorsanız onu açın) açıyoruz ve aşağıdaki kodları yapıştırıp metabox.php olarak temanın bulunduğu klasöre kaydediyoruz.

/*
 * Plugin Name: Metabox
 * Author: Burak Şahin
 * Author URI: https://buraksah.in/
 */

$prefix = 'ozellikler_'; 

$meta_box = array(
 'id' => 'my-meta-box',
 'title' => 'Custom meta box',
 'page' => 'post',
 'context' => 'normal',
 'priority' => 'high',
 'fields' => array(
 array(
 'name' => 'Text box',
 'desc' => 'Enter something here',
 'id' => $prefix . 'text',
 'type' => 'text',
 'std' => 'Default value 1'
 ),
 array(
 'name' => 'Textarea',
 'desc' => 'Enter big text here',
 'id' => $prefix . 'textarea',
 'type' => 'textarea',
 'std' => 'Default value 2'
 ),
 array(
 'name' => 'Select box',
 'id' => $prefix . 'select',
 'type' => 'select',
 'options' => array('Option 1', 'Option 2', 'Option 3')
 ),
 array(
 'name' => 'Alt Yazı Seçeneği',
 'id' => $prefix . 'dil',
 'type' => 'radio',
 'options' => array(
 array('name' => 'Alt Yazısız ', 'value' => 'altyazisiz'),
 array('name' => 'Alt Yazılı ', 'value' => 'turkcealtyazi')
 )
 ),
 array(
 'name' => 'Video Kalitesi',
 'id' => $prefix . 'videokalitesi',
 'type' => 'radio',
 'options' => array(
 array('name' => '240p ', 'value' => 'p240p'),
 array('name' => '360p ', 'value' => 'p320p'),
 array('name' => '720p ', 'value' => 'p720p'),
 array('name' => '1080p ', 'value' => 'p1080p')
 )
 ), 

 array(
 'name' => 'Checkbox',
 'id' => $prefix . 'checkbox',
 'type' => 'checkbox'
 )
 )
); 

add_action('admin_menu', 'mytheme_add_box'); 

// Add meta box
function mytheme_add_box() {
 global $meta_box; 

 add_meta_box($meta_box['id'], $meta_box['title'], 'mytheme_show_box', $meta_box['page'], $meta_box['context'], $meta_box['priority']);
} 

// Callback function to show fields in meta box
function mytheme_show_box() {
 global $meta_box, $post; 

 // Use nonce for verification
 echo '<input type="hidden" name="mytheme_meta_box_nonce" value="', wp_create_nonce(basename(__FILE__)), '" />'; 

 echo '<table class="form-table">'; 

 foreach ($meta_box['fields'] as $field) {
 // get current post meta data
 $meta = get_post_meta($post->ID, $field['id'], true); 

 echo '<tr>',
 '<th style="width:20%"><label for="', $field['id'], '">', $field['name'], '</label></th>',
 '<td>';
 switch ($field['type']) {
 case 'text':
 echo '<input type="text" name="', $field['id'], '" id="', $field['id'], '" value="', $meta ? $meta : $field['std'], '" size="30" style="width:97%" />',
 '<br />', $field['desc'];
 break;
 case 'textarea':
 echo '<textarea name="', $field['id'], '" id="', $field['id'], '" cols="60" rows="4" style="width:97%">', $meta ? $meta : $field['std'], '</textarea>',
 '<br />', $field['desc'];
 break;
 case 'select':
 echo '<select name="', $field['id'], '" id="', $field['id'], '">';
 foreach ($field['options'] as $option) {
 echo '<option', $meta == $option ? ' selected="selected"' : '', '>', $option, '</option>';
 }
 echo '</select>';
 break;
 case 'radio':
 foreach ($field['options'] as $option) {
 echo '<input type="radio" name="', $field['id'], '" value="', $option['value'], '"', $meta == $option['value'] ? ' checked="checked"' : '', ' />', $option['name'];
 }
 break;
 case 'checkbox':
 echo '<input type="checkbox" name="', $field['id'], '" id="', $field['id'], '"', $meta ? ' checked="checked"' : '', ' />';
 break;
 }
 echo '<td>',
 '</tr>';
 } 

 echo '</table>';
} 

add_action('save_post', 'mytheme_save_data'); 

// Save data from meta box
function mytheme_save_data($post_id) {
 global $meta_box; 

 // verify nonce
 if (!wp_verify_nonce($_POST['mytheme_meta_box_nonce'], basename(__FILE__))) {
 return $post_id;
 } 

 // check autosave
 if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
 return $post_id;
 } 

 // check permissions
 if ('page' == $_POST['post_type']) {
 if (!current_user_can('edit_page', $post_id)) {
 return $post_id;
 }
 } elseif (!current_user_can('edit_post', $post_id)) {
 return $post_id;
 } 

 foreach ($meta_box['fields'] as $field) {
 $old = get_post_meta($post_id, $field['id'], true);
 $new = $_POST[$field['id']]; 

 if ($new && $new != $old) {
 update_post_meta($post_id, $field['id'], $new);
 } elseif ('' == $new && $old) {
 delete_post_meta($post_id, $field['id'], $old);
 }
 }
}

Şimdi yazı ekleme sayfasına girdiğimizde aşağıdaki gibi bir tablo karşımıza gelcektir.

3. Adım:

Geldik son adımımıza. Bu adımda metaboxa yazılan yazıyı nasıl çağıracağımızı göstereceğiz. Aşağıda verdiğim kodu metaboxdaki veriyi nereye çekmek istiyorsanız oraya yazın.

<?php  if (get_post_meta($post->ID, 'ozellikler_dil', true)) : ?>  // Eğer if döngüsü kullanacaksak yazıyoruz
<?php  echo get_post_meta($post->ID, 'ozellikler_dil', true) ?> // Metaboxu çekecek olan kod
<?php  endif; ?> // İf döngüsünü kullandıysak kapatıyoruz

Gelelim Kodları Tanımaya:

ilk kodumuzu örnek olarak alacak olursak;

array(
'name' => 'Text box',
'desc' => 'Enter something here',
'id' => $prefix . 'text',
'type' => 'text',
'std' => 'Default value 1'
),

Detaylara girecek olursak;
‘id’ => $prefix . ‘text’, incelediğimiz zaman buradaki text metaboxda tek olmalıdır. Yani eğer biz Youtube Video URL’sini bu metin kutusundan çekeceksek text yerine youtube yazmalıyız. Hatırlaması kolay ve tek olacaktır.

‘type’ özelliğini inceleyecek olursak buradaki;
text = tek satırlık metin kutusu
textare = metin alanı
radio = tek seçim yapmamızı sağlayan tip
select = açılır kutu

 

Hata alan arkadaşlar için kullanmış olduğum metabox.php dosyasını paylaşıyorum.

Metabox Dosyasını İndir

Yukarıda ki metabox dosyasını indirdikten sonra metabox.txt ismini metabox.php olarak değiştirin.

Sevgiler.
Bir önceki yazımız olan Pinterest Tarzı Wordpress Teması (Yorumlarınızı Bekliyor) başlıklı makalemizi de okumanızı öneririz.

Merhaba! Ben Burak. 2016 yılında Karadeniz Teknik Üniversitesi Harita Mühendisliği Bölümü’nden mezun oldum. Lise yıllarında HTML & CSS‘e, Üniversite yıllarında WordPress ve Matlab‘e adım attım. Lisans tezimi Matlab üzerinden program yazarak teslim ettim. Çeşitli projeler için WordPress tabanlı yazılımlar geliştirdim.

Benzer İçerikler

WordPress’te Sayfa Sonuna İndikçe Eski Yazıların Yüklenmesi (Facebook & Twitter Tarzı)

11 Mayıs 2013

Oteliniz için bir WordPress Web Sitesi Nasıl Oluşturulur?

18 Ekim 2017
wordpress eklentisiz iletişim sayfası yapımı

WordPress Eklentisiz iletişim Sayfası Yapımı

22 Ocak 2013

38 Yorum

  • Sefa

    25 Mart 2021 at 18:18

    Merhaba, konu tarihi biraz eski ama yine de bir umut. Paylaşımınız için teşekkür ederim. Ancak bu metabox’u özel gönderi türünde(custom post type) için nasıl gösterebilirim?

    Yanıtla

  • Ofis Adamı

    6 Aralık 2017 at 17:28

    Güzel çalışma tebrikler… Peki birden fazla seçenek seçmek mümkün mü? Sadece alt yazılı ve alt yazısız değil her ikisini işaretlemek için ne yapmalıyız?

    Yanıtla

    • Burak Şahin

      16 Aralık 2017 at 00:55

      Bu metabox o işlem için basit kaçıyor. Şuan piyasada çok gelişmiş metabox kütüphaneleri mevcut, bu kütüphaneler ile dediğiniz şekilde seçimler hazırlayabilirsiniz.

      Yanıtla

  • Gökhan

    6 Kasım 2017 at 18:52

    Merhabalar,
    Verdiğiniz kodları sorunsuz bir şekilde temaya entegre edebildim ancak bir yerde tıkandım. İlk olarak ben Film teması oluşturmaya çalışıyorum ve filmlerin İMDb puanlarını metabox alanından “text” olarak giriyorum. Temamda, imdb puanları yüksekten alçağa doğru nasıl sıralayabilirim? Teşekkürler.

    Yanıtla

  • Burak Erikan

    2 Ağustos 2015 at 22:46

    Checkbox seçildiği zaman bunu konu içinde nasıl seçildiğini göstericez.Tam anlatamadım örnek olarak sizin emlak temanızda bulunan Konut Özellikleri – İç Özellikler kısmını soruyorum

    Yanıtla

  • mustafa efdal

    1 Temmuz 2015 at 10:41

    merhaba, wordpress’te biraz yeniyim. hatta direk toyum. Güzel bi çalışma ancak tabloda verdiğim değerleri oluşturduğum sayfaya aktaramıyorum. verileri çağırmak için bir kod paylaşmışsınız ancak ben onları nereye koyacagımıda bilemiyorum. yardım ederseniz sevinirim teşekkürleer

    Yanıtla

  • Ozkan Celik

    23 Kasım 2014 at 12:55

    Merhaba, bir tema yapıp kendime site açmak istiyorum yayınlamış olduğunuz metabox ‘u kullanacağım fakat ben checkbox ile seçtiğim içerikleri bir yerde göstermek istiyorum bu mümkün mü ?

    Yanıtla

  • serkan

    9 Eylül 2014 at 21:48

    hocam merhaba bu işlemi yaptım çok güzel çalıştırıyor ben tekrardan böyle bir alan oluşturmak istiyorum yeni php dosyası açıyorum yapıyorum ancak hata veriyor böyle kodların kullanıldığını bunu ikinci dosya için nasıl editleyebiliriz?

    Yanıtla

    • Burak ŞAHİN

      18 Eylül 2014 at 11:29

      functions dosyalarının isimlerini ve add_action’daki isimlerini değiştirin. Örneğin;
      mytheme_add_box ismini mytheme_add_boxs olarak değiştirin. Bu işlemi tüm functions kodları için uygulayın

      Yanıtla

  • kenan

    9 Eylül 2014 at 12:22

    1 sorum daha olacaktı. Yazı alanına checkbox ekledik diyelim öneçıkan yazılar diye bu checkboxu işaretleyince yazı onecıkan kısımda listelenmesi için nasıl bir sorgu yapmamız lazım ?

    Yanıtla

    • Burak ŞAHİN

      18 Eylül 2014 at 11:26

      “file” dosya tipini eklemeniz gerekmektedir. Fakat sadece file açmanız yetmeyecek. php ile o seçilen resmi ftp e yüklemeniz gerekiyor. Google’da php resim yükleme diye arattığınız zaman bulabilirsiniz.

      Yanıtla

      • emre

        2 Şubat 2015 at 00:49

        merhabaya k.bakmayın ben çok aradım fakat bulamadım bi yardımcı olur musunuz. nasıl yapabiliriz bu resim ekleme işlemini bir türlü işin içinden çıkamadım

        Yanıtla

  • ugur

    6 Eylül 2014 at 16:40

    merhaba paylaşım için teşekkürler, bir yerde takıldım ben. , option butonları yan yana dizmişsiniz örnekte , checkboxlarıda ben yan yana dizmek istiyorum ama bi türlü yapamadım yardımcı olursanız sevinirim. tşkler şimdiden

    Yanıtla

    • Burak ŞAHİN

      6 Eylül 2014 at 22:47

      Kendi metabox dosyanızı yazmanız gerekmektedir çünkü bunda öyle bir şey yapamazsınız. Yada alt alt checkboxlar oluşturup her biri için sorgu oluşturacaksınız ancak.

      Yanıtla

  • Can

    12 Mayıs 2014 at 17:55

    Merhabalar hocam biliyorum çok eski konu ancak yapamadığım için soruyorum.Bunu ekledim sorunsuz çalışıyor ancak Checkbox ve Radiobuttonları nasıl single.php de çağırıyoruz onu anlayamadım.Yani söylemek istediğim elimizde 3 radiobutton var hangisi seçiliyse onu çağırsın.Bunu nasıl yapacağımızı anlatırsanız çok memnun olurum.

    Yanıtla

    • Burak ŞAHİN

      12 Mayıs 2014 at 20:44 
      <?php echo get_post_meta($post->ID, 'ozellikler_videokalitesi', true); ?>

      kodu ile çekebilirsiniz. Bu şekilde value‘deki değeri size ekrana yazacaktır.
      Eğer koşul sağlamak istiyorsanız aşağıdaki gibi yapabilirsiniz

      <?php if ( get_post_meta($post->ID, 'ozellikler_videokalitesi', true) == 'p240p' ) { ?>
Video Kalitesi 240p'dir
<?php } elseif ( get_post_meta($post->ID, 'ozellikler_videokalitesi', true) == 'p320p' ) { ?>
Video Kalitesi 320p'dir
<?php } elseif ( get_post_meta($post->ID, 'ozellikler_videokalitesi', true) == 'p720p' ) { ?>
Video Kalitesi 720p'dir
<?php } elseif ( get_post_meta($post->ID, 'ozellikler_videokalitesi', true) == 'p1080p' ) { ?>
Video Kalitesi 1080p'dir
<?php } ?>
      Yanıtla

  • Mehmet

    14 Ağustos 2013 at 00:42

    Hocam öncelikle paylaşımınız için çok teşekkürler. Bir günümü bunu aramakla geçirdim lakin bir sorunum var. Hiç ekleme çıkarma yapmadan tek satırlık çağırma kodunu function’a ekledim, metabox.php içine atılacak kodlara da ekleme yapmadan kaydedip sunucuya gönderdim. Yazı ekleme bölümüne gelince aşağıdaki resimde bulunan sorunla karşılaştım:
    Metabox

    Yanıtla

  • tunç

    8 Şubat 2013 at 15:06

    Çok teşekkür ederim çok yararlı bir konu sabitlenmesini ve yeni özelliklerle konununn devam etmesini isterim. bir çok kişi bu olayı yapamıyor ama bu kodlar sayesinde eklenti kullanmadan çok daha güzel metabox lar oluştura biliriz. Teşekkürler

    Yanıtla

Bir yanıt yazın

Bu site, istenmeyenleri azaltmak için Akismet kullanıyor. Yorum verilerinizin nasıl işlendiği hakkında daha fazla bilgi edinin.