Dwi Marta Marwatul Wardah
Latest posts by Dwi Marta Marwatul Wardah (see all)

Pengantar

Hallo sobat jagoan!!!! Kembali di website tutorial 

Kali ini kita akan bahas mengenai tutorial membuat web sekolah dengan wordpress dan divi builder 

Sudah tahu tentang divi builder dan wordpress? Akan mimin paparkan sedikit mengenai keduanya. Biar yang tidak tau jadi tau dan yang tau jadi tambah tau 

Jadi WordPress sendiri merupakan CMS (Content Management System) dimana kita bisa bikin web tanpa coding dengan menambahkan beberapa konten yang kemudian di launch sehingga lebih mudah. 

Sedangkan untuk Divi Builder ini merupakan salah satu pluginnya yang berfungsi untuk membuat platform kamu semakin powerful.

Nah itu sob, sekilas tentang wordpress dan juga divi builder 

Yuk kita menuju tutorial, Let’s go..

 

Prasyarat

Sebelum ke tutorial kamu perlu memenuhi beberapa prasyarat berikut: 

 

Langkah 1, Menyiapkan Draft Konten

Ibarat sebuah bekal, kamu harus menyiapkan isinya dulu baru tempat bekalnya, jadi kamu perlu untuk menyiapkan konten sebelum membuat sebuah website. Langkah ini penting untuk kamu lakukan terlebih dahulu sebelum membuat website agar lebih mudah dalam mengatur layout di langkah selanjutnya.

Hal yang perlu kamu perhatikan dalam menyiapkan draft konten yaitu:

  • List kebutuhan halaman 

Kamu perlu untuk menentukan berapa banyak halaman yang kamu butuhkan saat membuat website sehingga kamu tidak kebingungan saat eksekusinya nanti.

contoh gambarnya seperti ini

  • Siapkan Draft tulisan 

Karena ide itu sering tidak muncul disaat yang kita mau, maka kamu tidak bisa memastikan idemu akan muncul saat kamu membuat website. Untuk itu kamu perlu menyiapkan draft tulisan terlebih dahulu yang nantinya digunakan untuk mengisi  website kamu.

Draftnya bisa kamu kreasikan sendiri yaa

  • Sertakan gambar dan video

Agar website kamu lebih powerful kamu perlu menambahkan gambar atau video sebagai penunjang, tapi untuk video kamu bisa menggunakan youtube sebagai media sharingnya untuk menghemat hosting kamu hehehe.. 

Nah jika semua

Langkah 2, Membuat Sketsa Layout

Langkah ini tentu saja perlu kamu lakukan karena tidak mungkin kamu membuat website dengan layout yang tidak kamu atur sebelumnya, bisa jadi nanti website mu malah terlihat berantakan dan asal-asalan, tidak mau bukan??

Sedikit tips untuk langkah ini jika kamu kebingungan membuat sketsa layout kamu bisa mencari referensi di berbagai platform salah satunya pinterest dengan keyword “wireframe landing page template” 

Pilih saja salah satu, Jangan sampai kebingungan ya

Kamu juga bisa menyusun sketsa layout secara langsung saat membuka Landing page dengan template yang sudah di sediakan di divi builder, banyak sekali template yang nantinya bisa kamu pilih. Nah dalam langkah ini kamu bisa gunakan metode ATM yaitu Amati, Tiru dan Modifikasi. Layout yang telah kamu buat sebelumnya bisa kamu modifikasi dengan layout yang sudah disediakan nantinya 

Pilih salah satu ya sob

Langkah 3, Merancang Landing Page

Nahh ketika konten mu sudah siap dan sketsa mu sudah siap maka selanjutnya kamu akan mengeksekusi websitemu. 

  1. Log in di wp admin, iyap! Tentu saja kamu harus login terlebih dahulu sob
  2. Setelah berada di dashboard maka tekan pages lalu add new untuk membuat halaman baru.
  3. Pada langkah ini cukup tuliskan judul halaman kemudian tekan tombol ungu bertuliskan “use divi builder” untuk berlanjut pada page builder. Nanti akan muncul menu seperti pada gambar berikut

    Pilih browser Layout yaa

    Keterangan:

    • Build From Scratch, menu ini untuk membuat landing page dari awal atau halaman kosong, jadi kamu sendiri yang mengatur konsep dari landing page mu.
    • Choose a Premade Layout, membuat landing page dengan menggunakan template yang sudah disediakan.
    • Clone Existing Page, menduplikat halaman yang sudah ada di dashboard sebelumnya, biar gak kerja dua kali sob 
  4. Agar lebih mudah, kamu bisa memilih kotak di tengah bertuliskan Choose a Premade Layout, ya…
  5. Setelah muncul halaman untuk memilih template layout, kamu hanya perlu mengklik tiap layout untuk melihat detailnya, dan jika sudah cocok dengan salah satunya kamu bisa gunakan ‘use this layout’ untuk mengaplikasikannya

    Pilih kotak hijau jika sudah cocok yaa..

  6. Nah setelah itu akan muncul gambar seperti berikut, klik ‘Build on The Front End’

    Pilih yang ditandai sob agar lebih mudah

  7. Dan ketika kamu ingin mengedit hasil kerjamu seperti merubah font, menduplikat column dan sebagainya, kamu cukup menyorotnya maka akan keluar menu setting atau kamu bisa mengklik ikon setting langsung untuk mengedit hasil kerjamu, lebih jelasnya seperti gambar berikut

    kotak oranye untuk Row,  kotak hijau untuk Column, dan kotak hitam untuk Module

Penutup

Nah itu tadi langkah-langkah yang perlu kamu lakukan untuk membuat website sekolah dengan wordpress dan divi builder, tapi bukan hanya untuk sekolah sob.. kamu juga bisa membuat website untuk personal, organisasi, perusahaan dan masih banyak lagi dengan menggunakan wordpress dan divi builder. 

Selamat mencoba ..

Apakah artikel ini membantu, Sob?

Berikan rating buat artikel ini!

Rata-rata rating 0 / 5. Dari total vote 0

Pertamax, Sob! Jadilah pertama yang memberi vote artikel ini!

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?