Cara Membuat Blok Tata Letak Divi yang Dapat Digunakan Kembali untuk Postingan Blog Gutenberg
Diterbitkan: 2020-02-12Blok Tata Letak Divi terus menjadi peningkatan yang berguna untuk Tema Divi, memungkinkan kami untuk menambahkan Tata Letak Divi apa pun ke posting blog di dalam editor Gutenberg. Kami bahkan dapat mengubah Blok Tata Letak Divi menjadi blok yang dapat digunakan kembali di Gutenberg sama seperti blok WordPress lainnya. Ini membuka pintu untuk merampingkan beberapa desain Tata Letak Divi yang bermanfaat ke dalam aliran normal penulisan posting di Gutenberg.
Dalam tutorial ini, kita akan mendemonstrasikan cara membuat Blok Tata Letak Divi yang dapat digunakan kembali untuk posting blog Gutenberg. Untuk mengilustrasikan ini, kami akan membuat pembagi bagian untuk contoh blok tata letak Divi yang dapat digunakan kembali untuk posting ini. Namun, kita dapat dengan mudah menerapkan teknik yang sama ini untuk membuat blok tata letak Divi yang dapat digunakan kembali untuk apa saja dari pembuat Divi.
Mari kita mulai.
Membuat Blok Tata Letak Divi untuk Posting Blog Gutenberg
Buat atau Edit Posting Blog
Untuk memulai, kita perlu membuat posting blog baru atau mengedit yang sudah ada. Untuk contoh ini, mari tambahkan beberapa konten tiruan ke judul dan isi postingan menggunakan beberapa Blok Judul dan Paragraf. Kemudian tambahkan gambar unggulan dan pilih "Tidak Ada Bilah Sisi" untuk Tata Letak Halaman di bawah Pengaturan Halaman Divi.

Tambahkan Blok Tata Letak Divi Sebaris
Setelah sebagian besar postingan dibuat, yang perlu kita lakukan hanyalah menambahkan Blok Tata Letak Divi baru di mana pun kita inginkan dalam area konten postingan.
Untuk menambahkannya, arahkan kursor ke area yang ingin kita tambahkan optin email. Kemudian klik ikon plus biru untuk menambahkan blok baru. Di daftar blokir popup, pilih blok Divi Layout.

Bangun Tata Letak Baru Dalam Blok Tata Letak Divi
Setelah Blok Tata Letak Divi dipilih, kita akan memiliki opsi untuk "Membangun Tata Letak Baru" atau "Memuat dari Perpustakaan". Karena kita perlu membuat pembagi baru untuk contoh kita, pilih opsi, "Build New Layout".

Desain Tata Letak Menggunakan Divi Layout Block Editor
Setelah kami memilih tombol Bangun Tata Letak Baru, kami dapat mendesain tata letak Divi kami di dalam editor blok tata letak.
Untuk contoh ini, kami akan membuat pemisah atau pembagi khusus menggunakan pembagi bentuk bagian Divi dan latar belakang gradien. Ini benar-benar elemen desain yang akan dapat kita ubah menjadi blok tata letak yang dapat digunakan kembali untuk cara mudah menambahkan pemisah bagian dalam pos Gutenberg.
Untuk membuat desain pembagi bagian, buka pengaturan bagian dan perbarui yang berikut ini:
- Warna Kiri Latar Belakang Gradien: #ddd6f3
- Warna Kanan Latar Belakang Gradien: #faaca8
- Arah Gradien: 90 derajat
- Posisi Awal: 30%

- Gaya Pembagi Atas: lihat tangkapan layar
- Warna Pembagi Atas: #ffffff
- Tinggi Pembagi Atas: 50px

- Gaya Pembagi Bawah: lihat tangkapan layar
- Warna Pembagi Bawah: #ffffff
- Tinggi Pembagi Bawah: 50px
- Balik Pembagi Bawah: Horizontal

- Tinggi: 100 piksel
- Padding: 0px atas, 0px bawah

Setelah desain selesai, pastikan untuk menyimpan blok tata letak Divi.

Sekarang pembagi bagian Divi Layout Block akan muncul di dalam editor posting WordPress.

Ingatlah bahwa jarak di atas dan di bawah tata letak Divi dari blok tata letak mungkin tampak lebih besar di bagian belakang daripada di bagian depan.
Sekarang kami siap untuk mengubah blok tata letak Divi ini menjadi blok tata letak yang dapat digunakan kembali untuk memudahkan menambahkan pembagi bagian yang sama ini di posting mendatang.
Tetapi sebelum kita melakukannya, mungkin membantu untuk mengetahui apa itu blok yang dapat digunakan kembali di WordPress.
Apa itu Blok Tata Letak yang Dapat Digunakan Kembali?
Blok tata letak yang dapat digunakan kembali di Editor Blok default WordPress (Gutenberg) sangat mirip dengan elemen global di Divi. Blok dapat digunakan beberapa kali tetapi konten dan tampilannya tetap sama untuk semua instance. Dan saat kami mengedit blok tata letak yang dapat digunakan kembali, perubahan diterapkan ke semua contoh blok tata letak di seluruh situs. Setelah blok tata letak dibuat dapat digunakan kembali di WordPress, blok akan tersedia dalam daftar blok saat menulis posting. Ini membuatnya sangat nyaman untuk menambahkan blok tata letak yang sama beberapa kali di beberapa posting blog.

Mengubah Blok Tata Letak Divi menjadi Blok Tata Letak yang Dapat Digunakan Kembali
Untuk membuat Blok Tata Letak Divi kami menjadi blok yang dapat digunakan kembali, arahkan kursor ke blok tata letak dan buka menu pengaturan dengan mengeklik ikon tiga titik. Kemudian dari daftar, pilih opsi, "Tambahkan ke Blok yang Dapat Digunakan Kembali".

Kemudian beri nama blok yang dapat digunakan kembali dan klik tombol simpan untuk menyimpan blok sebagai blok yang dapat digunakan kembali.

Sekarang ketika kami menambahkan blok baru di dalam posting blog, kami dapat menemukan blok tata letak baru yang dapat digunakan kembali di dalam daftar (di bawah sakelar kategori Dapat Digunakan Kembali). Cukup klik blok tata letak yang dapat digunakan kembali dan itu akan ditambahkan ke pos.

Sekarang jika kita melihat pada siaran langsung, kita dapat melihat dua contoh pembagi bagian yang sama persis.

Setelah kami menggunakan blok yang dapat digunakan kembali beberapa kali di seluruh posting atau situs, kami dapat mengedit salah satu contoh blok tata letak yang dapat digunakan kembali dan perubahan itu akan diterapkan ke semua contoh blok di seluruh situs.
Untuk mengedit blok tata letak yang dapat digunakan kembali, arahkan kursor ke blok dan klik tombol edit di kanan atas blok.

Kemudian pilih (klik) tata letak di dalam blok yang dapat digunakan kembali dan klik ikon edit di menu atas yang muncul. Kami juga dapat mengklik tautan edit tata letak di bawah tab blokir di bilah sisi kanan.

Kemudian ubah desain layout sesuai keinginan kita. Untuk contoh ini, kita dapat mengubah warna yang digunakan untuk latar belakang gradien.
Setelah menyimpan tata letak, pastikan untuk mengklik tombol simpan di kanan atas blok tata letak yang dapat digunakan kembali. Kemudian perbarui pos dan lihat perubahan di situs langsung.

Anda akan melihat perubahan desain diperbarui untuk semua contoh tata letak yang dapat digunakan kembali.

Tip: Menggunakan Blok Tata Letak yang Dapat Digunakan Kembali sebagai Template
Ada kalanya kami ingin menggunakan versi modifikasi dari blok tata letak yang dapat digunakan kembali pada posting kami. Ini memungkinkan kami untuk menambahkan blok tata letak yang dapat digunakan kembali ke pos sebagai templat awal sehingga kami dapat menyesuaikan blok tata letak untuk contoh tertentu tanpa memengaruhi blok yang dapat digunakan kembali di seluruh situs.
Untuk menggunakan blok tata letak yang dapat digunakan kembali sebagai templat, pertama-tama tambahkan blok yang dapat digunakan kembali ke pos.
Kemudian buka menu blokir dan pilih opsi, "konversi ke blok biasa".

Sekarang kita dapat mengedit tata letak untuk desain tertentu untuk instance ini tanpa memengaruhi blok lain yang dapat digunakan kembali.
Pikiran Akhir
Membuat Blok Tata Letak Divi yang dapat digunakan kembali dapat membantu, terutama untuk elemen desain Divi seperti pembagi bagian. Ini memungkinkan kita untuk menggunakan pembagi berulang kali di seluruh posting kita. Tidak hanya menyederhanakan proses penulisan posting, tetapi juga memberi kita kekuatan untuk memperbarui desain blok di seluruh situs dengan lebih mudah. Dalam posting ini, kami menunjukkan cara menambahkan pembagi bagian sebagai blok yang dapat digunakan kembali, tetapi teknik yang sama ini dapat digunakan untuk membuat blok tata letak Divi yang dapat digunakan kembali tanpa akhir untuk alasan lain yang tak terhitung jumlahnya.
Bisakah Anda mengidentifikasi cara yang berguna untuk memasukkan Blok Tata Letak Divi yang dapat digunakan kembali ke dalam posting blog Anda sendiri?
Saya berharap untuk mendengar dari Anda di komentar.
Bersulang!
