Cara Membuat Web Dengan Divi

Cara Membuat Website Dengan Divi

0 544

Cara Membuat Web Dengan Divi – Website sudah menjadi kebutuhan yang utama pada sebuah perusahaan, sekolah dll. Membangun website membutuhkan kemampuan di bidang bahasa pemrograman. Lalu pertanyaan muncul, bagaimana jika tidak mengerti bahasa pemrograman ? Jawabannya adalah menggunakan Divi. Divi  Builder adalah produk dari Elegant Themes yang berfungsi untuk membangun theme dan juga membangun halaman website. Baik itu website kampus, sekolah, e-commerce dll. Fitur dari Elegant Themes yaitu ;

  1. Real Time Design
    Ketika kita akan membuat perubahan pada suatu page, maka design akan berubah secara cepat  pada saat itu juga.
  2. Customize Everything
    Setiap elemen pada website dapat dirubah sesuai keinginan seperi font, warna, ukuran, spacing dan juga custom CSS.
  3. Klik dan Ketik
    Membuat website dengan divi tidak perlu lafi membuka panel untuk menambahkan content. Kita dapat dengan mudah dan cepat dalam melakukan klik dan memulai mengerjakan isi halaman
  4. Responsive Editing
    Pada layanan ini, web akan menampilkan live resposive preview
  5. Pengaturan yang mudah
    Dengan menggunakan divi, kita dapat dengan mudah menambah baris dan kolom pada website.
  6. Global Elemen
    Sinkronisasi item yang bersifat global pada banyak halaman website.
  7. Premade Layouts
    Membuat website dengan Divi Builder menyediakan lebih dari 20 layout yang siap digunakan.

Baca Juga : Cara Menginstall WordPress

Cara Membuat Website Di WordPress Dengan Divi

  1. Login ke WordPress yang sudah anda install. Jika kamu belum mengerti bagaimana caranya menginstall WordPress, silahkan kunjungi dahulu postingan “Cara Menginstall WordPress & Cara Install Divi“. Jika sudah mengerti, maka selanjutnya klik Pages —-> Add new —-> isi Judul Pages yang akan kamu buat, lalu klik Use Divi Builder.

membuat-web-dengan-divi

Gambar 1. Tampilan Utama Membuat Pages

2.  Jika ini adalah pengalaman anda pertama kali membuat website denga menggunakan Divi, maka lewati saja video ini dengan klik Take the Tour.

membuat-web-dengan-divi

Gambar 2. Tampilan Pertama Ketika Membuat Pages Dengan Divi

3. Pada tahap ini, membuat website wordpress dengan Divi Themes dapat dilakukan dengan 3 cara, yaitu :

1. Build From Scratch.

Dengan memilih cara ini, artinya kita akan membuat pages website dari nol, artinya kita akan mendesain website sesuai dengan keinginan kita. Pada pilihan ini, tidak ada themes yang tersedia, tetapi ada banyak tools yang bisa kita gunakan, mulai dari sider, post, gallery, dll.

2. Choose A Premade Layout.

Pada pilihan ini, kita akan disediakan banyak pilihan themes, mulai dari tampilan home, contact, profil, dll. Pada pilihan themes ini, ada banyak pilihan yang bisa kita pilih. Misalnya kita akan membuat 3 pages, maka setiap pages kita bisa menggunakan themes yang berbeda. Pilihan ini sangat favorite bagi pemula, karena tinggal pilih themes, dan website langsung selesai.

3. Clone Existing Page

Pada pilihan ini, kita diberi akses untuk bisa memilih pages yang sudah kita buat sebelumnya. Misalnya tadi kita sudah membuat page “Profil” dengan memilih themes pada Choose A Premade Layout, maka jika kita ingin membuat page lain tetapi ingin tampilannya sama, maka cara ini bisa kita gunakan, kita tinggal pilih saja pages mana yang akan kita cloning. Pada tutorial kali ini, saya akan menjelaskan menggunakan cara yang kedua yaitu dengan Choose A Premade Layout.

membuat-web-dengan-divi

Gambar 3. Pilihan Membuat Pages Dengan Divi

4. Setelah dipilih Choose A Premade Layout, maka selanjutnya akan ada banyak pilihan themes, silahkan pilih salah satu yang kamu suka atau sesuai dengan tema website yang akan anda buat. Disini saya akan mencontohkan membuat website dengan menggunakan themes education Elementary School. Jika kamu ingin menggunakan themes lain juga bisa.

membuat-web-dengan-divi

Gambar 4. Memilih Themes pada Divi

Baca Juga : Install theme Divi pada WordPress

5.  Setelah memilih themes, kemudian kita diberikan pilihan pages, mulai dari pages About, Blog, Contact, dll. Pilih Pages yang sesuai dengan tema yang akan anda buat, misalnya kita akan membuat tampilan home / tampilan utama, maka pages yg cocok yaitu pages Home, maka pilih Home. Selanjutnya pilih “Use This Layout”. Tunggu sampai proses selesai. Proses ini membutuhkan waktu beberapa detik saja.

membuat-web-dengan-divi

Gambar 5. Memilih Themes 

6. Setelah proses selesai, maka akan masuk ke tampilan pages yang sudah kamu pilih tadi. Lalu edit tampilan website sesuai dengan keinginan kamu. Disini perlu pemikiran yang baik dan juga pengalaman dalam mengedit website. Cantik atau tidaknya website ini tergantung dari hasil editan kita. Jika sudah selesai mengedit tampilan webnya, lalu klik “Publish”.

membuat-web-dengan-divi

Gambar 6. Tampilan Web yang Sudah Dipilih

7.  Settingan ini berfungsi ketika website kita dikunjungi oleh user, maka page inilah yang pertama kali tampil di halaman web browser user, bukan pages yang lain. Caranya adalah klik Setting—-> Reading, kemudian klik pada angka no 1, lalu pada no 2 pilih menu “Home” yang kita buat tadi, lalu klik Save Changes. Banyaknya menu yang tampil pada Homepage ini tergantung dari berapa banyak pages yang sudah kita buat. Karena disini saya masih membuat 1 menu yaitu Home, maka yang tampil hanya 1 menu saja yaitu Home.

membuat-web-dengan-divi

Gambar 7. Tampilan Memunculkan Menu Utama

8.  Pada gambar ini, proses pembuatan pages website wordpress kita sudah selesai. Jika kamu ingin membuat pages yang lain, maka caranya sama seperti cara membuat tampilan pages home. Jika kamu sudah membuat lebih dari 2 pages, maka semua pages itu tidak akan tampil di menu web, maka cara untuk menampilkan menu di web adalah klik Appearance—> Menus, lalu buat dahulu “folder” untuk menu yang akan dibuat. Misalnya kita akan membuat kumpulan menu yang ada diatas, maka kita klik pada no1 dan isi dengan nama Menu Atas (contoh saja, nama bebas) lalu save pada no 4. Selanjutnya di tampilan Pages, centang nama-nama pages yang sudah kita buat, karena tadi kita masih membuat 1 pages yaitu Home, maka yang tampil juga hanya 1 yaitu Home. Kemudian klik Add to Menu dan klik save pada no 5.

Gambar 8. Tampilan Mengatur Menu

9. Jika kamu sudah melakukan pada perintah no 7, maka akan tampak nama menu yang sudah kita add seperti gambar dibawah ini. Lakukan cara ini untuk menambahkan menu-menu yang lain.

Gambar 9. Tampilan Menu yang Sudah Masuk

10. Jika sudah tampil dihalaman web, kita akan menjumpai beberapa menu yang tidak kita inginkan  masih tampil pada halaman web, namun jangan khawatir ya, menu tersebut dapat kita hapus. Cara menghapusnya ada pada tutorial no 11.

Gambar 10. Tampilan Menu yang Tidak Kita Inginkan Tampil

11.  Cara menghapus menu yang tidak kita inginkan yaitu klik menu Appearance—>Menu, kemudian pilih Manage Locations. Pada pilihan Primary Menu, pilihlah nama “Menu Atas” yang sudah kita buat tadi. Kemudian Klik Save Changes.

Gambar 11. Menghapus Menu yang Tidak Kita Inginkan

11.  Sekarang coba cek halaman website yang sudah kita buat tadi. Jika kita sudah benar prosesnya, maka menu yang tidak kita inginkan sekarang sudah tidak ada.  Tampak seperti gambar dibawah ini.

Gambar 12. Tampilan Web yang Sudah Selesai

Nah, demikianlah tutorial membuat website dengan Divi Builder. Bagaimana sobat ? sangat mudah bukan membuat web dengan Divi Builder ? . Semoga tutorial ini bermanfaat. Jika ada yang ingin ditanyakan silahkan comment pada form dibawah. Terima Kasih

Leave A Reply

Your email address will not be published.

error: Content is protected !!