Pada artikel sebelumnya kita telah membicarakan mengenai pengunaan Blog Module dari Divi untuk tampilan home website kita. Namun kalau kita perhatikan tampilan kurang rapi karena tinggi atau height dari cuplikan post berbeda satu dengan yang lain. Dengan demikian kita perlu membuat height atau tinggi yang sama sehingga tampilan akan lebih rapi.

Jika kita perhatikan penggunaan Divi Module pada perancangan website menggunakan WordPress, kita tidak menemukan fitur untuk menentukan height atau tinggi suatu modul. Pada saat artikel ini ditulis, kami tidak menemukan fitur pada Divi Builder maupun Divi Module untuk menentukan height tersebut. Semoga pada update berikutnya fitur pengaturan height ini dapat ditambahkan sehingga mempermudah para disainer web dalam merancang tampilan halaman website.

Oleh karena kita tidak menemukan fitur pengaturan height pada Divi Builder, maka kita perlu mengatur height atau tinggi ini secara manual menggunakan CSS.
Langkah-langkah pengaturan height atau pengaturan tinggi pada modul Divi adalah seperti contoh berikut ini:

  1. Menentukan class dengan bantuan Mozilla Firefox:


    Pertama-tama kita membuka website dengan Firefox dan mengarahkan mouse ke module yang kita maksud dan klik Inspect Element (Q).
       

    Pada contoh di atas kita menemukan class yang kita maksud adalah class CSS et_pb_post.
     
     

  2. Mengedit CSS dari child theme:

    Di sini kita menambahkan css untuk height dari class et_pb_post seperti pada contoh di atas. Pada contoh di atas kita cukup mengedit style.css dari child theme. Silahkan teliti mengedit css, pastikan tampilan halaman lain tidak kacau.
    Informasi lebih lanjut mengenai CSS @media dapat dibaca di https://www.w3schools.com/cssref/css3_pr_mediaquery.asp .
  3. Merefresh tampilan pada browser:

    Tampak tampilan terlihat lebih rapi.

Kunjungi www.proweb.co.id untuk menambah wawasan anda.

Menentukan height pada Divi Module