{"id":11226,"date":"2020-12-26T00:00:00","date_gmt":"2020-12-26T00:00:00","guid":{"rendered":"https:\/\/binus.ac.id\/binus-digital\/2020\/12\/26\/membuat-web-option-dengan-cmb2\/"},"modified":"2024-09-24T02:20:16","modified_gmt":"2024-09-24T02:20:16","slug":"membuat-web-option-dengan-cmb2","status":"publish","type":"post","link":"https:\/\/binus.ac.id\/binus-digital\/2020\/12\/26\/membuat-web-option-dengan-cmb2\/","title":{"rendered":"Membuat Web Option dengan CMB2"},"content":{"rendered":"

Artikel ini masih lanjutan dari artikel\u00a0Membuat Custom Post Meta dengan CMB2<\/a>. Selain bisa digunakan untuk membuat Custom Meta Box, CMB2 juga dapat digunakan untuk membuat sebuah Web Option.<\/p>\n

Sebenarnya, WordPress punya fitur yang lebih keren yaitu\u00a0Customizer<\/a>. Tapi CMB2 ini adalah cara termudah dan tercepat dibandingkan dengan Customizer.<\/p>\n

Langsung saja kita buat Web Option nya.<\/p>\n

01. Membuat Menu Admin \u201cWeb Options\u201d<\/strong>
\nUntuk membuat menu Admin nya, buka file \u201cfunctions.php\u201d dan ketik kode berikut.<\/p>\n

function app_web_options() {\r\n\u00a0 $cmb = new_cmb2_box(array(\r\n\u00a0 \u00a0 'id'           => 'web-options',\r\n\u00a0 \u00a0 'title'        => 'Web Options',\r\n\u00a0 \u00a0 'object_types' => array('options-page'),\r\n\u00a0 \u00a0 'option_key'   => 'web-options'\r\n\u00a0 ));\r\n\u00a0 $cmb->add_field(array(\r\n\u00a0 \u00a0 'id'   => 'owner_name',\r\n\u00a0 \u00a0 'name' => 'Owner Name',\r\n\u00a0 \u00a0 'type' => 'text'\r\n\u00a0 ));\r\n}\r\nadd_action('cmb2_admin_init', 'app_web_options');<\/pre>\n
Dengan kode tersebut, kita membuat sebuah menu baru di halaman Admin dengan nama \u201cWeb Options\u201d yang akan digunakan untuk mengkonfigurasi Nama Owner yang nanti nya akan ditampilkan di halaman Home atau Front-End.<\/p>\n
\"\"<\/p>\n
Jika menu nya di klik, akan tampil seperti berikut.<\/p>\n
\"\"<\/p>\n
Silahkan diisi apa saja untuk ditampilkan di halaman Home atau Front-End.<\/p>\n
02. Menampilkan Option di Halaman Home atau Front-End<\/strong>
\nUntuk menampilkan nya cukup mudah. Caranya buka file \u201cindex.php\u201d atau file lainnya dimana option tersebut akan ditampilkan. Lalu ketik kode berikut.<\/p>\n
\/\/ \"web-options\" adalah option key nya.\r\n$web_options = get_option('web-options');\r\necho $web_options['owner_name'];\r\n\r\n\/\/ atau bisa membuatkan nilai default untuk data options nya\r\n\/\/ untuk menghindari error\r\n$web_options = get_option('web-options');\r\n$web_options = wp_parse_args($web_options, array(\r\n\u00a0 'owner_name' => ''\r\n));<\/pre>\n
Bagaimana, mudah kan ya? Dibandingkan dengan fitur Customizer yang memerlukan beberapa step untuk membuatnya, dengan plugin CMB2 cukup dengan 2 step di atas saja.<\/p>\n
Cukup sampai sini dulu artikel kali ini. Semoga bermanfaat.<\/p>\n
Untuk tipe input lainnya, sama seperti artikel sebelumnya, bisa dilihat pada link berikut.
\nhttps:\/\/cmb2.io\/docs\/field-types<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
Artikel ini masih lanjutan dari artikel\u00a0Membuat Custom Post Meta dengan CMB2. Selain bisa digunakan untuk membuat Custom Meta Box, CMB2 juga dapat digunakan untuk membuat sebuah Web Option. Sebenarnya, WordPress punya fitur yang lebih keren yaitu\u00a0Customizer. Tapi CMB2 ini adalah cara termudah dan tercepat dibandingkan dengan Customizer. Langsung saja kita buat Web Option nya. 01. […]<\/p>\n","protected":false},"author":20,"featured_media":11227,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[77],"tags":[],"class_list":["post-11226","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-articles"],"_links":{"self":[{"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/posts\/11226","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/comments?post=11226"}],"version-history":[{"count":1,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/posts\/11226\/revisions"}],"predecessor-version":[{"id":11803,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/posts\/11226\/revisions\/11803"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/media\/11227"}],"wp:attachment":[{"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/media?parent=11226"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/categories?post=11226"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/tags?post=11226"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}