Pasang Plugin Nivo Slider di Wordpess

Kalau kemaren saya telah memberikan tutorial mengenai cara memasang nivo slider di website sendiri (tanpa CMS), nah kali ini saya akan mencoba berbagi tutorial bagaimana memasang plugin nivo slider pada wordpress.

Nivo slider adalah Jquery slide image yang di buat oleh dev7 studios suatu perusahaan web design dan web development. Nivo slider adalah Jquery slide image yang paling banyak di gunakan di dunia, mudah di gunakan dan mudah di customize. Selain itu Nivo Slider banyak mendukung CMS terkenal dunia seperti WordPress dan Drupal. Untuk tahu lebih banyak tentang Nivo Slider silahkan kunjungi websitenya di sini.

salah satu contoh slider 

Buka Dashboard WordPress anda kemudian klik Plugins–>Add New untuk menambahkan Plugin WP Nivo Slider. Masukan nama Plugin wp nivo slider kemudian cari.

Akan muncul beberapa nama plugin serupa, pastikan kamu memilih WP Nivo Slider karya Rafael Cirolini

Selanjutnya klik Install untuk melakukan instalasi plugin WP Nivo Slider.

Proses instalasi plugin

Klik activate plugin untuk mengaktifkan plugin Nivo Slider yang baru saja kita instal. Nah, sekarang plugin Nivo Slider telah aktif di wordpress anda. Langkah selanjutnya adalah membuat kategori.

• Masuk ke Post > Categories > Add New Category

tambah kategori

Selanjutnya, buatlah postingan baru dan tambahkan gambar /add media. Upload gambar kemudian  setting sebagai  use as featured images seperti di bawah ini, save - close windows. Checklist kategori movie pada lakukan juga pada post lain yang anda inginkan di tampilkan dalam slider image.

Langkah selanjutnya masuk ke Settings–>WP Nivo Slider, setting WP Nivo slider seperti gambar berikut.

Nivo Slider setting

• Category –> Pilih Kategori sesuai dengan 2 post yang sudah anda buat tadi yaitu di bawah kategori slider.
• Number Of Slices –> saya membiarkan dalam posisi default yaitu 5 slices
• Type of Animation –> Pilih efek animasi yang anda inginkan ada random, slide down, slice up, fold, fade dll. Dalam tutorial ini saya menggunakan efek fade.
• Ukuran Gambar –> Buat ukuran gambar sesuai dengan template anda, dalam contoh ini saya membuat ukuran 400×200.

Edit file index.php dari template wordpress yang aktif, dalam contoh ini saya menggunakan template bawaan dari WordPress yaitu twentyeleven struktur direktorinya ada di wp-content–>themes–>twentyeleven–>index.php.

Kemudian tambahkan code berikut di index.php anda setelah <div id="content" role="main">:

<?php if ( function_exists('show_nivo_slider') ) { show_nivo_slider(); } ?>

Kemudian save index.php yang sudah anda edit. Nah, sekarang untuk melihat hasilnya. klik visite site. Jrengg,, ini dia nivo slider yang baru kita buat tadi. Ini menggunakan template standar "tweenty eleven"

Anda bisa edit ukuran gambar dan css sesuai yang anda inginkan agar mendapatkan tampilan yang lebih memuaskan. Silahkan explore Nivo dan WordPress