MODUL PEMANFAATAN WEBSITE SEBAGAI UPAYA PENINGKATAN KUALITAS PENDIDIKAN RUMAH TEKNOLOGI INFORMASI DAN KOMUNIKASI 2016
Daftar Isi Pendahuluan Pengertian Hosting Pengertian Domain Cara Instal WordPress Cara Setting Tampilan Dashboard Cara Membuat Posting Cara Membuat Pages Cara Menggunakan Image Media Cara Instal Plugin Via Dashboard Cara Update dan Hapus Plugin Cara Instal Theme Via Dashboard Cara Kostumisasi Theme WordPres Cara Menggunakan Widget Cara Menangani Komentar SPAM Cara Setting Plugin Akismet Cara Membuat Form Kontak Cara Kostumisasi Form Kontak Penutup
Pendahuluan Pertanyaan yang sering muncul di benak orang-orang yang ingin membuat website (mungkin Anda juga termasuk) adalah: harus mulai dari mana? Biar kami beritahu sedikit rahasia: Anda bisa menggunakan WordPress. WordPress merupakan sebuah CMS (Content Management System) yang memungkinkan Anda untuk membuat sebuah blog atau website dengan mudah, hanya bermodalkan hosting dan domain untuk menginstalnya. Platform ini sangat populer di seluruh dunia dan bisa Anda dapatkan secara gratis! Di e-book ini Anda akan belajar tentang bagaimana membangun blog atau website Anda sendiri menggunakan WordPress. Oleh karena itu, Anda sangat beruntung jika mendapatkan e-book Tutorial WordPress untuk Pemula ini! Semuanya akan dibahas lengkap, langkah demi langkah mulai dari NOL hingga menjadi sebuah blog atau website yang sangat PROFESIONAL. Tutorial WordPress untuk Pemula ini kami bagi ke dalam dua bagian. Edisi ini merupakan bagian yang pertama. Selamat Mencoba! www.rumahtik.com info@rumahtik.com 08573019009 2 1
Pengertian Hosting Hosting merupakan sebuah space atau tempat penyimpanan data sebuah blog atau website di internet yang memungkinkan data tersebut diakses secara online dan dilihat oleh semua orang dari seluruh penjuru dunia. Penjelasan lebih lanjut bisa diumpamakan seperti ini. Jika Anda ingin membangun sebuah usaha, maka Anda membutuhkan sebuah lapak untuk usaha Anda tersebut, bukan? Katakanlah lapak tersebut berupa Ruko yang mempunyai space atau ukuran ruangan yang variatif ada yang ukurannya 5x5 m, 10x5 m, dan seterusnya. Begitu pula dengan hosting di internet. Ada beragam varian space berbeda yang dapat Anda pilih: 500MB, 1GB, bahkan space yang jauh lebih besar. Namun yang pasti, berapapun space-nya pasti suatu saat akan menjadi kendala jika Anda membeli hosting yang space-nya dibatasi. Pengertian Domain Domain adalah alamat sebuah situs berupa (.com/.net/.org) dan lain-lain, mempunyai fungsi untuk mengidentifikasi alamat (IP address) sebuah server komputer (hosting). Seperti ilustrasi diatas, ketika Anda sudah mempunyai ruko untuk space usaha, tentunya yang Anda butuhkan adalah alamat agar siapapun dapat mengunjungi tempat usaha Anda dengan mudah. Jika Anda sudah mempunyai ruko tetapi tidak memiliki alamat, lantas bagaimana orang dapat mengunjungi tempat usaha Anda? Begitu juga dengan domain, sebuah alamat yang wajib ada agar website Anda dapat dengan mudah diingat dan dikunjungi oleh orang dari seluruh penjuru dunia. www.rumahtik.com info@rumahtik.com 08573019009 2 2
Cara Instal WordPress 1. Download WordPress di https://wordpress.org/download/. 2. Buka browser kemudian ketikkan namadomainanda.com/wp-admin/ maka akan muncul tampilan seperti gambar di bawah ini. Pilih bahasa yang Anda inginkan kemudian klik Continue. 3. Selanjutnya Anda akan menemukan halaman seperti dibawah ini, pilih Let sgo!. www.rumahtik.com info@rumahtik.com 085730190092 3
4. Isi nama database, username, dan password sesuai dengan database yang sudah dibuat sebelumnya. Untuk Database Host dan Table Prefix biarkan saja default, setelah itu klik Submit 5. Jika berhasil akan muncul pesan seperti pada gambar di bawah ini. Kemudian pilih Run the install. 6. Langkah selanjutnya yaitu mengisi informasi WordPress seperti Title, Username dan Password untuk login pada dashboard dan email untuk kebutuhan ketika Anda lupa password, setelah itu pilih Install WordPress. www.rumahtik.com info@rumahtik.com 085730190092 4
7. Setelah proses instalasi selesai, akan muncul tampilan halaman seperti gambar di bawah ini. Anda dapat login dengan menggunakan username dan password yang telah dibuat sebelumnya. Cara Setting Tampilan Dashboard Setelah berhasil menginstal WordPress pada hosting, di tutorial selanjutnya Anda akan belajar bagaimana cara setting tampilan dashboard WordPress yang sudah diinstal sebelumnya. Berikut adalah tutorialnya. 1. Login pada dashboard WordPress Anda dengan mengetikan pada browser namadomainanda.com/wp-admin/, masukkan username dan password WordPress yang telah dibuat ketika instalasi. 2. Anda akan menemukan tampilan dashboard WordPress seperti ini ketika pertama kali login. www.rumahtik.com info@rumahtik.com 085730190092 5
3. Untuk setting tampilan dashboard, Anda dapat mengubahnya pada menu Profile di pojok kanan atas layar. 4. Kemudian Anda akan menemukan opsi Admin Color Scheme dimana Anda dapat mengubah tampilan warna dashboard WordPress sesuai keinginan Anda. 5. Setelah itu terdapat opsi Collapse menu, dimana dengan memilih opsi ini Anda dapat melihat menu pada WordPress hanya berupa icon saja dan terlihat lebih sederhana. www.rumahtik.com info@rumahtik.com 085730190092 6
6. Kemudian ada Screen Option yang dapat diatur sesuai keinginan Anda, seperti misalnya ingin menampilkan atau menghilangkan tampilan Welcome maupun tampilan lainnya. Anda dapat memberi tanda centang untuk menampilkan dan menghilangkan tanda centang untuk tidak menampilkannya. Cara Membuat Posting Posting adalah aktivitas tulis-menulis atau membuat sebuah artikel yang nantinya akan di-publish dan dilihat oleh semua orang yang mengakses halaman website WordPress Anda. Berikut langkah membuat posting pada WordPress. 1. Masuk pada Dashboard Anda, pilih Post» Add New atau pilih icon (+) di bagian atas lalu pilih Post. 2. Anda akan menemukan halaman seperti ini, dimana terdapat kolom untuk menuliskan judul posting Anda dan juga area untuk menulis posting. www.rumahtik.com info@rumahtik.com 085730190092 7
3. Kemudian ada beberapa opsi untuk mempercantik tulisan Anda, yang biasanya juga terdapat di Aplikasi Office pada umumnya. 4. Untuk menambahkan konten berupa gambar, video maupun yang lainnya, Anda dapat menggunakan opsi Add Media. Kemudian pilih Select Files lalu pilih konten yang ingin Anda upload. Tunggu hingga proses upload selesai. 5. Setelah itu Anda dapat menyesuaikan ukuran, title, dan sebagainya pada gambar tersebut. Setelah semuanya sesuai, pilih Insert Into Post dan gambar berhasil diunggah serta masuk dalam postingan. www.rumahtik.com info@rumahtik.com 085730190092 8
6. Selain itu, Anda juga dapat mengkelompokkan tulisan yang Anda buat ke dalam kategori tertentu, bisa dengan membuat kategori baru atau mengikuti kategori yang sudah ada. Pilihan ini bisa Anda temukan pada bagian Categories, di sebelah kanan area posting. Membuat kategori baru pun sangat mudah. Anda dapat pilih opsi Add New Category, tulis kategori yang Anda inginkan, dan klik untuk memberi tanda centang pada kategori tersebut. www.rumahtik.com info@rumahtik.com 085730190092 9
7. Terdapat juga pilihan Tags yang bisa Anda tambahkan sesuai dengan postingan yang Anda tulis. Untuk menambahkannya pun cukup mudah. Anda hanya perlu menuliskan tag tersebut dan pilih Add. 8. Kemudian untuk mengubah permalink atau URL postingan yang akan Anda publish, silakan pilih opsi di bawah kolom judul atau title, kemudian pilih edit dan sesuaikan dengan keinginan Anda. 9. Setelah semua selesai, Anda dapat menerbitkan posting atau artikel tersebut dengan meng-klik tombol Publish. www.rumahtik.com info@rumahtik.com 085730190092 10
Cara Membuat Pages Membuat sebuah page/halaman dengan posting kurang lebih sama seperti tutorial di atas. Perbedaannya hanya terletak pada pilihan menu untuk membuat pages tersebut. Berikut tutorialnya. 1. Masuk pada dashboard WordPress Anda, pilih menu Pages» Add New, atau dengan cara pilih icon (+) kemudian pilih Page. 2. Setelah itu Anda akan masuk pada halaman yang sama dengan halaman ketika membuat posting di atas, lengkap dengan opsinya. Namun, hal yang membedakan adalah ketika Anda membuat sebuah page tidak terdapat opsi kategori atau tags, karena page atau halaman itu biasanya dibuat untuk hal yang formal seperti About Us, Contact Me, dan lain sebagainya. Cara Menggunakan Image Media Image Media merupakan sebuah media library yang di dalamnya terdapat seluruh konten berupa gambar, video maupun file media lain yang pernah Anda upload sebelumnya, baik itu ketika membuat sebuah posting maupun pages. Selain itu Anda juga dapat mengunggah konten melalui media. Berikut adalah langkah-langkahnya. www.rumahtik.com info@rumahtik.com 085730190092 11
1. Masuk pada dashboard WordPress Anda, kemudian pilih Media» Library maka Anda akan menemukan semua konten yang pernah Anda upload. 2. Untuk menambahkan gambar atau konten baru lainnya, Anda cukup memilih Add New» Select Files dan pilih gambar yang ingin Anda upload. Nantinya gambar ini siap untuk Anda masukkan pada sebuah posting atau halaman tanpa perlu mengunggahnya kembali. www.rumahtik.com info@rumahtik.com 085730190092 12
3. Anda juga dapat mengubah keterangan gambar dengan cara meng-klik salah satu gambar. Setelah itu, akan muncul tampilan seperti gambar di bawah ini, dimana Anda dapat mengubah Title, Description, dan lainnya di sini. 4. Selain itu Anda juga dapat mengedit gambar tersebut dengan memilih Edit Image pada gambar di atas. Ada beberapa opsi yang disediakan untuk mengedit gambar, misalnya Rotate, Flip, mengatur ukuran gambar, memotong gambar dan lain-lain. Cara Instal Plugin Via Dashboard Salah satu alasan mengapa Anda menggunakan WordPress sebagai Platform untuk website Anda, karena WordPress Self Hosting (WordPress.org) mempunyai Ribuan atau bahkan jutaan Plugin dengan kegunaan dan fitur yang berbeda yang siap Anda instal secara gratis. Pada tutorial di bawah ini kami akan mencoba untuk menginstal plugin Contact Form 7, suatu plugin yang memiliki fungsi untuk membuat form kontak. Plugin ini sangat berguna untuk memudahkan pengunjung situs yang ingin menghubungi Anda melalui email. Berikut adalah tutorialnya. www.rumahtik.com info@rumahtik.com 085730190092 13
1. Masuk pada dashboard WordPress Anda, kemudian pilih Plugin» Add New. 2. Tulis nama plugin yang ingin diinstal pada kolom Search kemudian tekan Enter. 3. Pilih Install pada plugin dengan nama Contact Form 7. Tunggu beberapa detik hingga proses instalasi selesai, kemudian pilih Activate Plugin untuk mengaktifkan plugin tersebut. www.rumahtik.com info@rumahtik.com 085730190092 14
Selesai! Plugin telah berhasil diinstal melalui dashboard WordPress. Cara Update dan Hapus Plugin Plugin, seperti WordPress, membutuhkan update berkala dari pengembangnya. Di tutorial kali ini Anda akan belajar bagaimana cara update dan hapus plugin. Penjelasannya ada di bawah ini. 1. Untuk mengetahui apakah sebuah plugin membutuhkan update versi terbaru, caranya sangat sederhana. Anda dapat melihat notifikasi-nya pada dashboard WordPress di menu plugin. Jika tertera angka di sana, misalkan angka 1 (seperti pada gambar), maka ada satu plugin yang membutuhkan update. Angka ini menyesuaikan jumlah plugin yang perlu di-update. 2. Apabila Anda menemukan notifikasi tersebut, segera buka dashboard WordPress Anda kemudian pilih Plugin» Installed Plugins. Setelah itu, klik Update Now pada plugin yang ingin di-update. www.rumahtik.com info@rumahtik.com 085730190092 15
3. Tunggu hingga proses update selesai. Kemudian akan muncul notifikasi seperti gambar di bawah ini. 4. Menghapus plugin pun caranya mudah. Pastikan Anda masih berada di halaman Installed Plugins, setelah itu cari plugin yang akan Anda hapus dan pilih Delete. 5. Pilih Yes, Delete these files dan plugin berhasil dihapus. Cara Instal Theme Via Dashboard Bisa jadi Anda merasa bosan dengan tampilan theme bawaan dari WordPress. Tenang, tentu Anda dapat menggantinya sendiri. Tutorial di bawah ini Anda akan membahas cara instal theme via dashboard. www.rumahtik.com info@rumahtik.com 085730190092 16
1. Masuk pada dashboard WordPress Anda kemudian pilih menu Appearance» Themes. 2. Pilih Add New kemudian cari theme yang Anda inginkan. 3. Setelah menemukan themes yang Anda inginkan, pilih theme tersebut kemudian klik Install. Anda juga dapat melihatnya terlebih dahulu dengan mengklik Preview. 4. Setelah memilih Install, tunggu beberapa saat hingga prosesnya selesai. Kemudian pilih Activate untuk langsung mengaktifkan, atau pilih Live Preview untuk melihatnya terlebih dahulu. www.rumahtik.com info@rumahtik.com 085730190092 17
5. Selesai! Anda telah berhasil menginstal theme via dashboard. Sekarang website Anda telah memiliki tampilan berbeda, sesuai apa yang Anda inginkan. www.rumahtik.com info@rumahtik.com 085730190092 18
Cara Update Theme WordPress Sama seperti plugin, theme dari WordPress juga membutuhkan update. Update ini bisa dikarenakan adanya tampilan yang lebih baru atau sebatas perbaikan versi terdahulu. Berikut ini tutorialnya untuk Anda. 1. Masuk ke dashboard WordPress Anda, kemudian pilih menu Appearence» Themes. Akan ada notifikasi seperti pada gambar di bawah ini apabila theme Anda membutuhkan update. 2. Untuk melakukan update pada theme tersebut, Anda cukup mengklik theme yang akan di-update kemudian pilih update now. www.rumahtik.com info@rumahtik.com 085730190092 19
3. Tunggu beberapa detik, jika theme telah berhasil di-update akan muncul notifikasi seperti gambar di bawah ini. Cara Kostumisasi Theme WordPress Tampilan theme website WordPress Anda juga dapat disesuaikan agar terlihat lebih menarik sesuai keinginan Anda. Panduan lengkap cara kostumisasi theme WordPress ini dapat Anda lihat di tutorial berikut ini. 1. Masuk terlebih dahulu ke dashboard WordPress Anda, kemudian pilih menu Appearance» Customize. 2. Anda akan menemukan sebuah halaman customize dimana Anda dapat mengubah fitur yang sudah disediakan oleh theme tersebut. Harap diingat juga bahwa setiap theme dapat memiliki fitur berbeda-beda. www.rumahtik.com info@rumahtik.com 085730190092 20
3. Sebagai contoh, di sini Anda akan mengubah Site Title dan Tagline. Anda cukup memilih opsi Site Title & Tagline kemudian isi atau edit sesuai dengan keinginan Anda. www.rumahtik.com info@rumahtik.com 085730190092 21
4. Tidak hanya itu saja, beragam fitur lain juga dapat Anda sesuaikan, misalnya Font, Colors, Logo, dan masih banyak lagi. Klik Save & Publish untuk melihat hasilnya jika sudah selesai. Cara Menggunakan Widget Sebuah blog atau website terasa kurang lengkap jika tidak terdapat widget. Mengapa? Widget dapat membantu membuat sebuah website terlihat lebih menarik. Selain itu, widget juga dapat membantu Anda mempromosikan produk atau jasa karena dapat langsung terlihat pada semua halaman di website Anda. Berikut adalah tutorial bagaimana cara menggunakan widget. 1. Masuk ke dashboard WordPress Anda, pilih menu Appearance» Widgets dan Anda akan menemukan sebuah halaman untuk mengatur semua widget. www.rumahtik.com info@rumahtik.com 085730190092 22
2. Kolom Sidebar menunjukkan widget aktif milik Anda. Ini artinya, widget tersebut ditampilkan pada situs Anda. Jika ingin menghapus widget yang ada, klik salah satu widget aktif kemudian pilih Delete. 3. Misalkan pada saat ini Anda sudah menghapus semua widget bawaan WordPress secara default dan sekarang Anda ingin me-manage widget yang ingin ditampilkan. Caranya sangat mudah. Anda hanya perlu meng-klik widget yang tersedia kemudian pilih Sidebar, apabila Anda ingin menampilkannya pada lokasi sidebar. Setelah itu pilih Add Widget dan Anda telah berhasil menambahkan widget. Klik save untuk menyelesaikan pengaturan. www.rumahtik.com info@rumahtik.com 085730190092 23
4. Pilih beberapa widget yang ingin Anda tampilkan untuk mempercantik tampilan WordPress Anda. Namun, kami sarankan agar jangan terlalu banyak karena dapat sangat menggangu pengunjung situs Anda. Cara Menangani Komentar SPAM Sebuah situs WordPress yang telah memiliki visitor atau pengunjung cukup banyak biasanya rentan oleh adanya komentar spam. Hal ini tentu sangat menggangu dan membuat jengkel karena Anda harus menghapunya satu persatu. Ada cara menangani komentar spam yang lebih baik dibandingkan harus menghapusnya satu-per-satu. Berikut ini adalah tutorialnya. 1. Masuk ke dashboard WordPress Anda kemudian pilih Plugin» Installed Plugin, karena Anda akan menangani komentar SPAM tersebut dengan menggunakan sebuah plugin benama Akismet. Umumnya plugin ini sudah terinstal secara otomatis pada WordPress, jadi Anda hanya perlu mengaktifkannya dan melakukan sedikit konfigurasi. Klik Activate pada plugin ini untuk mengaktifkannya. www.rumahtik.com info@rumahtik.com 085730190092 24
Apabila plugin ini belum tersedia secara otomatis, Anda dapat menginstalnya melalui dashboard. Langkah-langkahnya dapat Anda lihat pada bagian tutorial Cara Menginstal Plugin di atas. Cara Setting Plugin Akismet 1. Setelah plugin aktif, akan muncul pemberitahuan untuk konfigurasi atau aktivasi akun Akismet. Silakan pilih Activate your Akismet Account. 2. Anda akan menemukan halaman seperti gambar di bawah ini. Pilih Get yout API Key. www.rumahtik.com info@rumahtik.com 085730190092 25
3. Selanjutnya akan muncul halaman baru yaitu website dari Akismet yang meminta Anda untuk membuat API Key. Fungsinya tidak lain adalah untuk mengaktifkan plugin Akismet ini. Pilih GET AN AKISMET API KEY. 4. Kemudian pilih Basic karena Akismet akan dipasang pada website baru yang sifatnya lebih personal, bukan untuk tujuan komersil. 5. Buat akun WordPress.com atau Akismet Anda dengan cara mengisi form yang tersedia. Setelah itu, pilih Sign Up. www.rumahtik.com info@rumahtik.com 085730190092 26
6. Pada halaman selanjutnya silakan ubah Subscription menjadi $0.00/year dengan cara menggesernya ke kiri. Kemudian, masukkan Contact Info lalu Continue. 7. Setelah berhasil membuat akun, Anda akan langsung mendapatkan API Key yang siap digunakan untuk mengaktifkan Akismet. www.rumahtik.com info@rumahtik.com 085730190092 27
8. Copy API key tersebut kemudian kembali ke dashboard. Paste pada Manually enter an API key lalu pilih Use this key. 9. Setelah itu, pilih Save Changes dan kini WordPress Anda sudah terlindung dari komentar SPAM. www.rumahtik.com info@rumahtik.com 085730190092 28
Cara Membuat Form Kontak Form kontak sangat berguna untuk sebuah website berbasis WordPress. Fitur ini dapat memudahkan pengunjung untuk menghubungi Anda langsung melalui website dengan cara meninggalkan pesan. Nantinya, form kontak ini akan memproses pesan tersebut sebagai email dan mengirimkan datanya ke email Anda. Untuk membuat form kontak pada WordPress, Anda tidak memerlukan keahlian khusus. Caranya sangat mudah. Anda hanya perlu menggunakan plugin bernama Contact Form 7. Cara instal plugin ini sebelumnya sudah dijelaskan pada tutorial No. 9 dengan judul Cara Instal Plugin Via Dashboard (terdapat di e-book Tutorial Wordpress bagian pertama kami). Berikut adalah tutorial cara membuat form kontak tersebut. 1. Masuk ke dashboard, pilih menu Contact» Add New. 2. Pilih bahasa yang Anda inginkan. Sebagai contoh, di bawah Anda akan menggunakan Bahasa Indonesia. Pilih Add New. www.rumahtik.com info@rumahtik.com 085730190092 29
3. Anda akan menemukan halaman seperti gambar di bawah ini. Di sini Anda dapat melakukan konfigurasi form kontak menjadi seperti yang Anda inginkan. 4. Kemudian lakukan pengaturan pada tab Mail. Di sini Anda akan menemukan lebih banyak lagi pengaturan form, misalnya alamat email tujuan, subject, dan masih banyak lagi. www.rumahtik.com info@rumahtik.com 085730190092 30
5. Jika sudah selesai, klik Save dan akan muncul Script Code yang siap Anda gunakan pada halaman atau posting. 6. Copy script code tersebut, kemudian buat page/halaman baru. Jangan lupa untuk ganti mode dari Visual menjadi Text. 7. Pilih Publish, dan hasilnya akan jadi seperti ini. www.rumahtik.com info@rumahtik.com 085730190092 31
8. Anda dapat melakukan pengetesan dengan cara mengisi form kontak tersebut dan membuka pesannya di inbox email Anda. Nantinya email yang masuk akan terlihat seperti ini. Cara Kostumisasi Form Kontak Banyak fitur yang dapat diutak-atik pada plugin Contact Form 7 ini. Salah satu di antaranya adalah Auto Reply yang memungkinkan Anda untuk membalas pesan atau email yang masuk melalui form kontak secara otomatis. Berikut adalah tutorialnya. 1. Masuk pada bagian contact form yang sudah dibuat sebelumnya, kemudian pilih tab Mail. Scroll ke bawah, centang opsi Use Mail (2). www.rumahtik.com info@rumahtik.com 085730190092 32
2. Ubah sesuai keinginan Anda, misalnya seperti contoh di bawah ini. 3. Ketika seseorang menghubungi Anda melalui form kontak, mereka akan langsung mendapatkan email balasan seperti ini. www.rumahtik.com info@rumahtik.com 085730190092 33
4. Selain itu, notifikasi ketika terjadi kesalahan maupun ketika pesan terkirim dapat Anda atur sendiri pada tab Messages. 5. Kemudian, ini yang perlu Anda lakukan apabila Anda ingin agar pengunjung diarahkan ke halaman tertentu (redirect) tepat setelah mereka selesai mengisi contact form pada website Anda. Pilih tab Additional Settings, kemudian masukkan script code ini (on_sent_ok: "location = 'http://example.com/';"). Ubah http://example.com/ menjadi halaman yang Anda inginkan. www.rumahtik.com info@rumahtik.com 085730190092 34
Penutup WordPress mampu menjadi solusi bagi setiap orang yang kesulitan membuat website sendiri. Platform ini bisa mempermudah Anda membuat website profesional walaupun tidak mempunyai basic di bidang IT. Tentu, banyak belajar dan praktek akan membuat Anda lebih ahli dalam membuat website berbasis WordPress. Sekian tutorial singkat dari kami. Semoga e-book ini dapat mengatasi permasalahan pembuatan website yang Anda hadapi. Mohon maaf apabila terdapat kesalahan pengetikan ataupun hal lain yang tidak kami sengaja. www.rumahtik.com info@rumahtik.com 085730190092 35