AI Image Generator untuk Blok Gutenberg dan Kadence!

Diterbitkan: 2023-08-18

Menggunakan kecerdasan buatan (AI) untuk menghasilkan gambar di editor blok WordPress, juga dikenal sebagai Gutenberg, dengan AI Image Lab menjadi lebih mudah dan lebih terintegrasi dengan pembaruan AI Image Lab 1.0.3, yang memperkenalkan blok Gutenberg yang dibuat untuk membuat AI pembuatan gambar bagian mulus dari proses pembuatan konten! Blok Gambar AI dirancang untuk memungkinkan pengguna dengan cepat menghasilkan berbagai gambar buatan AI khusus untuk halaman WordPress atau posting langsung di dalam konten lain, alih-alih menggunakan jendela terpisah atau hamparan perpustakaan media untuk mencoba memilih gambar terbaik di luar konteks elemen sekitarnya. Setelah gambar yang sempurna ditemukan dan dipilih, blok Gambar AI dapat dengan mudah diubah menjadi salah satu dari sejumlah blok inti Gutenberg atau Blok Kadence, yang menyediakan opsi gaya dan tata letak tambahan.

Tutorial Singkat

Tidak ada cara yang lebih baik untuk menunjukkan apa yang dapat dilakukan blok Gambar AI untuk Gutenberg selain dengan sebuah contoh! Kami akan menggunakan blok dari plugin Kadence Blocks, tetapi prosesnya sama saat menggunakan blok inti Gutenberg.

Sebagai contoh, kami akan membuat tata letak beranda dasar untuk perusahaan real estat hipotetis. Struktur halaman akan menyertakan spanduk teratas dengan overlay teks, diikuti oleh baris dua kolom yang berisi gambar dan teks.

Untuk membuat spanduk, kita mulai dengan memasukkan blok AI Image di bagian atas halaman. Dari bilah alat, kami mengubah pengaturan perataan menjadi "Lebar Penuh". Di sidebar pengaturan blok, kami mengubah rasio aspek menjadi "Ukuran khusus" dan memasukkan lebar 2048 (maksimum saat ini) dan tinggi 600. (Ini mengasumsikan kami menggunakan AI Image Lab Pro, karena dimensi maksimum di versi gratisnya adalah 768.)

Selanjutnya, kami memasukkan beberapa teks perintah deskriptif untuk gambar di kotak teks yang ditampilkan di blok. Mari kita coba satu kata saja, “lingkungan”. Kemudian kami mengklik tombol Hasilkan Gambar dan menunggu blok diisi dengan gambar. Karena gambar kita cukup lebar, gambar pratinjau mungkin agak kabur karena pratinjau ditampilkan pada resolusi yang lebih rendah daripada gambar akhir dalam mode HD.

Kita sekarang dapat menggunakan panah di bilah alat AI Image block untuk menavigasi melalui gambar pratinjau. Jika kita mendekati akhir kumpulan gambar pratinjau, kumpulan baru dibuat secara otomatis, jadi mungkin ada penundaan jika kita menjelajahi banyak gambar pratinjau dengan cepat. Kapan saja, kita dapat mengklik tombol edit di toolbar blok untuk mengubah teks prompt; setiap perubahan yang kami buat di sidebar pengaturan blokir juga akan memicu serangkaian gambar baru untuk dihasilkan. Setelah kami menemukan gambar yang ingin kami gunakan, kami mengeklik ikon tanda centang di bilah alat, yang akan mengunduh gambar beresolusi penuh ke situs kami dan membuatnya menggantikan pratinjau beresolusi rendah yang ditampilkan di blok. Proses ini mungkin memerlukan sedikit waktu karena resolusi tinggi yang kami pilih.

Berikut adalah gambar yang kami gunakan untuk contoh ini:

Karena kita ingin melapisi beberapa teks pada gambar ini dan juga membuat beberapa perubahan gaya lainnya, kita harus mengubah blok AI Image menjadi blok berbeda yang lebih sesuai dengan kebutuhan kita. Dalam hal ini, kami akan menggunakan blok Tata Letak Baris dari Blok Kadence. Cukup klik ikon Gambar AI di paling kiri bilah alat blok dan pilih Tata Letak Baris di bawah "Transformasi Ke" (dengan asumsi plugin Kadence Blocks aktif). Saat diminta, kami memilih tata letak kolom tunggal untuk baris tersebut.

Kita mungkin perlu mengatur ulang perataan pada blok Tata Letak Baris ke lebar penuh pada saat ini. Kami juga ingin mengatur padding atas dan bawah ke 3XL, dan pergi ke Pengaturan Overlay Latar Belakang beralih di tab Style dari sidebar pengaturan blok dan aktifkan overlay hitam dengan opacity 60% sehingga ada lebih banyak kontras antara teks dan gambar latar belakang. Kemudian kita dapat memasukkan blok "Teks (Adv)" di baris, atur warna teks menjadi putih, perataan ke tengah, Tag HTML ke "H1", dan tinggi garis ke 2. Sekarang kita tambahkan teks kita, yang mana dapat mengakibatkan berikut sebagai contoh yang sangat mendasar:

Untuk baris dua kolom di bawah spanduk, kami menyisipkan blok Tata Letak Baris lainnya, kali ini dengan tata letak 2 kolom. Kami menyisipkan blok Gambar AI di setiap kolom dan menetapkan rasio aspek untuk setiap blok menjadi "3:2 (lanskap)" (dalam contoh ini, kami membiarkan dimensi piksel pada default, tetapi dalam produksi hal itu mungkin harus disesuaikan sekaligus untuk menghasilkan ukuran file gambar yang lebih kecil). Untuk kolom kiri, kami menggunakan teks prompt gambar "gedung apartemen", dan di kolom kanan hanya "rumah". Berikut adalah pratinjau gambar yang akan kami gunakan, sebelum mengunggahnya dan mengubah blok Gambar AI:

Selanjutnya, klik tombol tanda centang di bilah alat untuk setiap blok Gambar AI untuk mengunggah gambar, dan saat unggahan selesai, klik ikon blok Gambar AI di sebelah kiri bilah alat dan pilih opsi untuk mengubah setiap gambar menjadi Info Blok kotak dari Blok Kadence. Setelah beberapa teks ditambahkan, halaman kami terlihat seperti ini:

Kesimpulan

Sementara plugin AI Image Lab telah kompatibel dengan Gutenberg sejak rilis beta pertamanya berkat integrasinya dengan perpustakaan media WordPress dan pemilih media, blok AI Image membawa integrasi itu ke tingkat berikutnya dengan memungkinkan pengguna untuk membuat, melihat pratinjau, dan mengunggah gambar yang dihasilkan AI tepat dalam konteks yang akan digunakan, membuatnya lebih mudah untuk memilih gambar yang bekerja dengan baik dengan konten di sekitarnya, untuk menemukan rasio tinggi lebar yang tepat, dan untuk memvisualisasikan produk akhir. Dengan kompatibilitas (opsional) dengan plugin Kadence Blocks bawaan, AI Image Lab adalah alat canggih yang dirancang untuk memungkinkan pembuat konten Gutenberg membuat visual berbasis blok yang mengagumkan!

Lab Gambar AI bebas digunakan dengan beberapa batasan tentang berapa banyak gambar yang dapat Anda unggah ke situs Anda setiap 24 jam, seberapa tinggi resolusi gambar tersebut, dll. Untuk kekuatan lebih dalam membuat gambar berkualitas tinggi, lihat Rencana AI Image Lab Pro!