Anda di halaman 1dari 35

1 INSTALASI XAMPP SERVER (SERVER LOKAL)

XAMPP adalah salah satu jenis software yang berfungsi untuk membuat server lokal. XAMPP
merupakan kumpulan dari beberapa perangkat lunak (Apache, MySql, PHP, dan Perl) yang
dijadikan menjadi satu paket sehingga mempermudah pembuatan server lokal tanpa harus
menginstall perangkat lunak default secara terpisah dan mengkonfigurasi ulang masing-masing
perangkat lunak tersebut.
Bayangkan XAMPP ini sebagai rak dari sebuah website. Website terbentuk dari kumpulan
kode dan kumpulan data yang disimpan di database. Maka perlu wadah untuk menampung data
di database dan wadah untuk menampung kode program. XAMPP bertugas untuk menampung
hal tersebut. XAMPP juga bertugas untuk mengkesusi kode halaman web yang di request oleh
pengguna dan memberikan respon balik (menyuguhkan resource seperti kumpulan data dan
tampilan halaman web) atas request tersebut.
Singkatnya, XAMPP akan menampung database, kode program, resource (video, image, dll)
dan memberikan respon terhadap setiap permintaan pengguna. Contohnya, ketika pengguna
meminta halaman dashboard dan data-datanya, maka XAMPP akan merespon dengan
memberikan informasi berupa halaman dashboard dan data-data yang diminta oleh pengguna.
Sebelum kita membuat web pada pelatihan ini, maka pertama lakukan instalasi XAMPP
terlebih dahulu untuk menampung web yang akan kita bangun nanti. Langkah-langkah untuk
menginstall XAMPP antara lain sebagai berikut:
1. Download XAMPP dari https://www.apachefriends.org/download.html atau copy dari
flashdisk yang disediakan oleh panitia.
2. Klik kanan dan pilih “Run as Administrator” pada file instalasi xampp yang
didownload atau dicopy dari panitia.

3. Selanjutnya akan muncul logo bitnami seperti pada gambar berikut.

4. Tunggu logo bitnami menghilang dan muncul tampilan warning seperti dibawah ini:

5. Klik OK pada tampilan warning tersebut.


6. Klik next setelah muncul tampilan berikut:
7. Klik next setelah muncul tampilan berikut:

8. Setelah muncul tampilan berikut, pastikan folder instalasi tidak berada di dalam
“C:/Program Files”. Apabila sudah dipastikan, klik Next.

9. Setelah muncul tampilan seperti pada gambar berikut, hilangkan tanda centang pada
untuk melewati beberapa proses pembelajaran menggunakan bitnami. Setelah itu klik
Next.
10. Klik Next setelah muncul tampilan seperti berikut:

11. Tunggu proses instalasi selesai.

12. Klik finish setelah muncul tampilan seperti berikut ini:


13. Klik “Yes” apabila muncul dialog UAC.
14. Setelah muncul tampilan seperti pada gambar berikut, pilih bendera America untuk
menggunakan bahasa Inggris, kemudian klik “Save”.

15. Setelah muncul tampilan seperti berikut, klik Start pada Apache untuk menjalankan
server web dan Start pada MySql untuk menjalankan database.

16. Apabila Apache dan MySQL berhasil dijalankan, tampilan background pada module
apache dan mysql akan berubah menjadi hijau seperti pada gambar berikut.

17. Buka web browser, kemudian ketikkan http://localhost. Apabila muncul tampilan
seperti pada gambar berikut, maka dapat diartikan bahwa proses instalasi XAMPP
sukses dan apache server telah berjalan.
18. Buka tab baru, kemudian ketikkan http://localhost/phpmyadmin/. Apabila muncul
tampilan seperti pada gambar berikut, maka dapat diartikan bahwa apache server dan
server database mysql telah berjalan.

2 MEMBUAT BASISDATA
Sebelum membuat website, maka hal yang paling penting untuk dilakukan adalah membuat
basis data (database). Fungsi dari database ini adalah untuk menyimpan data. Data yang
disimpan dapat berupa artikel, judul artikel, tag artikel, komentar maupun data-data penting
yang lain yang berhubungan dengan sistem default dari wordpress.
Pada bab sebelumnya, telah dijelaskan untuk menandai bahwa server database berjalan, maka
buka web browser dan ketikkan http://localhost/phpmyadmin. Maka akan muncul dashboard
database MySQL seperti pada gambar di bawah ini:

Hal ini menandakan bahwa database MySQL telah aktif. Setelah memastikan hal ini,
selanjutnya ikuti langkah-langkah berikut untuk melakukan setting database awal sebagai
database dari web yang akan kita buat:
1. Klik tab “Basis data” sehingga tampilan berubah menjadi seperti pada gambar berikut:
2. Buat basis data baru dengan mengisikan nama basis data pada kolom nama basis data.
Dalam contoh yang akan kita buat, nama basis datanya akan kita ganti menjadi
“data_webku”. Selanjutnya klik tombol “Buat” untuk membuat database baru dengan
nama “data_webku”. Perhatikan gambar dibawah ini:

3. Setelah database dibuat, maka database baru akan terlihat pada window navigasi tabel
seperti pada gambar berikut:

4. Dengan demikian, maka database baru dengan nama “data_webku” telah berhasil
dibuat. Catat baik-baik nama databasenya untuk keperluan di tahap selanjutnya.
3 INSTALASI WORDPRESS
Pernah melakukan blogging menggunakan wordpress secara online? Ternyata wordpress
menyediakan versi offline juga. Wordpress offline digunakan ketika kita hendak membuat
website yang memberikan akses kustomisasi lebih lengkap kepada pengembang website
apabila dibandingkan dengan wordpress online. Selain itu kita dapat menghosting dan
mengupload website yang telah kita buat ke tempat hosting website manapun.
Wordpress ini salah satu contoh dari CMS (Content Management System). CMS adalah
aplikasi perangkat lunak atau program yang berhubungan untuk membuat dan mengelola
konten digital. Apakah ada contoh lain dari CMS selain Wordpress? Tentu saja ada. Contohnya
adalah Joomla dan Drupal. Kedua CMS tersebut juga dapat digunakan untuk membuat website
secara offline terlebih dahulu. Namun, diantara tiga CMS tersebut, wordpress merupakan yang
paling user-friendly untuk pengguna yang masih awan dan amatir. Oleh karena itu, wordpress
akan digunakan untuk pengenalan pengembangan website secara offline terlebih dahulu dalam
pelatihan ini.
Yang terpenting adalah bahwa kita tidak harus pandai pemrograman untuk membuat website
menggunakan wordpress offline. Asalkan mengikuti instruksi dan tutorial pada modul ini,
maka hal tersebut mungkin untuk dilakukan. Namun untuk mengkustomisasi hingga bagian
yang sangat detil pasti memerlukan kemampuan pemrograman secara teknis.
Adapun instruksi untuk menginstal wordpress offline antara lain adalah sebagai berikut :
1. Pastikan XAMPP telah terinstall.
2. Download wordpress dari https://wordpress.org/download/ atau langsung copy dari
Flashdisk panitia.

3. Setelah itu extract wordpress yang masih dalam bentuk zip tersebut di directory
instalasi XAMPP, tepatnya di folder htdocs dalam directory instalasi XAMPP.
4. Rename folder tersebut sesuai dengan nama yang kita inginkan. (jangan menggunakan
tanda baca ataupun spasi) misalnya, ubah nama folder tersebut menjadi “webku”

5. Buka web browser, kemudian ketikkan http://localhost/{nama_folder}, dalam hal ini


karena kita menggunakan “webku” sebagai nama folder, maka ketikkan
http://localhost/webku sehingga muncul tampilan seperti pada gambar dibawah ini:

6. Setelah muncul tampilan seperti pada gambar di atas, klik “Let’s go”
7. Tampilan akan berubah seperti pada gambar di bawah ini:

8. Isikan nama database, username, password, host dari database, dan prefix dari tabel.
Database name dapat diisi dengan nama dari database yang telah kita buat pada bab
sebelumnya, contohnya yaitu “data_webku”. Ingat! database name ini harus sama
persis namanya dengan nama database yang pernah kita buat. Untuk tahap pemula,
database cukup diisi dengan root dan kosongkan passwordnya, karena pada tahap
sebelumnya kita tidak melakukan setting akun database. Database host diisi dengan
localhost, karena database yang kita buat berada di local komputer alias PC kita sendiri.
Table prefix defaultnya akan berisi wp_. Fungsi dari table prefix ini adalah memberikan
imbuhan awal pada nama tabel dalam database yang dibuat secara otomatis oleh web
yang kita buat dengan wordpress ketika kita sedang mengkonfigurasi web tersebut.
Perhatikan contoh di bawah ini:
9. Selanjutnya klik tombol “Submit” untuk mengkonfigurasi web lebih lanjut. Tampilan
web akan berubah seperti pada gambar berikut :

10. Untuk menginstall, klik tombol “Run the Installation”. Maka tampilan akan berubah
seperti pada gambar berikut:

11. Isikan judul website pada kolom Site Title, Username pada kolom usename, password
pada kolom password, dan email pada kolom email. JANGAN MELUPAKAN
PASSWORD YANG SUDAH DIBUAT! Perlu diperhatikan bahwa sebaiknya
password harus aman dengan memastikannya pada tingkat medium atau strong.
12. Klik “Install Wordpress”. Apabila instalasi sukses, maka tampilan akan berubah seperti
pada gambar berikut:

13. Klik “Log In” untuk masuk ke halaman login dari website. Tampilan akan berubah
seperti pada gambar berikut:
14. Isikan username dan password sesuai dengan apa yang telah diisikan pada tahap ke 11.
Lalu klik “Log In”.

15. Apabila anda berhasil masuk ke panel “dashboard”, maka ini merupakan indikasi
bahwa website telah terinstall dengan baik dan benar.

16. Untuk melihat tampilan website anda saat ini, arahkan mouse ke tombol navigasi “Web
Profile”, kemudian pilih “Visit Site”.
17. Maka kita akan mengunjungi tampilan default website yang telah kita buat.

18. Selamat! Anda sudah selangkah berhasil untuk membuat website baru. Untuk kembali
ke halaman admin, cukup ketikkan kembali http://localhost/{nama_folder}/wp-admin/.
Nama folder di sini maksudnya adalah nama folder yang digunakan untuk tempat
penyimpanan kode web yang telah dibuat (di dalam folder htdocs). Pada kasus
sebelumnya nama folder ini adalah webku. Lihat pada langkah ke 4. Sehingga yang
perlu diketikkan pada address bar web browser adalah http://localhost/webku/wp-
admin/. Setelah itu anda akan kembali lagi ke halaman dashboard apabila batas waktu
sesi login (session) belum habis. Namun apabila sesi login telah habis anda akan
diarahkan kembali ke halaman login.

Perlu diketahui bahwa halaman admin berfungsi untuk mengatur website yang telah kita buat.
Semisal untuk menambahkan artikel, mengganti tema, mengganti judul, dan lain-lain. Segala
aktivitas yang berhubungan dengan manipulasi konten dan tampilan website akan dilakukan di
halaman admin.

4 KOMPONEN HALAMAN ADMIN (ADMIN PAGE)


Setelah proses instalasi wordpress selesai, maka website dapat diakses secara offline. Caranya:
1. Buka web browser
2. Cek kembali nama folder yang telah dibuat untuk menyimpan kode web sebelumnya
3. Pada halaman web browser, ketikkan http://localhost/{nama_folder}. Perlu diingat
bahwa {nama_folder} perlu untuk disesuaikan/diganti dengan nama folder yang
digunakan untuk tempat penyimpanan kode web yang telah dibuat.
4. Selanjutnya website akan muncul pada web browser yang telah dibuka.
5. Untuk membuka halaman admin maka ketikkan http://localhost/{nama_folder}/wp-
admin. Ingat! Ganti {nama_folder} dengan nama folder yang digunakan untuk tempat
penyimpanan kode web yang telah dibuat.
Setelah memasuki halaman admin, tentu anda akan melihat banyak menu. Mari kita kupas satu
per satu. Secara garis besar, tampilan Dashboard WordPress dibagi menjadi dua bagian. Bagian
kiri [menu utama] dan bagian kanan [widget]. Pada artikel ini yang akan kami bahas adalah
bagian kiri, yaitu menu utama Dashboard WordPress.

Menu Utama [kiri]


1. Dashboard
 Home adalah tampilan utama dari dashboard WordPress seperti gambar diatas
 Updates adalah halaman informasi pembaharuan versi WordPress, themes, dan
plugins
2. Posts
 All Posts adalah list semua artikel yang sudah dibuat sebelumnya
 Add New adalah menu untuk membuat artikel baru
 Categories adalah menu untuk membuat kategori baru
 Tags berfungsi untuk pengelompokan artikel seperti kategori, tetapi dibuat lebih
bebas. Tags juga berfungsi untuk mempertajam SEO website
3. Media
 Library adalah kumpulan media [gambar, video, audio] yang sudah diupload
 Add New adalah menu untuk upload media [gambar, video, audio]
4. Pages
 All Pages adalah list page/halaman yang sudah dibuat sebelumnya. Pages ini biasa
digunakan untuk membuat halaman disamping home, seperti kontak, galeri,
Privacy Policy, dan sebagainya
 Add New adalah menu untuk membuat halaman baru
5. Comments
Adalah menu untuk moderasi komentar-komentar yang masuk diwebsite. Dari menu
ini kita bisa menyetujui komentar agar tampil diwebsite, membalas komentar, menandai
sebagai spam, atau menghapus komentar
6. Appearance
 Themes. Pada menu ini Anda bisa upload, mengaktifkan, atau menghapus tema
 Customize. Menu ini digunakan untuk standar mengatur website WordPress. Mulai
dari Title, Tagline, sampai layout. Didalam menu ini akan ada banyak submenu,
tergantung tema yang digunakan
 Widgets digunakan untuk menambah widget pada website WordPress
 Menus digunakan untuk mengatur tata letak halaman yang sudah dibuat
sebelumnya dimenu pages. DiMenus ini Anda juga bisa membuat halaman yang
diarahkan ke eksternal link
 Themes Editor digunakan untuk edit tema bagi Anda yang terbiasa dengan kode
PHP dan CSS
7. Plugins
 Installed Plugins. Pada menu ini Anda bisa melihat list plugin yang sudah diinstall.
Anda juga bisa install/upload, setting, atau menghapus plugin
 Add New digunakan untuk install atau upload plugins
 Plugin Editor digunakan untuk edit plugin, bagi Anda yang terbiasa dengan kode
PHP dan CSS
8. Users
 All Users adalah list semua user login dashboard WordPress. Dimenu ini Anda bisa
mengelola [menambah user, edit user, mengubah role user] user login
 Add New digunakan untuk menambah user baru
 Your Profile adalah user Anda yang saat ini digunakan login dashboard WordPress.
Dimenu ini Anda bisa mengubah profile Anda sendiri
9. Tools [Tool untuk pengguna lanjutan]
 Import. Menu ini digunakan untuk import konten dari sumber lain kedalam website
WordPress. Seperti import konten dari Blogspot, dari blog WordPress.com, dari
Tumblr dan lainya
 Export. Menu ini digunakan untuk export konten website Anda menjadi format
XML. Anda bisa memilih export semua konten, atau post/pages/media saja
 Site Health. Menu ini akan menunjukkan informasi penting tentang konfigurasi
website WordPress dan item-item yang memerlukan pemeriksaan
 Export Personal Data. Mulai WordPress 4.9.6 ada fitur untuk mengarsipkan data
pengguna berupa format .zip
 Erase Personal Data. Digunakan untuk menghapus data pengguna
10. Settings
 General. Menu ini digunakan untuk mengatur Title, Tagline, Url website,
Timezone, format waktu, bahasa dan user role
 Writing. Menu ini digunakan untuk mengatur default kategori saat artikel tidak
memakai kategori
 Reading. Menu ini digunakan untuk mengatur tampilan home page website antara
artikel terakhir atau halaman statis. Selain itu digunakan untuk menampilkan
berapa banyak artikel didalam satu halaman
 Discussion. Menu ini digunakan untuk mengatur artikel detault dan komentar
 Media. Menu ini digunakan untuk mengatur ukurang thumbnail gambar yang
diupload dan juga format upload kedalam hosting [tahun/bulan/]
 Permalink. Digunakan untuk mengatur permalink website. Contoh:
http://rumahweb.com/sample-post lebih bagus dari pada
http://rumahweb.com/?p=123
 Privacy. Menu ini digunakan untuk megnatur Privasi untuk website
11. Collapse menu

Collapse menu pada dashboard WordPress digunakan untuk menyembunyikan


keterangan menu dan akan menampilan icon-icon kecil agar lebih ringkas.
5 MEMBUAT WEB PROFIL SEDERHANA
Dengan bekal pengetahuan pada bab sebelumnya, mari kita mencoba untuk membuat sebuah
website profil sederhana.

5.1 MENGUBAH THEME TAMPILAN


Pertama mari kita mencoba untuk mengubah theme tampilan wordpress dari theme default
menjadi theme yang lebih unik dan indah. Ikuti instruksi-instruksi berikut ini:
1. Klik Appearance, kemudian klik Themes pada menu utama. Maka pada bagian widget
akan muncul beberapa opsi theme default. Kita dapat memilih salah satu dari theme
tersebut untuk mengubah tampilan website kita.

2. Untuk mengubah theme saat ini menjadi theme yang lain, maka arahkan mouse ke salah
satu theme yang ada, hingga muncul tombol activate. Kemudian klik Activate untuk
mengaktifkan theme yang dipilih.

3. Cobalah lakukan langkah ke 2 pada salah satu theme, kemudian buka tab baru pada
browser dan ketikkan http://localhost/{nama_folder}  http://localhost/webku. Maka
tampilan website yang semula serba putih kini berubah.

4. Apabila ingin menambahkan theme baru, kembali ke halaman admin kemudian lakukan
kembali langkah 1. Setelah itu pilih “Add New”
5. Maka tampilan akan berubah seperti pada gambar di bawah ini:

Apabila anda terkoneksi dengan internet, maka akan muncul banyak pilihan theme yang
disediakan oleh wordpress. Pada bagian atas juga terdapat opsi Upload Theme apabila
anda sudah memiliki theme wordpress yang anda buat sendiri ataupun anda download
dari internet. Kali ini pilih Upload Theme.
6. Akan muncul tampilan seperti pada gambar berikut.

Pilih Choose File, kemudian pilih theme yang sudah disediakan oleh panitia.
Kemudian klik Open.

7. Pilih install now.


8. Tunggu proses instalasi selesai, lalu klik Activate.

9. Cek kembali halaman website anda. Tampilan akan berubah menyesuaikan theme yang
baru.

5.2 MEMBUAT KATEGORI POSTING


Theme website telah berubah. Selanjutnya mari kita mencoba untuk mengelola konten
menggunakan fasilitas yang disediakan oleh wordpress. Salah satunya adalah kategori.
Kategori berkaitan erat dengan postingan pengguna. Pada umumnya setiap artikel yang dipost
oleh pengguna diperkenankan untuk memasuki satu atau lebih kategori. Dalam hal ini, kategori
dimaksudkan untuk mempermudah klasifikasi artikel berdasar konten. Misalnya terdapat
beberapa artikel yang membahas tentang kesehatan sapi, ayam, kambing, etc dan kesehatan
buah mangga, jambu, belimbing,etc. Maka kita dapat menyimpulkan bahwa beberapa artikel
tersebut dapat dibagi menjadi dua jenis berdasarkan konten artikel tersebut yaitu kesehatan
hewan dan kesehatan tumbuhan.

Dalam pelatihan kali ini kita akan mencoba membuat beberapa kategori yaitu:
 Ekstrakurikuler
 Prestasi
 Kegiatan
 Karya Ilmiah
 Slider
 Pengumuman
Untuk menambahkan kategori, maka ada beberapa hal yang perlu untuk di lakukan antara lain
sebagai berikut:
1. Pastikan anda berada pada halaman admin.
2. Pada menu utama klik Posts kemudian klik Categories. Maka tampilan pada widget
akan berubah seperti pada gambar di bawah ini:

3. Kita akan membuat kategori Ekstrakurikuler, maka pada kolom Name isikan
Ekstrakurikuler, kemudian pada kolom Description berikan penjelasan tentang
kategori tersebut seperlunya. Selanjutnya klik Add New Category.

4. Apabila kategori baru telah berhasil ditambahkan, maka kategori baru akan muncul
seperti pada gambar berikut:

5. Dengan langkah yang sama seperti pada langkah ke 3 dan 4, lakukan penambahan
kategori lainnya (Prestasi, Kegiatan, Karya Ilmiah, Slider, dan Pengumuman).

6. Proses penambahan kategori selesai. Tampilan akan terlihat seperti pada gambar
berikut ini:
5.3 MEMBUAT POSTINGAN BARU
Anda pernah melakukan aktivitas blogging? Apabila pernah, maka dengan wordpress sebagai
CMS, kita juga dapat melakukan hal yang sama. Kita dapat membuat artikel baru, menghapus
artikel lama, mengedit artikel yang pernah dibuat, dan mengatur artikel yang pernah ataupun
belum pernah dipublikasikan. Sebagai contoh dalam pelatihan ini, kita akan mencoba untuk
membuat sebuat postingan baru.
1. Pastikan saat ini halaman admin sedang terbuka.
2. Klik Posts pada menu utama, kemudian klik Add New. Maka pada bagian widget akan
muncul papan artikel yang dapat kita isi.

3. Isikan judul pada bagian Add title, kemudian tuliskan konten artikel pada bagian start
writing or type / to choose a block.

4. Untuk menambahkan konten berupa blok paragraph ataupun media lain seperti gambar,
audio, file, dsb, dapat dilakukan dengan cara klik icon “+” di pojok kiri atas.
5. Pilih Image untuk menambahkan gambar. Maka pada suntingan artikel, akan terlihat
seperti pada gambar berikut ini:

Blok gambar baru akan muncul, kemudian klik Upload untuk menambahkan gambar
baru.
6. Muncul upload dialog box. Selanjutnya pilih gambar dan klik Open.

7. Apabila gambar berhasil dipasang, maka tampilannya akan berubah seperti pada
gambar berikut ini:
8. Click pada bagian Document untuk mulai mengatur properti dari artikel.

9. Pilih kategori artikel. Kategori artikel yang dipilih boleh lebih dari satu. Misal,
diperbolehkan untuk memilih dua kategori artikel yaitu Ekstrakurikuler dan Slider.

Pilihan kategori Slider dipilih karena akan digunakan untuk tujuan membuat web
carousel. Sehingga semua artikel dengan kategori Slider akan muncul di web crousel.
Web carousel itu apa sih? Pertanyaan ini akan dijawab pada sub-bab berikutnya.
10. Klik Set featured image. Featured image adalah gambar yang mendeskripsikan
postingan, halaman, atau custom post type blog. Keberadaan gambar ini sangatlah
penting karena bisa menarik lebih banyak orang untuk mengunjungi situs Anda dan
membaca setiap konten yang ada di dalamnya. Selain itu, gambar fitur juga
merepresentasikan gagasan atau gambaran umum suatu konten. Setelah set featured
image di klik, maka akan muncul featured image dialog seperti pada gambar berikut:
11. Klik Select File, kemudian akan muncul dialog pemilihan gambar. Selanjutnya pilih
gambar yang akan digunakan sebagai Featured Image, kemudian klik open.

12. Selanjutnya akan muncul Featured Image dialog. Pilih gambar yang baru saja diupload,
kemudian klik Select.

13. Setelah gambar featured image dipilih, maka kolom featured image akan berubah
seperti pada gambar berikut:

14. Tambahkan tag agar mesin pencari seperti google lebih mudah untuk menemukan
artikel yang anda buat. Usahakan tag memiliki keterkaitan dengan konten artikel. Tag
dapat berupa kumpulan kata atau kumpulan kalimat pendek. Mereka dipisahkan dengan
tanda koma (,).
15. Klik publish untuk menerbitkan artikel atau postingan.

16. Setelah itu akan muncul tampilan konfimasi seperti pada gambar berikut:

Klik publish sekali lagi untuk menerbitkan artikel.


17. Apabila muncul tampilan seperti pada gambar berikut berarti artikel sudah berhasil
dipublikasikan:

Untuk melihat hasil publishnya, klik View Post.


18. Hasilnya akan terlihat seperti pada gambar berikut:
Sampai di sini, kita berhasil membuat postingan baru.

5.4 MEMBUAT CAROUSEL


Pernah mendengar istilah carousel? Pernah melihat gambar pada header website yang memiliki
tombol navigasi kanan dan kiri untuk menggeser gambar pada header sehingga gambarnya
berubah? Atau mungkin malah gambarnya bergerak sendiri berganti-gantian secara otomatis
dalam selang waktu tertentu? Ya, itulah yang kita sebut dengan istilah carousel.
Dalam pelatihan ini, kita memanfaatkan fitur yang telah disediakan oleh theme yang telah
tentukan pada sub-bab 5.1.
Caranya mudah. Ikuti langkah-langkah berikut:
1. Pastikan anda berada di halaman admin.
2. Klik Appearance, kemudian klik Customize.

Maka akan muncul tampilan kustomisasi theme secara mandiri seperti pada gambar di
atas.
3. Klik Home Setting.

4. Klik Slider Section


5. Centang pada bagian Enable Slider untuk mengaktifkan carousel, kemudian pilih
kategori yang ingin ditampilkan pada carousel melalui opsi yang tersedia pada
dropdown Slider Category. Sebenarnya bebas ingin pilih kategori yang mana, namun
dalam pelatihan ini, kita coba untuk menggunakan kategori Slider.

6. Kemudian klik Publish untuk menerbitkan perubahan tampilan.

7. Sekarang, coba buka tab baru di web browser, kemudian ketikkan pada addressbar
web browser http://localhost/{nama_folder} alias dalam pelatihan ini adalah
http://localhost/webku/. Maka kita akan melihat carousel di website kita.

Selamat, anda telah berhasil membuat web carousel!


5.5 MENGUBAH PROFIL IDENTITAS WEB
Judul web belum sesuai? Tagline juga belum sesuai? Tenang, bisa diatur. Anda bisa
mengubah judul maupun Taglinenya. Coba ikuti instruksi berikut ini:
1. Pastikan anda berada pada halaman admin.
2. Klik Settings pada menu utama. Kemudian klik General. Anda akan melihat
tampilan seperti pada gambar berikut:

3. Ganti kolom Site Title dan Tagline. Ubah Site Title menjadi SMAN 1 Girimarto,
kemudian ubah Tagline menjadi Wonogiri Sukses.

4. Setelah itu klik Save Changes untuk menyimpan perubahan.

5. Buka tab baru pada web browser, kemudian kembali akses http://localhost/webku.
Tampilan judul dan Tagline akan berubah sesuai dengan apa yang kita tulis pada
halaman setting general tadi.
Sampai di sini, ternyata masih ada kekurangan. Ketika kita mengakses halaman web, ternyata
favicon nya masih XAMPP.

Untuk mengganti favicon pada website ini, ikuti langkah berikut:


1. Pastikan anda berada di halaman admin.
2. Pilih Appearance pada menu utama, selanjutnya pilih customize

3. Pilih General Setting

4. Pilih Site Identity


5. Pilih Select Site Icon

6. Setelah muncul dialog select logo, klik Upload Files untuk menambahkan image baru,
kemudian klik Select Files.

7. Pastikan ukuran logo yang diupload simetris antara Panjang dan lebarnya. Setelah
muncul Open dialog pilih logo, kemudian klik Open.
8. Selanjutnya, pada dialog select logo, pilih logo yang baru saja di upload, kemudian klik
select.

9. Selanjutnya akan muncul dialog crop image. Sesuaikan ukuran image, kemudian klik
tombol crop image.

10. Perhatikan, image untuk favicon telah berubah.

Selamat, anda berhasil mengubah profil website anda.


5.6 MENAMBAHKAN PLUGIN
Plugin? Sering mendengar istilah ini? Tentu istilah ini sangat terkenal di dunia perkomputeran,
perkodingan, ataupun berbagai aktivitas lain yang melibatkan proses penambahan fungsi pada
program utama. Plug-in atau plugin adalah sebuah program komputer yang menambah
fungsionalitas sebuah program utama.
Fungsi utama wordpress adalah untuk mengatur konten materi website. Namun terkadang kita
membutuhkan fungsi-fungsi lain yang belum dipenuhi oleh wordpress secara default. Kita
dapat menambahkan fungsi-fungsi tambahan jika memerlukan. Di sinilah plugin berperan.
Plugin pada wordpress akan menambahkan fungsionalitas utama pada website. Contohnya,
mari kita buat animasi loading ketika menunggu halaman web muncul di layar browser. dengan
menggunakan plugin.
1. Cek halaman website anda dengan mengakses http://localhost/webku. Secara default di
halaman tersebut tidak ada animasi loading.
2. Setelah itu akses halaman admin melalui http://localhost/webku/wp-admin.
3. Pilih Plugin pada menu utama, kemudian klik Add New. Pada area widget, apabila
anda terkoneksi ke internet, akan muncul plugin-plugin yang dipublish oleh wordpress.

4. Klik Upload Plugin untuk menambah plugin baru yang akan diberikan oleh panitia.

5. Setelah muncul tampilan seperti pada gambar berikut, klik Choose File.
6. Pilih loading-page.zip (plugin yang diberikan oleh panitia). Kemudian klik open.

7. Pilih install now untuk menambahkan plugin baru.

8. Tunggu proses instalasi plugin selesai. Setelah selesai, klik Activate Plugin.

9. Anda akan diarahkan ke halaman Settings  Loading Page pada menu utama. Pilih
animasi loading page yang anda inginkan.

10. Klik Update Settings.


11. Cek kembali halaman website anda dengan mengakses http://localhost/webku. Apabila
muncul animasi loading maka artinya plugin loading-page telah berhasil
diimplementasikan.

5.7 MENAMBAHKAN HALAMAN


Selain dalam bentuk postingan artikel, kita dapat membuat konten berupa halaman web. Pada
umumnya konten berupa halaman ini dipakai ketika kita hendak membuat halaman yang
sifatnya statis. Contohnya kalau pada website sekolah, perusahaan, uni
5.8 MENAMBAHKAN NAVIGASI HALAMAN
Tidak ada website yang tidak memiliki halaman. Dengan jumlah halaman yang banyak,
pengguna web akan lebih mudah untuk memahami materi website apabila materi website
terstruktur dan halamannya diarahkan. Untuk menyusun materi website dibutuhkan navigasi
atau menu. Cara membuat menu ini mudah.