Berikut ini adalah contoh navbar pada blog:

Navbar pada WordPress ada dua tipe,

Yang pertama adalah Primary Navbar, navbar ini biasanya letaknya paling atas (diatas Secondary Navbar) dan biasanya menampilkan berdasarkan Pages yang kita buat.

Yang kedua adalah Secondary Navbar, navbar kedua yang letaknya tepat dibawah Primary Navbar dan biasanya menampilkan berdasarkan Kategori yang kita buat.

Tidak semua tema WordPress memiliki dua buah tipe navbar sekaligus, kebanyakan dari tema itu hanya memiliki Primary Navbar. Namun juga ada beberapa tema yang tidak mendukung adanya navbar ini. Lantas bagaimana untuk membuat navbar pada tema yang tidak mendukung navbar? Jawabannya kita bisa membuatnya secara manual.

Manual disini kita tidak harus membuat navbar dengan bahasa pemograman yang membingungkan (karna WordPress memang tidak mengijinkan itu ), namun WordPress telah menyediakan fitur “Menus” yang dapat digunakan membuat navbar secara mudah.

Saya akan menjelaskan bagaimana cara membuat navbar dengan fitur Menus. Cara ini berhasil merubah default navbar yang ada pada tema Enterprise sesuai kehendak Kita. Tidak lagi menampilkan navbar berdasarkan Pages dan Kategori lagi, namun bisa menampilkan berdasarkan Single Posts dan link dari luar blog Kita. Semoga cara ini juga berlaku untuk tema WordPress yang lainnya pula.

Untuk Memulai Membuat Navbar.

1. Tentu saja Anda login dulu ke dashboard WordPress Anda.
2. Pada sisi kiri halaman Dashboard klik [Appearance] > [Menus].
   
3. Maka akan terbuka halaman Menus, untuk segera memulai membuat navbar silahkan cari menu seperti yang terlihat pada screenshot dibawah.
   
4. Kemudian berilah nama navbar pada kolom “Menu Name”, pemberian nama ini nantinya akan digunakan sebagai ID navbar. Sebagai contoh berilah nama navbar dengan “My Custom Menu”, sama seperti screenshot diatas.
5. Anda diperbolehkan membuat lebih dari satu ID Navbar dengan meng-klik tanda [ + ].
   
6. Setelah selesai klik tombol [Create Menu].

Pada tahap ini pembuatan navbar baru setengahnya, dan selanjutnya kita akan mengisinya dengan link-link atau menu yang nantinya akan bisa tampil berderet (horizontal) dan dropdown di navbar.

Untuk membuat navbar berdasarkan Pages;

1. Masih pada halaman Menus, cari menu “Pages” seperti terlihat pada screenshot dibawah.
   
   Didalam menu Pages akan terlihat daftar pages yang telah anda buat. Jika tidak ada Saya sarankan untuk membuat Pages, silahkan baca disini.
2. Silahkan pilih Pages yang ingin Anda tampilkan pada navbar dengan cara memberi tanda centang [ √ ].
3. Setelah selesai klik tombol [Add to Menu].

Untuk membuat navbar berdasarkan Kategori;

1. Masih pada halaman Menus, cari menu “Categories” seperti terlihat pada screenshot dibawah.
   
   Didalam menu Categories akan terlihat daftar kategori yang telah anda buat. Jika tidak ada Saya sarankan untuk membuat kategori, silahkan baca disini.
2. Silahkan pilih Kategori yang ingin Anda tampilkan pada navbar dengan cara memberi tanda centang [ √ ].
3. Setelah selesai klik tombol [Add to Menu].

Untuk membuat navbar dengan link sendiri;

1. Masih pada halaman Menus, cari menu “Custom Links” seperti terlihat pada screenshot dibawah.
   
   a. Pada kolom [URL], isikan link yang Anda kehendaki.
   b. Pada menu [Label], tulis judul untuk link yang Anda isi tadi.
2. Setelah selesai klik tombol [Add to Menu].

Membuat Sub Menu Navbar (dropdown navbar);

1. Untuk membuat sub menu pada navbar, silahkan geser salah satu item ke samping kanan. Maka item tersebut akan meng-induk pada item diatasnya dan menjadikan item tersebut sub menu. Dan begitu seterusnya.
   
2. Dibawah adalah tampilan dari sub menu navbar saat diklik.
   
3. Terlihat diatas bahwa menu “Ubuntu – Free OS!” menginduk pada menu “Tech”.

Untuk Menampilkan Navbar Pada Halaman Blog.

Hal terpenting sekaligus final dari membuat navbar adalah menampilkannya pada halaman blog. Dan berikut caranya;

1. Masih pada halaman Menus, cari menu “Theme Locations” seperti terlihat pada screenshot dibawah.
   
2. Pada menu drop down “Primary Navigation” atau “Primary Menu”, pilih nama navbar yang telah Kita buat tadi, yaitu “My Custom Menu”. Jika Anda membuat lebih dari satu nama navbar, nama itu bisa Anda pilih pada menu drop down “Secondary Navigations” atau “Secondary Menu”.
3. Kemudian klik tombol [Save].

Silahkan cek halaman blog Anda, apakah navbar telah tampil atau belum. Jika berkali-kali Anda gagal menggunakan cara diatas, berarti masalahnya terdapat pada tema yang Anda miliki. Untuk mengatasinya, silahkan ganti tema yang mendukung navbar. Bisa Anda baca disini.

Bloggers[dot]com ini sengaja didedikasikan bagi para penulis blog. Di Bloggers[dot]com juga mengijinkan membernya untuk berbagi mengenai apa yang mereka tulis di blog, berkomentar dan mengomentari. Tak hanya itu, di jejaring sosial khusus narablog ini diberikan fitur share otomatis. Artinya bila diblog Anda terdapat update baru, maka secara otomatis akan tampil di dalam dashboard akun Bloggers[dot]com Anda dan dapat dilih oleh para penghuninya dari seluruh dunia. Seperti motto Bloggers, “Meet Millions Of Bloggers”.

Bloggers.com

Hampir sama dengan facebook, di Bloggers[dot]com Kita juga dapat mencari teman sebanyak-banyaknya. Bahkan para master blog dari seluruh dunia banyak yang bergabung didalamnya. Banyak keuntungan jika Anda bergabung di Bloggers[dot]com, selain mencari pertemanan antar narablog di jejaring ini pula Anda dapat mempromosikan blog Anda go international.

Walau logo Bloggers[dot]com seperti Blogspot, namun apapun platform blog Anda akan diterima. Jejaring sosial ini diperuntukan bagi siapa saja dan platform blog apapun. Jadi jika Anda mengaku Blogger sejati atau narablog segeralah bergabung didalamnya. Dan masukkan semua blog yang Anda punya di Bloggers[dot]com.

Bagi yang berminat dan ingin bergabung, silahkan klik disini.

Jika ada yang berkenan menjadi teman narablog Saya, silahkan klik saja banner dibawah.

Dengan penambahan menu pada contact form ini memungkinkan kita untuk menggunakannya tidak hanya sekedar untuk membuat kontak email saja. Dan berterimaksihlah pada WordPress jika Anda memiliki blog untuk ajang berjualan online. Karna contact form ini dapat pula digunakan menjadi form order alias formulir pemesanan. Sehingga proses pemesanan dapat dengan mudah dilakukan oleh calon pembeli. Dan apabila pembeli telah selesai menulis di formulir pemesanan selanjutnya secara otomatis data pembeli akan langsung dikirim ke email Anda.

Bagi yang ingin mencobanya berikut caranya:

1. Login ke Admin WordPress anda.
2. Pada sisi kiri halaman  klik menu [Post] > [Add New].
   
3. Dan akan tampil halaman ‘Add New Post’.
   
4. Silahkan mulai menulis pada mode [Visual] mengenai review singkat tentang produk yang Anda jual.
   
5. Jika sudah selesai, letakkan kursor pada akhir tulisan atau paragraf. Dan untuk membuat formulir pemesanan, klik tombol [Add a custom form].
   
6. Dan sesaat akan tampil halaman [Add a custom form].
   
7. Tampilan menu standar yang muncul terdapat Name, Email, Website dan Comment. Jika Anda tidak membutuhkan mereka, silahkan hapus saja dengan cara klik tanda [ - ].
   

   menghapus field/menu

8. Dan untuk menambah menu menjadi seperti formulir pendaftaran, klik saja [Add new field]. Dan begitu seterusnya jika Anda hendak menambahkan menu lagi.
   

   menambah menu/field

9. Kemudian akan tampil pilihan menu.
   

   daftar menu/field

   Label: beri judul menu atau field.
   Field type: tipe menu atau field.

10. Pilih salah satu menu menurut kebutuhan Anda, jika menu itu wajib untuk dipilih atau diisi oleh pembeli silahkan beri tanda centang √ pada kolom [Required?].
    

    required

11. Setelah selesai klik tombol [Save this field].
12. Atur posisi menu atau field dengan cara klik [move] dan lakukan drag and drop.
13. Dan jika formulir pemesanan telah selesai Anda buat, klik tombol [Add this form to my post].
14. Apabila terjadi kesalahan dan Anda ingin mengedit formulir pemesanan tersebut, klik kembali icon [Add a custom form].
    
15. Selanjutnya klik tombol [Save Draft] bila anda ingin menyimpannya dulu atau klik tombol [Publish] bila anda ingin menampilkannya pada halaman blog anda.
    

Fungsi field:

1. Checkbox: menu atau field yang memungkinkan pengguna untuk memilih option.
2. Drop down: menu atau field yang memungkinkan pengguna untuk memilih satu option dari beberapa list.
3. Email: menu atau field khusus untuk memasukan email.
4. Radio: menu atau field yang memungkinkan pengguna untuk memilih satu option dari beberapa option.
5. Text: menu atau field yang memungkinkan pengguna untuk memasukan text dalam jumlah terbatas.
6. Textarea: menu atau field yang memungkinkan pengguna untuk memasukan text dalam jumlah yang tidak terbatas.
7. Website: menu atau field khusus untuk memasukan alamat website.

Contoh Formulir Pemesanan

[contact-form]

Tidak hanya itu pula, selain memberi akses penuh terhadap custom CSS WordPress juga memberi fitur Font Editor dari TypeKit. Dimana Anda berhak memilih 50 jenis huruf yang disediakan oleh TypeKit untuk blog pribadi Anda. Eit… fitur istimewa ini tidak diberikan cuma-cuma. Untuk memperoleh fitur keren ini Anda harus rela merogoh kocek dompet Anda. 2 fitur ini bisa Anda upgrade dari dashboard Anda dengan biaya $30 per tahunya.

Saya tahu apa yang Anda pikirkan, karena Saya sewaktu pertama mendengar kabar ini yang terlintas adalah, “Apakah juga bisa memasang iklan JavaScript dan iFrame?“. Setelah Saya cek pihak WordPress belum berkata apa-apa soal ini. Kalau menurut Saya sendiri bebas mengakses CSS belum tentu bisa memasang iklan. Karena area tersebut hanya untuk kumpulan coding kerangka tema. Dan bukan untuk meletakkan kode iklan.

Dan full akses yang diberikan WordPress maksudnya cuma untuk Stylesheet Editor.

Karena fitur ini hanya dimiliki jika kita meng-upgradenya dan berbayar, jadi Saya tidak perlu untuk menjelaskannya secara terperinci. Namun jika Anda penasaran dan ingin mencobanya, silahkan meluncur ke [Appearance] > [Custom Design]. Dari situ Anda bisa mencobanya, namun hanya sekedar mencoba dan melihat previewnya saja. Dan tidak bisa disimpan.

Example of Custom Design landing screen.

credit image: leaguelineup.com

Perkembangan WordPress kian hari semakin pesat. Banyak fitur yang ditambahkan dalam platform yang anti JavaScript ini. Sehingga WordPress tidak tertinggal jauh dalam perkembangan trademark di dunia maya dengan platform blog lainnya.

Berikut Saya akan berbagi trick untuk menampilkan tombol follow twitter ke dalam WP.com Anda. Sebelum WordPress memberikan fitur ini, sungguh luar biasa susahnya bahkan bisa dibilang mustahil umtuk memasang tombol follow twitter ini. Karena tombol follow twitter menggunakan script iFrame dan JavaScript. Sedangkan 2 script itu merupakan pantangan bagi WordPress.com untuk disematkan didalam tubuhnya.

Tapi WordPress sendiri masih berbaik hati kepada Kita dan membuatkan shortcode-nya yang bisa dipasang pada wigets text, posts dan pages. Tampilan tombol follow twitter khusus ini tidak kalah bagus dengan tombol follow twiter yang memakai iFrame atau JavaScript.

Berikut ini tombol follow twitter yang disediakan WordPress:

Follow @bootingskoBlog
[/twitter-follow screen_name='bootingskoBlog' show_screen_name='no']

Follow @bootingskoBlog
[/twitter-follow screen_name='bootingskoBlog']

Follow @bootingskoBlog
[/twitter-follow screen_name='bootingskoBlog' show_count='yes']

Follow @bootingskoBlog
[/twitter-follow screen_name='bootingskoBlog' show_count='yes' text_color='00ccff']

Follow @bootingskoBlog
[/twitter-follow screen_name='bootingskoBlog' link_color='00ccff']

Follow @bootingskoBlog
[/twitter-follow screen_name='bootingskoBlog' button_color='grey']

Follow @bootingskoBlog
[/twitter-follow screen_name='bootingskoBlog' button_color='grey' show_screen_name='no' show_count='yes']

Follow @bootingskoBlog
[/twitter-follow screen_name='bootingskoBlog' button_color='grey' show_screen_name='yes']

Follow @bootingskoBlog
[/twitter-follow screen_name='bootingskoBlog' button_color='grey' show_screen_name='yes' show_count='yes']

Untuk memasangnya silahkan copy salah satu shortcode diatas sesuai keinginan Anda, jangan lupa paste-kan tanpa tanda [ / ] pada posts, pages atau widgets text. Kemudian ganti username yang dicetak merah dengan username Twitter Anda.

WordPress juga mengeluarkan fitur terbaru pada kotak komentar yang mana pemilik blog dan pembaca dapat meninggalkan komentar menggunakan akun FaceBook dan Twitter.

Jika suka dengan bootingskoBlog, jadilah follower Saya:

Follow @bootingskoBlog
Filed under: WordPress Trick Tagged: facebook, share, shortcode, twitter ]]> http://bootingskoblog.wordpress.com/2011/06/09/memasang-tombol-follow-twitter-di-wordpress-com/feed/ 19 bootingskoBlog