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.
Akan muncul beberapa nama plugin serupa, pastikan kamu memilih WP Nivo Slider karya Rafael Cirolini
Selanjutnya klik Install untuk install plugin WP Nivo Slider.
Aktifkan Plugin WP Nivo Slider versi 2.0, proses install WP Nivo Slider sudah selesai anda akan mendapatkan Settings plugin ini di Settings–>WP Nivo Slider.
Masuk ke Posts–>Categories buat kategori baru misalkan slider, kategori ini nantinya akan menampung semua post yang akan anda tampilkan sebagai slide image.
Buat 2 postingan baru di bawah Kategori slider dan setting juga featured images seperti di bawah ini, 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.
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.
Tambahkan snippets code berikut di index.php anda
Instalasi Plugin WP Nivo 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 install plugin WP Nivo Slider.
Aktifkan Plugin WP Nivo Slider versi 2.0, proses install WP Nivo Slider sudah selesai anda akan mendapatkan Settings plugin ini di Settings–>WP Nivo Slider.
Setting WP Nivo Slider
Plugin sudah aktif sekarang bagaimana caranya agar bekerja sesuai keinginan dan enak di lihat di template wordpress yang sudah exist.Masuk ke Posts–>Categories buat kategori baru misalkan slider, kategori ini nantinya akan menampung semua post yang akan anda tampilkan sebagai slide image.
Buat 2 postingan baru di bawah Kategori slider dan setting juga featured images seperti di bawah ini, 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.
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 template wordpress yang aktif
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.Tambahkan snippets code berikut di index.php anda
<?php if ( function_exists('show_nivo_slider') ) { show_nivo_slider(); } ?>
Tampilan WP Nivo Slider
Sekarang saatnya untuk melihat hasil kerja anda, buka front end wordpress anda. berikut tampilan di wordpress saya
0 komentar:
Posting Komentar