Pada kesempatan kali ini saya akan melanjutkan kembali tutorial yang sebelumnya Custom Option Dengan Setting API. Pada tutorial ini saya akan membuat field untuk sosial media seperti facebook, twitter, dan google plus. Sosial media memang mempunyai peran sangat penting, mengingat kebanyakan orang membaca berita, tutorial atau hal lain selalu melalui sosial media, jadi mari kita buat field nya terlebih dahulu.



1. Buka kembali project yang sebelumnya, buka kembali file function-admin.php, lalu di function sunda_custom_settings tambahkan satu lagi script berikut:

register_setting ( 'sunda-settings-group', 'last_name');

dan cari function sunda_sidebar_name lalu tambahkan script berikut:

$lastName = esc_attr( get_option('last_name'));

tepat dibawah $firstName , dan masih di function sunda_sidebar_name tambahkan juga script  

<input type="text" name="last_name" value="'.$lastName.'" placeholder="Last Name" />

Tampilannya: 



function sunda_sidebar_name() {
  $firstName = esc_attr ( get_option('first_name') );
  $lastName = esc_attr( get_option('last_name'));
  echo '<input name="first_name" type="text" value="'.$firstName.'" placeholder="First Name" /> <input name="last_name" type="text" value="'.$lastName.'" placeholder="First Name" />';
}

lalu coba refresh wordpress anda, kalau sudah muncul field last name berarti sudah berhasil, jika belum silahkan di cek ulang scriptnya.
Lanjut ke script berikutnya yaitu menambahkan field untuk sosial media, langsung copy register_setting berikut dan paste kan di bawah register_setting last name

  register_setting( 'sunda-settings-group', 'twitter_handler', 'sunda_sanitize_twitter_handler');
  register_setting( 'sunda-settings-group', 'facebook_handler');
  register_setting( 'sunda-settings-group', 'gplus_handler');

tambahkan juga script field ini tepat dibawah field first name:

  add_settings_field ( 'sidebar-twiter', 'Twitter Handler', 'sunda_sidebar_twitter', 'gidhancrx_sunda', 'sunda-sidebar-options');
  add_settings_field ( 'sidebar-facebook', 'Facebook Handler', 'sunda_sidebar_facebook', 'gidhancrx_sunda', 'sunda-sidebar-options');
  add_settings_field ( 'sidebar-gplus', 'Google Plus Handler', 'sunda_sidebar_gplus', 'gidhancrx_sunda', 'sunda-sidebar-options');

jika sudah tambahkan juga beberapa funcion untuk sosial media tersebut, copy script ini dibawah sunda_sidebar_name:

function sunda_sidebar_twitter() {
  $twitter = esc_attr(get_option('twitter_handler'));
  echo '<input type="text" name="twitter_handler", value="'.$twitter.'" placeholder="Twitter Handler" /><p class="description">Input your Twitter Username without @ character.</p>';
  //jika ingin menggunakan deskripsi silahkan masukan deskrip tapi jika ingin dihilangkan silahkan hapus deskripsinya
}
function sunda_sidebar_facebook() {
  $facebook = esc_attr(get_option('facebook_handler'));
  echo '<input type="text" name="facebook_handler", value="'.$facebook.'" placeholder="Facebook Handler" />';
}
function sunda_sidebar_gplus() {
  $gplus = esc_attr(get_option('gplus_handler'));
  echo '<input type="text" name="gplus_handler", value="'.$gplus.'" placeholder="Twitter Handler" />';
}
 
//Sanitization Settings
function sunda_sanitize_twitter_handler( $input ) {
  $output = sanitize_text_field( $input );
  $output = str_replace('@','', $output);
  //untuk menghilangkan @ pada text field twitter
  return $output;
}


Setelah itu lalu simpan file dan refresh wordpress anda, dan lihat hasilnya, jika tidak berhasil silahkan koreksi lagi script nya takut ada yg terlewatkan. Berikut screenshot jika anda berhasil menambahkan beberapa field sosial media.
Untuk Anda yang masih belum hafal fungsi dari setiap script silahkan googling ya, jangan hanya copas tapi tidak tau fungsi dari setiap script nya, atau setidaknya anda mengerti untuk diri sendiri apa fungsi script-script tersebut meskipun sulit untuk menjelaskannya kepada orang lain.

Silahkan cocokkan kembali scriptnya:

dan ini untuk register_setting nya:

kalau sudah silahkan cek kembali ya, mungkin sekian untuk tutorial Custom Sosial Media Fields dan Sanitize Callbacks nya, di kesempatan berikutnya saya akan memberikan tutorial Memasukkan CSS di Administration Panel, jadi jangan sampai kelewatan ya. See You!!!