Anda di halaman 1dari 54

LAPORAN AKHIR THREAD CASE STUDY (TCS)

KATEGORI DESAIN WEB


Website SMA NEGERI 3 KIKIM TIMUR
DENGAN MENGGUNAKAN WORDPRESS

Diajukan untuk Memenuhi Syarat Thread Case Study (TCS)


Program Pendidikan Komputer dan Internet
Profesional 1 Tahun
PalComTech

ADI WIJAYA
3116290003

PROGRAM PENDIDIKAN KOMPUTER DAN INTERNET


PROFESIONAL 1 TAHUN PALCOMTECH
LAHAT 2017
LEMBAR PERSETUJUAN
LAPORAN AKHIR THREAD CASE STUDY (TCS)

KATEGORI DESAIN WEB


Website SMA NEGERI 3 KIKIM TIMUR
DENGAN MENGGUNAKAN WORDPRESS

Penyusun : ADI WIJAYA


NIS : 3116290003

Laporan ini telah diperiksa dan siap diajukan untuk presentasi

Pembimbing TCS Koordinator Akademik,


Katergori Desain Web

Vivi Nilam Sari Abdul Rajab.SE


NIP : - NIP : -

ii
LEMBAR PENGESAHAN

KATEGORI DESAIN WEB


Website SMA NEGERI 3 KIKIM TIMUR
DENGAN MENGGUNAKAN WORDPRESS

Penyusun : ADI WIJAYA


NIS : 3116290003

Laporan ini telah diuji dan dipertanggungjawabkan dihadapan penguji


pada tanggal 09 Mei 2017

Penguji 1 Penguji 2

Dwi Ade Suryansyah, S.Kom Mei Sutrisno


NIP : - NIP : 44.PCT.09

Pimpinan PalComTech

Mei Sutrisno
NIP : 44.PCT.09

iii
HALAMAN MOTTO

Motto :
1. Mulailah melangkah, berpikir adalah faktor utama penghambat
keberhasilan.
2. Kaya bukan cuma soal materi, pengalaman merupakan
sesunggunya kekayaan sejati.
3. Pendidikan bukan hanya sekedar membaca ataupun menulis,
pendidikan adalah konsep pertemuan pendidikan terhadap
lingkungan.
4. Dream is a half success of real.

Ku persembahkanuntuk :
1. Allah SWT selalu menyertai dalam langkahku.
2. Ibu, Ayah dan saudara/saudari selalu memberi saya dukungan,
cinta, dan pengorbanan.
3. Seseorang yang spesial Miss Sita Handayani selalu medukung.
4. Pimpinan PalComTech Lahat Bapak Mei Sutrisno yang
mendukung dalam pembuatan laporan ini.
5. Pemimbing Miss Vivi Nilam Sari, terima kasih atas bimbingan,
saran dan nasihat.
6. Staff dan Instruktur PalComTech Lahat.
7. Teman seperjuangan dan almamater.
KATA PENGANTAR

iv
Puji syukur penulis panjatkan kepada Tuhan yang Maha Esa,
berkat rahmat dan karunia-Nya penulis dapat menyelesaikan laporan
(Thread Cases Study) TCS tepat pada waktunya. Laporan tugas akhir ini
yang berjudul “Desain Web SMA Negeri 3 Kikim Timur dengan
Menggunakan Wordpress” disusun untuk memenuhi persyaratan dalam
menyelesaikan program Professional 1 Tahun Pendidikan Komputer dan
Internet di PalComTech Lahat. Dalam kesempatan ini penulis
mengucapkan terima kasih kepada:
1. Bapak Mei Sutrisno selaku pimpinan PalComTech Lahat.
2. Miss Vivi Nilam Sari selaku pembimbing.
3. Staff dan Instruktur PalComTech Lahat.
4. Teman-teman seperjuangan khususnya kelas GSO29A.
Selama proses laporan ini, penulis menyadari banyak pihak yang
telah membantu proses pembuatannya dan juga menyadari laporan ini
masih jauh dari kata sempurna. Maka, penulis mengharapkan kritik dan
saran yang bersifat membangun untuk dapat menjadi lebih baik
kedepannya.

Lahat, Mei 2017

Penulis

DAFTAR ISI

HALAMAN JUDUL....................................................................... i
v
HALAMAN PERSETUJUAN........................................................... ii
HALAMAN PENGESAHAN........................................................... iii
HALAMAN MOTO DAN PERSEMBAHAN...................................... iv
KATA PENGANTAR...................................................................... v
DAFTAR ISI.................................................................................. vi
DAFTAR GAMBAR....................................................................... vii

BAB I PENDAHULUAN
1.1 Latar Belakang................................................................ 1
1.2 Tujuan dan Manfaat TCS................................................ 3

BAB II ANALISA DAN PEMBAHASAN


2.1 Analisa Project............................................................... 4
2.2 Pembahasan Project...................................................... 13

BAB III SIMPULAN DAN SARAN


3.1 Simpulan........................................................................ 37
3.2 Saran.............................................................................. 37

DAFTAR PUSTAKA

LAMPIRAN

RIWAYAT HIDUP

DAFTAR GAMBAR

Gambar 2.1 Tampilan Logo Google Chrome................................ 5


Gambar 2.2 Tampilan Logo WordPress....................................... 6

vi
Gambar 2.3 Tampilan Logo Adobe Photoshop............................ 9
Gambar 2.4 Tampilan Logo Yahoo.............................................. 10
Gambar 2.5 Tampilan Logo Idhstinger........................................ 11
Gambar 2.6 Tampilan Kerangka Website.................................... 13
Gambar 2.7 Tampilan Taksbar.................................................... 14
Gambar 2.8 Tampilan halaman depan yahoo............................. 14
Gambar 2.9 Tampilan Sign In...................................................... 15
Gambar 2.10 Tampilan Form Daftar............................................ 15
Gambar 2.11 Tampilan Verifikasi nomor telepon........................ 16
Gambar 2.12 Tampilan Kunci Akun............................................. 16
Gambar 2.13 Tampilan Sign In.................................................... 17
Gambar 2.14 Tampilan Halaman Depan Hostinger..................... 18
Gambar 2.15 Tampilan Login...................................................... 18
Gambar 2.16 Tampilan Form Daftar Akun Hostinger................... 19
Gambar 2.17 Tampilan Konfirmasi Akun di Yahoo...................... 20
Gambar 2.18 Tampilan Depan Hostinger.................................... 20
Gambar 2.19 Tampilan Order Web Hosting................................ 21
Gambar 2.20 Tampilan Checkout Order...................................... 21
Gambar 2.21 Tampilan Submit Order......................................... 22
Gambar 2.22 Tampilan Order berhasil........................................ 22
Gambar 2.23 Tampilan Aktivasi Akun di Yahoo........................... 23
Gambar 2.24 Tampilan Configurasi Order................................... 23
Gambar 2.25 Tampilan Pengaturan Order Hosting...................... 24
Gambar 2.26 Tampilan Konfirmasi Order Hosting sukses............ 24
vii
Gambar 2.27 Tampilan Web Hosting.......................................... 25
Gambar 2.28 Tampilan Auto Installer......................................... 25
Gambar 2.29 Tampilan Konfigurasi Instalasi WordPress............. 26
Gambar 2.30 Konfigurasi Instalasi WordPress Sukses................. 26
Gambar 2.31 Tampilan Konfirmasi Auto Installer di Yahoo......... 27
Gambar 2.32 Tampilan Login WordPress.................................... 28
Gambar 2.33 Tampilan Dashboard............................................. 28
Gambar 2.34 Tampilan Appearance Menu.................................. 29
Gambar 2.35 Tampilan Add News Themes................................. 29
Gambar 2.36 Tampilan Upload Themes...................................... 30
Gambar 2.37 Tampilan Choose File............................................. 30
Gambar 2.38 Tampilan Directory File.......................................... 31
Gambar 2.39 Tampilan Instal File................................................ 31
Gambar 2.40 Tampilan Active File.............................................. 32
Gambar 2.41 Tampilan Appearance Menu.................................. 32
Gambar 2.42 Tampilan Setting Themes...................................... 33
Gambar 2.43 Tampilan Add New Image...................................... 33
Gambar 2.44 Tampilan Select Files............................................. 34
Gambar 2.45 Tampilan Save & Publish....................................... 34
Gambar 2.46 Tampilan Pages..................................................... 35
Gambar 2.44 Tampilan Add New Page........................................ 35
Gambar 2.45 Tampilan Publish................................................... 36

viii
BAB I
PENDAHULUAN

1.1 LATAR BELAKANG

Website merupakan media informasi yang paling banyak


dirasakan manfaatnya. Ini dibuktikan dengan munculnya berbagai
tipe-tipe website dengan berdasarkan fitur, fungsi dan tujuan
pembuatannya. Website merupakan tampilan dari berbagai macam
informasi baik berupa teks, data, gambar (diam atau bergerak),
animasi, suara, video maupun gabungan dari semuanya, yang
bersifat statis dan dinamis, yang membentuk satu rangkaian
bangunan dihubungkan dengan hyperlink (jaringan halaman).
Sehingga, website didefinisikan sebagai alat untuk bertukar
informasi dan memperbarui informasi, (Timothy John Berners Lee
tahun 1991).
Berdasarkan perkembangannya, website terbagi menjadi 2
(dua) jenis, yaitu website statis dan website dinamis. Website statis
disebutkan juga dengan website tetap, artinya website yang isi di
dalamnya tidak dimaksudkan untuk di update secara berkala, dan
biasanya diatur secara manual menggunakan software editor.
Sedangkan, website dinamis adalah website yang informasi
didalamnya berubah secara berkala dan memiliki berbagai fasilitas

1
seperti aplikasi. Oleh sebab itu, kedua jenis ini membuat website
menjadi sangat populer.
Pada era modern, ada banyak website yang bermunculan
misalnya saja website sekolah. Dalam pembuatan website
dilakukan melalui aplikasi blog. Ada begitu banyak aplikasi blog
yang ditawarkan saat ini. WordPress merupakan diantara aplikasi
blog yang ada dan juga salah satu jenis CMS yang tergolong dalam
aplikasi open source. Dengan kata lain, WordPress adalah website
dinamis. Artinya klien dengan mudah memperbarui atau
memodifikasi website sesuai keinginannya.
Berdasarkan sejarahnya, SMA Negeri 3 Kikim Timur berdiri
pada tahun 2015. Sekolah ini berdiri di lahan dengan Luas Areal
29.200 m2 yang beralamat di Desa Sukoharjo Kecamatan Kikim
Timur Kabupaten Lahat Provinsi Sumatera Selatan. Dengan kata
lain, sekolah ini masih berkembang.
Dari penjelasan di atas, setelah penulis melakukan observasi.
Penulis membuat desain website dinamis sekolah. Website ini
bertujuan untuk memperkenalkan sekolah tersebut. Tidak hanya
itu, penulis berharap dengan adanya website ini dapat bersaing di
era modern sekarang. Dalam pembuatan website, penulis
menggunakan WordPress sebagai aplikasi blog. Ini dipilih karena
aplikasi yang ditawarkan oleh WordPress sesuai dengan project
yang akan dikerjakan penulis. Oleh karena itu, penulis mengambil
laporan akhir Thread Cases Study (TCS) dengan judul Desain
2
Website SMA Negeri 3 Kikim Timur dengan Menggunakan
WordPress.

1.2 TUJUAN DAN MANFAAT TCS

Tujuan yang diharapkan dari adanya THREAD CASE STUDY (TCS)


ini adalah sebagai berikut:
1. Sebagai syarat untuk menyelesaikan program professional 1
tahun di PalComTech Lahat.
2. Sebagai media informasi dan sumber referensi pembaca.
3. Agar dapat menciptakan ide kreatif yang bernilai jual.

Manfaat yang didapat dari adanya THREAD CASE STUDY (TCS)


ini adalah sebagai berikut:
1. Dapat menambah wawasan mengenai desain web, khususnya
dalam pembuatan website.
2. Menjadikan penulis lebih berpikir kritis, tanggung jawab dan
dapat dipercaya.
3. Mengetahui macam-macam aplikasi dalam pembuatan website
online.

3
BAB II
ANALISA DAN PEMBAHASAN

2.1 ANALISA PROJECT


Dalam pembuatan website, ada 5 (lima) komponen-komponen
wajib, diantaranya:
1. Web Browser, merupakan perangkat lunak untuk menjalankan
aplikasi. Contoh web browser: Google Chrome.
2. Web Server , merupakan perangkat lunak jika membuat sebuah
halaman web dinamis, dalam web server semua script-script
web yang dibuat diletakkan dengan menggunakan web server
maka pembuat web dapat melakukan uji coba terhadap
halaman-halaman web yang dibuat tanpa harus mencobanya di
internet langsung (localhost). Contoh web server : IIS (Internet
Information Services), CMS (Content Management System).
3. Database Server, merupakan tempat penyimpan data dalam
sebuah web. Contoh database server: MySQL.
4. Web Editor, merupakan perangkat lunak yang digunakan untuk
mengetikkan perintah-perintah script, baik dalam bentuk
HTML, maupun php. Contoh web editor: Notepad, Adobe
Dreamweaver.
5. Image Editor, merupakan perangkat lunak yang digunakan
untuk mengelola gambar-gambar dan animasi yang nantinya

4
akan digunakan di dalam halaman web yang akan dibuat.
Contoh image editor : Adobe Photoshop.

Tahap pertama dalam analisa project, penulis membahas


beberapa komponen-komponen yang digunakan dalam pembuatan
website meliputi Web Browser (Google Chrome), Web Server
(WordPress), Image Editor (Adobe Photoshop), yahoo, idhostinger,
dan kerangka website.

1. Google Chrome

Gambar 2.1 Tampilan Logo Google Chrome

Google chrome adalah sistem operasi sumber terbuka


yang dirancang oleh Google Inc sebagai web brower. Pada
awalnya, Google Chrome di rilis pada tanggal 2 September
2008, yang saat itu hanya untuk Microsoft Windows karena
masih dalam status beta. Lalu pada 11 Desember pada tahun
yang sama Google Chrome di luncurkan untuk semua sistem
operasi karena telah mencapai versi stabil. Semenjak

5
peluncuran untuk semua sistem operasi Google Chrome
diperkirakan telah berhasil meraih presentase 25-28% dari
keseluruhan pengguna browser dunia, dan diperkirakan
membuatnya sebagai web browser kedua atau juga ketiga
paling banyak di gunakan setelah Mozilla Firefox.

2. WordPress

Gambar 2.2 Tampilan Logo WordPress

WordPress adalah sebuah aplikasi sumber terbuka (open


source) yang sangat populer digunakan sebagai mesin blog
(blog engine). Selain sebagai blog, WordPress merupakan salah
satu jenis CMS. CMS atau sering dikenal dengan Content
Management System adalah sebuah aplikasi berbasis web yang
memungkinkan pengguna membuat dan mengembangkan
sebuah situs dengan kebutuhannya. Dengan kata lain, CMS
adalah aplikasi web dinamis.
Selain itu, WordPress juga menyediakan dua alamat yang
berbeda, yaitu WordPress.com dan WordPress.org.
6
a. WordPress.com
merupakan situs layanan blog menggunakan mesin
WordPress, didirikan oleh perusahaan Automattic.
Dengan mendaftar di situs WordPress.com, pengguna
tidak perlu melakukan instalasi atau konfigurasi yang
cukup sulit. Kelemahan dari situs ini, pengguna tidak
dapat mengubah template standar yang disediakan.
Sehingga, pengguna tidak dapat menambahkan asesori
apa pun selain yang sudah disediakan.
b. WordPress.org
merupakan wilayah pengembang (developer). Di
alamat ini, seseorang dapat mengunduh (download)
aplikasi beserta seluruh berkas CMS WordPress .
Berdasarkan penjelasan diatas, berikut adalah
keunggulan dari fitur-fitur WordPress ditawarkan:
1. Gratis.
2. Berbasis kode sumber terbuka (open source).
3. Template atau desain tampilannya mudah
dimodifikasi sesuai dengan keinginan pengguna.
4. Pengoperasiannya mudah.
5. Satu blog WordPress dapat digunakan untuk
banyak pengguna (multi user).
6. Banyaknya dukungan komunitas (community
support) untuk WordPress .
7. Tersedia banyak plugin yang selalu berkembang.
8. Kemampuan untuk menampilkan XML, XHTML,
dan CSS standar.

7
9. Tersedianya struktur permalink yang
memungkinkan mesin pencari mengenali
struktur blog dengan baik.
10. Mampu mendukung banyak kategori untuk satu
artikel.
11. Fasilitas format teks dan gaya teks.
12. Halaman statis.
13. Mempunyai kemampuan optimaliasasi yang baik
pada mesin pencari (search engine optimizer).

3. Adobe Photoshop

8
Gambar 2.3 Tampilan Logo Adobe Photoshop

Photoshop merupakan software yang berfungsi untuk


mengelolah gambar berbasis bitmap. Pada mulanya tahun
1987, Thomas Knoll, mahasiswa PhD di Universitas Michigan,
mulai menulis sebuah program pada Macintosh Plus-nya untuk
menampilkan gambar grayscale pada layar monokrom.
Program ini, yang disebut Display, menarik perhatian
saudaranya John Knoll, seorang karyawan di Industrial Light &
Magic, yang merekomendasikan Thomas agar mengubah
programnya menjadi program penyunting gambar penuh. Dan
akhirnya mereka berkolaborasi pada program tersebut.
Sehingga pada tahun 1990, akibat usaha keras mereka,
Photoshop 1.0 rilis perdana khusus untuk macitosh. Dan
mereka mendefinisikan bahwa Photoshop adalah perangkat

9
lunak editor buatan Adobe Systems dikhususkan pengeditan
foto/gambar dan pembuatan efek.

4. Yahoo Email

Gambar 2.4 Tampilan Logo Yahoo

Pada awalnya, April 1994 yahoo merupakan hanyalah


semacam bookmark (petunjuk halaman buku). Saat itu dua
orang alumni Universitas Stanford mengkompilasi sebuah
daftar bookmark yang besar, yang dikelompokkan berdasarkan
subjek. Kemudian mereka berpikir untuk memasukannya
di web. Pada bulan April 1994, bookmark yang tadinya diberi
nama “Jerry and David’s Guide to World Wide Web” diganti
menjadi Yahoo!, yang mana berasal dari kata “Yet Another
Hierarchical Officious Oracle”. Filo dan Yang memilih kata
tersbeut karena mereka menyukai definisi umum dari kata-kata
tersebut, yang mana berasal dari Gulliver’s Travels oleh
Jonathan Swift: rude –kuat-, unsophisticated -sederhana-,
dan uncouth –kasar-). Domain yahoo.com dibuat pada tanggal
18 Januari 1995. Karena Yang dan Filo menyadari potensi besar

10
yang dimiliki oleh website mereka ini, akhirnya pada tanggal 1
Maret 1995, Yahoo diresmikan sebagai badan hukum. Pada
bulan Juli 2012, Yahoo mendapatkan seorang CEO baru yang
merupakan bekas salah satu petinggi saingan
mereka, Google, Marissa Mayer. Kelebihan yang ditawarkan
oleh yahoo adalah pengguna dapat melakukan web cam. Selain
itu kekurangan terdapat di yahoo bahwa tidak ada ruang atau
room bagi pengguna selurh dunia.

5. Idhostinger

Gambar 2.5 Tampilan Logo Idhostinger

Pada umumnya, IDHostinger merupakan sebuah layanan


web hosting indonesia yang menyediakan layanan web hosting
gratis dan berkualitas bagi pengguna web hosting. Selain itu, id
hostinger juga menawarkan fitur-fitur yang tidak kalah dengan
hosting berbayar lainnya. Keunggulan dari idhostinger tidak
hanya menyediakan disk space dan bandwith yang besar. Tetapi
idhostinger juga menawarkan subdomain yang beragam.

6. Kerangka Website
Sebelum tahap pembuatan website, penulis menjelaskan
kerangka website. Hal ini dibutuhkan untuk memudahkan
11
penulis dalam pengerjaanya. Tata letak seperti menu bar
berada posisi atas, kemudian diikuti header, conten berada
diposisi kiri, sidebar berada diposisi kanan dan terakhir footer
berada di bawah. Untuk selengkapnya dapat dilihat pada
gambar 2.6.

12
Gambar 2.6 Tampilan Kerangka Website

2.2 PEMBAHASAN PROJECT

Dibagian ini, penulis membahas langkah-langkah pembuatan


project seperti membuat email yahoo, membuat domain
idhostinger, menginstal WordPress dan Pengelolahan Website.

1. Membuat email yahoo


13
a. Jalankan sebuah Web Browser (disini penulis menggunakan
Google Chrome). Lalu, ketik id.yahoo.com di taskbar enter.

Gambar 2.7 Tampilan Taksbar

b. Tunggu beberapa detik. Kemudian, muncul tampilan


halaman depan yahoo, seperti gambar dibawah ini.
Selanjutnya, klik Sign In.

Gambar 2.8 Tampilan halaman depan yahoo

c. Tampilan Sign In akan muncul seperti gambar dibawah ini.


Kemudian klik daftar.

Gambar 2.9 Tampilan Sign In

14
d. Maka akan tampil Form Daftar Yahoo. Isi form dengan
benar klik Lanjutkan. (note: form yang harus di isi seperti
nama depan, nama belakang, alamat email, password,
nomor ponsel, tanggal lahir dan jenis kelamin)

Gambar 2.10 Tampilan Form Daftar

e. Kemudian lakukan Verifikasi nomor telepon anda. Nomor


telepon otomatis muncul setelah mengisi form daftar.
Selanjutnya, klik Kirimi Saya Kunci Akun via SMS.

15
Gambar 2.11 Tampilan Verifikasi nomor telepon
f. Masukan 5 digit kunci verifikasi akun yang telah dikirim
melalui SMS ke nomor telpon anda klik Verifikasi.

Gambar 2.12 Tampilan Kunci Akun

g. Proses pendaftaran email sukses. Klik Mari kita mulai untuk


menggunakan akun.

Gambar 2.13 Tampilan Sign In

2. Membuat domain di idhostinger

16
Disini penulis membahas pembuatan akun hostinger dan
pembuatan domain.
A. Membuat akun hostinger
a. Siapkan email yang akan digunakan. Disini penulis
menggunakan yahoo email.
b. Ketik www.hostinger.co.id di taskbar. Kemudian muncul
Tampilan halaman depan hostinger. Selanjutnya, klik
Login untuk membuat akun hostinger.

Gambar 2.14 Tampilan Halaman Depan Hostinger

c. Maka, akan muncul tampilan Login. Lalu, klik here


untuk membuat akun.

Gambar 2.15 Tampilan Login

d. Setelah itu, isi form dibawah ini dengan benar. Lalu, klik
Selanjutnya. (note: form yang harus di isi seperti
alamat email, password, nama depan, nama
17
belakang,negara/wilayah, alamat, kode pos, nomor
telpon)

18
Gambar 2.16 Tampilan Form Daftar Akun Hostinger

19
e. Tunggu sampai loading selesai. Kemudian, pemberitahuan
dari hostinger dikirim melalui email bahwa akun siap
digunakan.

Gambar 2.17 Tampilan Konfirmasi Akun di Yahoo

B. Membuat domain hostinger


a. Pilih menu hosting untuk memilih paket web hosting
akan digunakan.

Gambar 2.18 Tampilan Depan Hostinger

b. Ada 3 (tiga) Paket web hosting ditawarkan gratis,


premium, dan bisnis. Disini penulis menggunakan
paket gratis. Paket dapat di upgrade bila diperlukan.

20
Gambar 2.19 Tampilan Order Web Hosting

c. Pilih 60 bulan, lalu klik LANJUT KE CHECKOUT

Gambar 2.20 Tampilan Checkout Order

d. Akan tampilan data informasi anda, kemudian ceklist


saya setuju dengan syarat dan ketentuan kebijakan
privasi, selanjutnya klik SUBMIT ORDER.
21
Gambar 2.21 Tampilan Submit Order

e. Kemudian, akan tampil pendaftaran order hosting


berhasil. Selajutnya lakukan aktivasi akun.

Gambar 2.22 Tampilan Order berhasil

22
f. Buka aktivasi akun yang dikirim melalui email. Klik link
yang ditawarkan.

Gambar 2.23 Tampilan Aktivasi Akun di Yahoo

g. Pending Pengaturan Order Hosting muncul, klik setup


untuk melanjutkan order hosting.

Gambar 2.24 Tampilan Configurasi Order

h. Isi form Pengaturan Order hosting dengan benar.


Selanjutnya, klik setup. (note: form yang harus di isi
seperti jenis domain* (domain/subdomain gratis),
nama domain/subdomain, pilih lokasi server* dan
password*)

23
Gambar 2.25 Tampilan Pengaturan Order Hosting

i. Setelah selesai mengisi form. Konfirmasi order hosting


akan dikirim melalui email seperti gambar dibawah ini.
Klik UPGRADE KE PREMIUM jika dibutuhkan.

Gambar 2.26 Tampilan Konfirmasi Order Hosting sukses

3. Menginstal WordPress

24
a. Pilih menu hosting, Pilih submenu website, klik 2x Auto
Installer.

Gambar 2.27 Tampilan Web Hosting

b. Auto Installer sukses di instal, ketik WordPress di mesin


pencari lalu enter. Kemudian, klik 2x WordPress icon untuk
menginstal WordPress.

Gambar 2.28 Tampilan Auto Installer

c. Isi form WordPress dengan benar, selanjutnya klik Instal.


(note: form yang harus di isi seperti Username
administrator*, Password administrator*, Email
administartor, Judul website dan Tagline website)

25
Gambar 2.29 Tampilan Konfigurasi Instalasi WordPress

d. Maka, akan muncul kalimat Permintaan Instalasi telah


behasil dikirim....

Gambar 2.30 Tampilan Konfigurasi Instalasi WordPress


Sukses

e. Setelah itu, anda akan menerima konfirmasi email. Klik


salah satu link untuk memulai website.

26
Gambar 2.31 Tampilan Konfirmasi Auto Installer di Yahoo

4. Pengelolahan Website
Di WordPress ada 2 (dua) alamat yang dapat dikunjungi,
yaitu:
Front-end (untuk pengunjung)
Back-end/Dashboard (untuk admin) caranya ketik
nama_website/wp-admin.
Dibagian ini penulis menjelaskan langkah-langkah dalam
pengolahan website meliputi login WordPress, Mengatur
theme, Mengatur header, Mengatur menu dan Posting.
A. Login WordPress.
a. Siapkan Username dan Password, kemudian kunjungi back-
end website, setelah form di isi klik Login.

27
Gambar 2.32 Tampilan Login WordPress

b. Maka akan muncul tampilan Dashboard. Website siap


untuk dikelolah.

Gambar 2.33 Tampilan Dashboard

B. Mengatur thema

28
a. Login ke WordPress, pilih menu appearance, pilih submenu
themes.

Gambar 2.34 Tampilan Appearance Menu

b. Maka akan muncul tampilan seperti dibawah ini, klik Add


News.

Gambar 2.35 Tampilan Add News Themes

c. Setelah itu, klik Upload Theme.

29
Gambar 2.36 Tampilan Upload Themes

d. Selanjutnya, muncul tampilan dibawah ini. Lalu, klik Choose


File.

Gambar 2.37 Tampilan Choose File

e. Pilih tema yang akan digunakan, selanjutnya klik Open.

30
Gambar 2.38 Tampilan Directory File

f. Maka akan tampil seperti gambar dibawah ini. Klik Instal


Now.

Gambar 2.39 Tampilan Instal File

g. Kemudian klik Active, theme berhasil digunakan.

Gambar 2.40 Tampilan Active File

C. Mengatur header
a. Posisi di tampilan dashboard, pilih menu appearance
lalu pilih submenu customize.

31
Gambar 2.41 Tampilan Appearance Menu
b. Maka, akan muncul tampilan setting themes, seperti
gambar dibawah ini. Lalu klik header image.

Gambar 2.42 Tampilan Setting Themes


c. Klik add new image.

32
Gambar 2.43 Tampilan Add New Image

d. Akan muncul tampilan seperti gambar 2.44, lalu klik


Select files, pilih gambar yang akan digunakan, klik
Open setelah file dipilih, kemudian klik Select and Crop
dan terakhir klik skip cropping.

Gambar 2.44 Tampilan Select Files

e. Setelah, mengelolah website. Klik Save & Publish.

33
Gambar 2.45 Tampilan Save & Publish

D. Mengatur Menu Website


a. Masuk di tampilan Dashboard, pilih menu post, pilih
submenu add news

Gambar 2.46 Tampilan Pages

a. Maka akan muncul tampilan seperti dibawah ini, tulis


(menu page yang diinginkan) di kolom Add New Page.

34
Gambar 2.47 Tampilan Add New Page

b. Pilih parent untuk menambah submenu page. Order


untuk mengurutkan file. Setelah selesai mengelolah klik
publish.

Gambar 2.48 Tampilan Publish

35
36
BAB III
SIMPULAN DAN SARAN

3.1 SIMPULAN
Berdasarkan hasil pengamatan penulis, maka dapat disimpulkan
sebagai berikut :
1. Pengoprasian WordPress dan menu-menu didalam dashboard
sangatlah mudah untuk dipahami terkhususnya bagi pemula.
2. WordPress memiliki template tema dan plugin gratis dan bisa
di download.
3. WordPress bersifat open source, sehingga dapat dimodifikasi
sedemikian rupa oleh admin.

3.2 SARAN
Saran yang dapat penulis berikan untuk Lembaga Pendidikan
Komputer PalComTech sendiri adalah :
1. Membuat kegiatan dimana peserta didik tidak hanya belajar
tetapi memahami manfaat dan hasil serta mampu
berkomunikasi dengan baik.

37
2. Pelayanan dan infrastruktur agar di sesuaikan dengan biaya
wajib peserta didik keluarkan.
3. Dalam pembuatan website terkhususnya untuk pembaca,
diharap menyiapkan terlebih dahulu konsep, seperti website
apa yang ingin dibuat, tujuan pembuatan website, dan manfaat
yang ditimbulkan dari pembuatan website.

38
DAFTAR PUSTAKA

https://id.wikipedia.org/wiki/Google_Chrome, diakses pada tanggal 10


April 2017

https://id.wikipedia.org/wiki/Adobe_Photoshop , diakses pada tanggal


10 April 2017

https://id.wikipedia.org/wiki/WordPress , diakses pada tanggal 10 April


2017

https://id.wikipedia.org/wiki/Yahoo!, diakses pada tanggal 10 April


2017

http://rpl-yes.blogspot.co.id/2013/12/hosting-gratis-indonesia-
terbaik.html, diakses pada tanggal 10 April 2017
LAMPIRAN
Tampilan Home

Tampilan Submenu Profil


Tampilan Submenu Kurikulum

Tampilan Submenu Kesiswaan

Tampilan Submenu Layanan


Tampilan Kontak
Tampilan Posting

RIWAYAT HIDUP
Penulis bernama lengkap Adi Wijaya dilahirkan pada tanggal 07 April
1993, putra dari pasangan Bapak Jumadi dan Ibu Siti Zahara, anak ke
2 dari 4 bersaudara. Riwayat Pendidikan dimulai dari
TK Bhayangkari Gunung Gajah, kemudian melanjutkan
Pendidikan di SD Negeri 48 Gunung Gajah, lalu
kejenjang Sekolah Menengah Pertama SMP Negeri
1Lahat. Setelah lulus SMP, penulis melanjutkan
Pendidikan ke jenjang Sekolah Menengah Kejuruan PGRI 2 Lahat. Pada
tahun 2016, penulis melanjutkan Pendidikan di PalComTech. Selama di
palcomtech penulis aktif mengikuti kegiatan yang ditawarkan oleh
PalComTech dan terakhir kali penulis mengikut program Thread Cases
Study (TCS) dan membuat laporan dengan kategori Desain Web,
berjudul Website SMA Negeri 3 Kikim Timur dengan Menggunakan
WordPress.

Anda mungkin juga menyukai