Bagian dan blok

Anda dapat menggunakan bagian di tema untuk membuat tata letak yang diinginkan untuk toko online Anda. Bagian terdiri dari berbagai jenis blok yang masing-masing memiliki fungsi spesifik, seperti teks, tombol, gambar tunggal, kolase gambar, atau tautan.

Bagian dan blok memberikan fleksibilitas dalam cara Anda menyusun konten, dan memungkinkan Anda mengontrol gaya dan nuansa toko online tanpa perlu mengedit kode, termasuk opsi kustomisasi berikut:

• Anda dapat menyusun ulang bagian dalam templat, dan menyusun ulang blok di dalam bagian.
• Bagian dan blok dapat memiliki pengaturan kustomisasi tertentu.
• Anda dapat menghubungkan bagian dan blok yang kompatibel untuk menampilkan informasi dinamis di toko online dari data kustom, seperti menambahkan petunjuk perawatan untuk produk Anda. Pelajari selengkapnya tentang menghubungkan sumber dinamis.

Bagian dan blok yang tersedia di editor tema bergantung pada tema dan versi tema Anda. Misalnya, tema Anda mungkin memiliki blok Slide yang hanya dapat ditambahkan ke bagian Tayangan slide, dan blok teks Judul yang dapat ditambahkan ke semua bagian tema Anda. Untuk informasi selengkapnya tentang opsi yang tersedia, lihat dokumentasi tema Anda.

Batas maksimum bagian dan blok

Bagian dan blok memiliki batasan maksimum berikut:

• Setiap templat dapat memiliki hingga 25 bagian.
• Setiap templat dapat memiliki hingga 1.250 blok di semua bagian. Jumlah blok yang pasti, dan jumlah setiap jenis blok yang dapat Anda tambahkan ke setiap bagian bergantung pada sumber bagian dan blok, serta ditentukan oleh desainer tema untuk tema Anda. Misalnya, jika tema Anda memiliki bagian Pendaftaran email, Anda mungkin hanya dapat menambahkan satu blok Formulir email.
• Blok yang mendukung penumpukan dapat memiliki hingga delapan tingkat blok bertumpuk.

Sumber blok

Tergantung pada struktur tema Anda, dan aplikasi yang telah Anda instal, tema Anda mungkin berisi berbagai bagian yang menerima blok dari sumber yang berbeda. Saat Anda menambahkan blok ke suatu bagian, semua blok yang tersedia untuk bagian tersebut akan ditampilkan di pemilih blok. Tergantung pada tema dan versi tema Anda, Anda dapat menambahkan jenis blok berikut ke bagian di tema Anda:

• Blok aplikasi adalah blok yang menambahkan fungsionalitas ke tema Anda. Anda dapat menggunakan blok aplikasi untuk memposisikan ulang area tema yang ditambahkan oleh aplikasi terinstal ke area tertentu di halaman pada tema Anda.
• Blok bagian adalah blok yang ditentukan dalam bagian tertentu.
• Blok tema adalah blok yang ditentukan dalam tema Anda dan dapat memiliki fungsionalitas dinamis, seperti penumpukan.

Tema Anda dapat berisi beberapa bagian yang menggunakan blok bagian dan bagian lain yang menggunakan blok tema. Satu bagian dapat menerima blok tema atau blok bagian, tetapi tidak dapat menerima campuran keduanya.

Ketersediaan blok aplikasi dalam bagian bergantung pada fungsionalitas aplikasi, dan apakah bagian tersebut dapat menerima blok aplikasi.

Blok bagian

Blok bagian adalah blok yang dirancang untuk bagian tertentu. Suatu bagian dapat memiliki batasan untuk jenis blok bagian, dan membatasi jumlah jenis blok tertentu yang dapat Anda tambahkan.

Contoh bagian dengan blok bagian

Misalnya, tema Anda memiliki bagian Pendaftaran email. Anda dapat menggunakan bagian ini untuk menambahkan formulir pendaftaran buletin agar pelanggan dapat berlangganan buletin Anda. Setelah Anda menambahkan bagian Pendaftaran email, Anda dapat menambahkan masing-masing satu blok berikut:

• blok Formulir email
• blok Judul
• blok Subjudul

Jika Anda menambahkan blok Formulir email dan mengeklik Tambahkan blok untuk menambahkan blok lain, maka blok Formulir email tidak akan lagi ditampilkan sebagai opsi di pemilih blok. Batasan ini membantu mencegah masalah apa pun dalam menangkap email pelanggan, dan memastikan bahwa pelanggan dapat dengan mudah memasukkan alamat email mereka.

Jika Anda telah menambahkan ketiga blok yang tersedia untuk bagian Pendaftaran email, maka pemilih blok akan menampilkan pesan bahwa semua blok yang tersedia telah digunakan.

Blok tema

Blok tema adalah blok yang ditentukan dalam tema Anda dan dapat memiliki fungsionalitas dinamis, seperti penumpukan. Bagian yang menerima blok tema dapat menerima berbagai blok yang berbeda, tergantung pada struktur bagian tersebut. Bagian yang menerima blok tema mungkin menerima semua blok tema yang tersedia, subkumpulan blok tertentu, atau blok yang unik untuk bagian tersebut. Blok tema mungkin juga memiliki perilaku berikut:

• Beberapa blok mendukung penumpukan, sehingga Anda dapat menumpuk blok di dalam blok lain hingga delapan tingkat.
• Beberapa bagian memiliki blok yang wajib ada. Anda dapat menyesuaikan atau menyembunyikan blok ini, tetapi Anda tidak dapat menyusun ulang atau menghapusnya.
• Beberapa blok ditampilkan secara otomatis di suatu bagian ketika kondisi tertentu terpenuhi.

Contoh bagian dengan blok tema

Misalnya, tema Anda memiliki bagian Tayangan slide dengan blok tema.

Di bagian tayangan slide tema Anda, saat Anda mengeklik Tambahkan blok, Anda dapat memilih blok Slide dari pemilih blok. Tidak ada jenis blok lain yang tersedia. Jika Anda mencoba menambahkan blok Slide ke bagian lain di tema Anda, seperti bagian Banner gambar, maka Slide tidak tersedia. Ini adalah contoh blok yang dibatasi.

Setelah Anda menambahkan blok Slide ke bagian Tayangan slide, Anda dapat mengeklik Tambahkan blok untuk menambahkan blok tambahan ke blok Slide mana pun di bagian Tayangan slide, seperti Judul, Gambar, dan Tombol. Blok-blok ini disarangkan di dalam blok Slide. Ini adalah contoh blok bersarang.

Jika Anda menambahkan blok Slide kedua ke bagian Tayangan slide, tema akan otomatis menambahkan blok Kontrol tayangan slide. Blok ini menampilkan tombol yang dapat diklik pengunjung situs Anda untuk beralih dari satu slide ke slide lainnya. Anda dapat menyesuaikan gaya tombol atau menyembunyikan kontrol, tetapi Anda tidak dapat menghapus blok tersebut. Ini adalah contoh blok wajib yang ditampilkan secara kondisional.

Kompatibilitas blok tema

Untuk mengakses blok tema, tema Anda harus memiliki bagian yang mendukung blok tema. Anda dapat memeriksa apakah tema Anda mendukung blok tema di dalam kode tema. Jika ada direktori blocks di sidebar editor liquid, berarti Anda menggunakan tema yang mendukung blok tema. Anda juga dapat memeriksa dokumentasi tema Anda.

Langkah-langkah:

1. Dari admin Shopify Anda, buka Toko Online > Tema.

2. Di sebelah tema yang ingin Anda periksa, klik tombol , lalu klik Edit Kode.

3. Di sidebar, cari folder blocks.

   

Menyesuaikan templat tema dengan bagian dan blok

Saat Anda membuka editor tema, beranda toko Anda akan dimuat secara default. Anda dapat menggunakan menu tarik-turun untuk memilih templat lain, seperti produk, koleksi, halaman, atau blog, atau menggunakan bilah pencarian di menu tarik-turun templat untuk mencari templat tertentu. Saat Anda memilih templat, templat akan dimuat di editor tema, dan semua perubahan yang Anda buat akan ditampilkan pratinjaunya di editor.

Tambahkan bagian

Tambahkan bagian baru ke halaman mana pun di toko online Anda.

Langkah-langkah:

Edit bagian

Susun ulang bagian atau blok

Anda dapat mengubah urutan bagian pada templat halaman Anda dan menyusun ulang blok di dalam bagian-bagian tersebut. Selain itu, Anda dapat memindahkan blok yang kompatibel di antara bagian yang berbeda. Misalnya, jika beranda Anda memiliki dua bagian Tayangan slide, Anda dapat menyeret blok Slide dari satu tayangan slide ke tayangan slide lainnya.

Anda tidak dapat memindahkan blok ke bagian lain jika jenis blok tidak kompatibel atau jika bagian tersebut telah mencapai batas maksimum bloknya. Jika Anda mencoba memindahkan bagian atau blok ke lokasi yang tidak valid, bagian atau blok tersebut akan kembali ke posisi semula.

Anda juga dapat menggunakan pemeriksa pratinjau untuk menyusun ulang bagian. Pelajari selengkapnya tentang penggunaan pemeriksa pratinjau di editor tema.

Langkah-langkah:

Menduplikasi bagian atau blok

Anda dapat menduplikasi bagian atau blok untuk membuat salinan identik dari bagian atau blok tersebut.

Setelah Anda menduplikasi blok, blok baru akan ditambahkan ke bagian yang sama. Jika Anda ingin memindahkan blok ke bagian baru atau mengubah urutan blok, Anda dapat mengatur ulang blok. Anda juga dapat menyalin blok, lalu menempelkannya langsung ke bagian yang berbeda.

Menyalin dan menempel blok

Jika ingin menggunakan blok yang sama di beberapa bagian, Anda dapat dengan mudah menyalin dan menempelkannya ke bagian yang berbeda. Anda juga dapat menyalin dan menempelkan blok di dalam bagian yang sama, atau dapat memilih untuk menduplikasi blok. Blok yang diduplikasi akan mempertahankan semua pengaturan dan konten dari blok asli.

Langkah-langkah:

1. Dari admin Shopify Anda, buka Toko Online > Tema.

2. Di samping tema yang ingin Anda edit, klik Edit tema.

3. Untuk menyalin dan menempel blok di beranda, pilih secara langsung atau gunakan menu tarik-turun Beranda untuk memilih templat tertentu yang berisi bagian atau blok yang ingin Anda edit.

4. Klik kanan blok yang ingin Anda duplikasi, lalu klik Salin.

5. Di bagian yang sama, atau bagian yang berbeda, klik kanan di bagian tersebut, lalu klik Tempel.

6. Klik Simpan.

Menyembunyikan atau menghapus bagian atau blok

Mengganti nama bagian atau blok

Secara default, judul bagian atau blok di menu sidebar editor tema dan detail pengaturan ditetapkan sebagai jenis blok atau bagian, seperti "Koleksi" atau "Teks".

Untuk blok, jika pengaturan blok berisi kolom teks, seperti judul atau deskripsi, teks tersebut juga akan ditambahkan ke judul di menu sidebar. Jika ada lebih dari satu kolom teks, maka kolom teks pertama yang berisi konten akan ditambahkan. Saat Anda mengubah teks di kolom teks, judul blok akan berubah untuk menyertakan teks yang diperbarui. Nama bagian atau blok tidak boleh kosong.

Misalnya, Anda menambahkan bagian Multikolom ke templat halaman dengan blok Kolom. Blok kolom memiliki pengaturan Judul dengan teks default Kolom, dan pengaturan Deskripsi dengan teks default Sandingkan teks dengan gambar untuk fokus pada produk, koleksi, atau postingan blog pilihan Anda.. Judul bagian default adalah Multikolom. Judul blok Kolom default adalah Kolom - Kolom. Jika Anda menghapus teks dari bagian Judul, judul blok akan diperbarui menjadi Kolom - Sandingkan teks dengan gam...

Anda dapat mengganti nama bagian atau blok apa pun menjadi nama kustom dari pengaturan bagian atau blok tersebut di menu sidebar editor tema.

Langkah-langkah:

Menggunakan blok

Blok adalah modul yang dapat disesuaikan yang digunakan untuk menambahkan konten ke bagian di templat. Anda dapat menggunakan blok untuk menambahkan teks, gambar, tautan, tombol, dan lainnya.

Tema Shopify memiliki bagian dan blok yang dapat disesuaikan. Beberapa bagian memiliki tipe blok tetap, yang berarti Anda hanya dapat memilih dari blok yang disediakan untuk bagian tersebut oleh desainer tema.

Bagian lain memungkinkan Anda untuk memilih blok apa pun, tetapi ada batasan jumlah total blok yang dapat ditambahkan ke bagian tersebut. Jika bagian Anda mencapai jumlah maksimum blok yang tersedia, maka opsi Tambah blok akan berwarna abu-abu dan tidak dapat diklik atau diketuk.

Anda dapat menggunakan pencarian untuk menemukan blok tertentu berdasarkan nama, atau memilih blok dari menu tarik-turun pemilih blok. Blok tema Anda mungkin diurutkan ke dalam beberapa kategori di pemilih blok, seperti Koleksi untuk blok dengan pemilih koleksi, atau Media untuk blok gambar dan video.

Pratinjau blok akan ditampilkan di pemilih blok sehingga Anda dapat meninjau tampilan blok tersebut sebelum menambahkannya.

Tambahkan blok

Menggunakan bidang meta dan metaobjek dengan sumber dinamis

Anda dapat menggunakan bidang meta dan metaobjek untuk menampilkan informasi dinamis di toko online Anda. Jika Anda memiliki tema yang mendukung bidang meta, Anda dapat menghubungkan metafield ke pengaturan bagian atau blok yang kompatibel di editor tema.

Misalnya, jika Anda menjual lilin, Anda mungkin ingin menampilkan waktu bakar untuk setiap lilin yang tersedia di toko. Setelah Anda menyiapkan metafield produk untuk Waktu bakar di bagian Data kustom pada pengaturan admin Shopify, Anda dapat menambahkan blok teks ke bagian utama templat produk. Di blok teks, Anda dapat mengeklik tombol pada pengaturan teks dan memilih metafield Waktu bakar. Informasi waktu bakar kini akan ditampilkan di produk Anda.

Jika Anda memiliki tema Shopify, Anda dapat menghubungkan sebagian besar bidang meta dan metaobjek ke tema Anda dengan menggunakan editor tema. Jika Anda menggunakan tema lain, atau jika Anda ingin menambahkan jenis data kustom yang tidak didukung tema Anda, Anda dapat mengedit kode tema atau mempekerjakan Mitra Shopify untuk membantu Anda. Pelajari selengkapnya tentang mempekerjakan Mitra Shopify.

Tidak semua bagian atau blok mendukung sumber dinamis. Periksa versi arsitektur tema dan opsi kustomisasi yang tersedia di editor tema untuk menentukan apakah tema Anda mendukung sumber dinamis.

Anda dapat menampilkan informasi dinamis di toko online dengan menambahkan bagian atau blok yang dapat menggunakan sumber dinamis. Sumber dinamis dapat digunakan di templat, bagian, atau blok mana pun yang menampilkan sumber daya yang kompatibel (produk, koleksi, halaman, blog, dan postingan blog). Anda perlu menambahkan metafield sebelum dapat menghubungkannya di templat Anda. Lihat Sumber dinamis untuk informasi selengkapnya tentang penggunaan bidang meta dan metaobjek dengan sumber dinamis di tema Anda.

Setelah menyelesaikan proses pengaturan, ikuti langkah-langkah di bawah untuk menghubungkan sumber dinamis ke bagian atau blok di tema Anda menggunakan tombol .

Langkah-langkah:

Pelajari selengkapnya tentang menampilkan bidang meta di toko online Anda dan menampilkan metaobjek di toko online Anda.

Pemilih sumber dinamis

Anda dapat menggunakan pemilih sumber dinamis untuk menghubungkan sumber dinamis yang benar secara langsung di editor tema. Tinjau fitur-fitur utama pemilih sumber dinamis berikut:

• Anda dapat mereferensikan sumber dinamis dari berbagai sumber daya, jika berlaku. Misalnya, jika Anda menghubungkan pengaturan ke blok yang terhubung ke sumber daya produk dan sumber daya halaman, Anda dapat menggunakan menu tarik-turun di pemilih sumber dinamis untuk menentukan apakah Anda ingin mencari bidang meta yang terkait dengan sumber daya produk atau sumber daya halaman.
• Pemilih sumber dinamis memiliki fungsionalitas pencarian dan filter untuk membantu Anda menemukan metafield yang Anda butuhkan.
• Pemilih sumber dinamis memungkinkan Anda memilih bidang meta kategori. Ini adalah atribut tambahan yang menjadi tersedia saat Anda menetapkan kategori produk ke suatu produk. Mengakses bidang meta ini memungkinkan Anda menghubungkan sumber dinamis ke bidang relevan mana pun pada metaobjek atribut yang mendasarinya.