ART MEAN

MEMBUAT HEADER WORDPRESS MENJADI

SLIDESHOW/SLIDER
OLEH:
AMI ARIEF GUNAWAN PUTRA

Pada percobaan kali ini, saya mencoba menjabarkan tutorial yang saaaaaaaaangat biasa. Cara mengubah
header CMS wordpress yang biasanya statis menjadi dinamis atau slideshow.
Saya asumsikan kita sudah menginstal CMS wordpress. Jadi hanya perlu menginstal plugin dan melakukan
sedikit konfigurasi pada CMS.
Untuk melakukan percobaan ini, saya menggunakan:
1. WordPress-V.3.9.1. (menggunakan theme twenty fourteen)
2. Plugin Responsive Header Image Slider-V.1.1.
Langkah-langkah:
1. Download dan install plugin responsive header image slider.
2. Copy kode program berikut pada file wp-content -> themes -> twentyfourteen -> header.php:
<div class="headerslider"> <?php echo do_shortcode('[sp_responsiveslider limit="-1"]'); ?></div
>

3. Jika anda ingin memasukkan slideshow/slider ke dalam sebuah page atau posting, maka anda cukup
meletakkan short-code ini pada saat mengisi page atau postingan anda:
[sp_responsiveslider limit="-1"]

4. Menambahkan gambar dapat melalui dashboard -> Responsive Image Slider. Tapi kalau boleh jujur
percobaan menggunakan user interface ini hasilnya cacat. Namun jangan khawatir, #keepReading.
5. Menambahkan gambar secara manual (tampilan slider menggunakan cara ini tidak cacat):

Masuk ke folder wp-content -> plugins -> responsive-header-image-slider -> img.

converted by Web2PDFConvert.com
 Copy beberapa calon foto slider anda ke dalam folder tersebut. Usahakan ukurannya 1260 x
240.
Sekarang buka wp-content -> plugins -> responsive-header-image-slider -> responsive-
headerimageslider.php.
Pada file itu, search: 1.png.
nanti ketemu: 1.png, 2.png, 3.png. Ganti dengan nama calon foto slider yang sudah di-copy tadi.

6. Sekarang masuk ke Setting -> Responsive Slider Setting. Lakukan sedikit konfigurasi sembari
memejamkan mata.

7. Buka url web yang baru saja anda setting. Pelan-pelan ya jangan buru-buru. Tadaaaaaa ! Elegan ya.. ini
theme gratisan wordpress yang paling saya suka. Twenty Fourteen. Serasa theme premium. Menghadirkan
nuansa user experience yang baru #udik. Sekali lagi, Twenty Fourteen. Last.. Twenty Fourteen.
Ξ\(´ `)/ξ

Notes:
Bagi yang tidak berhasil, periksa dan pastikan sepasti-pastinya bahwa langkah no.2 anda tidak keliru. Kalau
tidak keliru, periksa langkah 3 anda. Tidak keliru juga? periksa langkah no.5 anda.
Kalau sampai tidak salah juga, saya sarankan, anda mengingat-ingat kesalahan anda dalam waktu
dekat ini, siapa tau anda menyakiti perasaan orang lain, melalaikan kewajiban, membunuh
serangga, memberi harapan palsu, dan mempersulit orang lain.
Sekian dari saya. Kalau ada masukkan, mohon langsung menuju kolom komentar di bawah yah. Mohon
maaf, sekian, terima kasih.

Report this ad Report this ad

SHARE THIS:

 Twitter  Facebook 2

Memuat...

converted by Web2PDFConvert.com
 TERKAIT

Plugin Bootstrap untuk Wordpress

WARISAN, MASALAH, TINDAKAN PREVENTIF, SOLUSI

WISATA PROFESI

KENIKMATAN TERTINGGI

TIPS MEMBUAT COMPANY PROFILE YANG BAIK, MENARIK DAN BERKARAKTER

24 THOUGHTS ON “MEMBUAT HEADER WORDPRESS MENJADI

SLIDESHOW/SLIDER”
GUMIHO BERKATA:
30 APRIL 2017 PUKUL 19:28

Ini wordpress.com atau wordpress.org?

AY13V BERKATA:
6 MEI 2017 PUKUL 15:03

wordpress.com
AY13V BERKATA:
6 MEI 2017 PUKUL 15:05

tapi yang dipakai praktek download dari wordpress.org. (CMS wordpress offline)
TGSTOUR201 BERKATA:
19 OKTOBER 2016 PUKUL 21:12

thanks pencerahannya min

RIZKI SEPTINA BERKATA:
11 OKTOBER 2016 PUKUL 12:11

makasih infonya ya gan.. simple dan sangat membantu

ALMAIKASTOREZ BERKATA:
16 SEPTEMBER 2016 PUKUL 00:06

Ane coba ah… makasih gan atas pencerahan nya..

BIRO UMROH TANGERANG BERKATA:
15 SEPTEMBER 2016 PUKUL 11:25

top booo thanks banget..

ANONIM BERKATA:
31 AGUSTUS 2016 PUKUL 21:05

converted by Web2PDFConvert.com
tks gan, ilmunya sangat bermanfaat. saya mau tanyak ni. keterangan di atas kan buat 1 slider, kalau buat 2
slider kanan kiri di header bisa gak gan…? tks
YOHAN BERKATA:
10 JUNI 2016 PUKUL 08:57

ribet juga ya gan, kalo gak biasa sama bahasa program, baru lihat yang beginian udah kliengan gan. tapi
bagus juga nih harus di coba.
NANANG ISMAIL BERKATA:
26 FEBRUARI 2016 PUKUL 09:25

Ini yang ane cari. Tapi sayangnya gak punya localhost ….

HANA MATZSUKI BERKATA:
28 SEPTEMBER 2015 PUKUL 14:02

terima kasih, saya berhasil buat slideshownya…..sangat bermanfaat sekali

WALIDIN BERKATA:
8 SEPTEMBER 2015 PUKUL 19:07

bisa di coba nih tutorialnya di local host

JASA DOMAIN HOSTING PAKET WEBS BERKATA:
25 JULI 2015 PUKUL 22:41

Sangat membantu sekali makasih gan

BELLAPHARERAA BERKATA:
9 JULI 2015 PUKUL 11:51

suliiiiiitttt
AW BERKATA:
23 JUNI 2015 PUKUL 11:02

mas ini wp-content -> plugins -> responsive-header-image-slider -> img. itu masuknya lewat mana??
TITI ARIMBA BERKATA:
7 JUNI 2015 PUKUL 14:24

di wordpress saya gambar slideshow nya ga muncul, cuma tampilan putih aja, padahal udah diikuti tata cara
nya. kenapa ya?
btw, sy pake tema WEN corporate, atau emang tema saya pakai itu ga compatible sama pluginnya ya? kalau
iya apa ada solusi lain?
ANONIM BERKATA:
28 APRIL 2015 PUKUL 14:27

mas, kadang suka tidak berfungsi dibeberapa theme ya slidernya?

AY13V BERKATA:
17 MEI 2015 PUKUL 21:47

ya. di twentyfourteen sendiri kadang suka bug. saya belum tau akar masalahnya di mana. di situ
kadang saya turut berduka cita.
AHMADNUCH27 BERKATA:
7 APRIL 2015 PUKUL 15:59

Reblogged this on ahmadnuch27 and commented:

ini yang ku cari

converted by Web2PDFConvert.com
 AY13V BERKATA:
17 MEI 2015 PUKUL 22:09

Wahhh…!! terima kasih banyak ya.. sudah di re-blog :D, semoga bermanfaat dan selamat berkarya.
JASA PEMBUATAN WEBSITE BERKATA:
3 APRIL 2015 PUKUL 21:09

Mantap bagus banget artikelmya terimakasih ya gan

AY13V BERKATA:
17 MEI 2015 PUKUL 21:50

Sama-sama gan
SHITTYFOLKS BERKATA:
26 FEBRUARI 2015 PUKUL 22:17

Kalau masih gratisan themenya bisa edit html ya mas? Gak mudeng euy
AY13V BERKATA:
17 MEI 2015 PUKUL 22:03

Bisaaa, asal instal CMS wordpress di localhost. kalau maksud kisanak ‘gratis’ di sini berupa blog
dengan url (contoh) “namabloganda.wordpress.com” ya jelas tidak bisa. Jadi, kalau pengen bisa,
anda googling terlebih dahulu dengan kata kunci “cara menginstall CMS wordpress offline”.

TINGGALKAN BALASAN

Ketikkan komentar di sini...

BUAT SITUS WEB ATAU BLOG GRATIS DI WORDPRESS.COM.

converted by Web2PDFConvert.com