ARTIKEL BANTUAN

Cara Menggunakan Editor Blok HTML di Editor Visual MultiLipi

MultiLipi
MultiLipi•27 Okt 2026•
5 Menit baca
Cara Menggunakan Editor Blok HTML di Editor Visual MultiLipi
Penyuntingan visual tingkat lanjutTidak diperlukan perubahan file sumber

MultiLipi Editor Blok HTML memberikan Anda kontrol struktural atas halaman web yang diterjemahkan langsung di dalam Editor Visual. Ganti markup yang ada, sisipkan spanduk dan ajakan bertindak yang dilokalkan, sembunyikan blok untuk satu bahasa, dan gunakan kembali cuplikan HTML yang disimpan di seluruh alur kerja Anda.

Ini berguna ketika halaman yang diterjemahkan memerlukan lebih dari sekadar perubahan teks—misalnya, promosi khusus pasar, ajakan bertindak yang dilokalkan, struktur bagian yang berbeda, atau konten yang hanya boleh muncul untuk satu audiens. Jika Anda baru mengenal ruang kerja ini, mulailah dengan panduan Editor Visual MultiLipi dan ikhtisar editor terjemahan.

Apa yang akan Anda pelajari

1Buka Editor Blok HTML
2Pilih elemen halaman web yang tepat
3Navigasikan hierarki elemen
4Ganti konten HTML yang ada
5Sisipkan HTML sebelum atau sesudah elemen
6Sembunyikan blok untuk satu bahasa
7Buat dan gunakan kembali cuplikan yang disimpan
8Pratinjau, simpan, dan pulihkan dengan aman

1. Apa itu Editor Blok HTML?

Kontrol struktural untuk bahasa dan halaman terjemahan tertentu.

Editor Blok HTML adalah fitur canggih di dalam Visual Editor MultiLipi. Alih-alih membatasi perubahan pada salinan yang terlihat atau CSS, fitur ini memungkinkan Anda bekerja dengan HTML dari elemen yang dipilih melalui panel khusus.

  • Ganti bagian bahasa Inggris dengan bagian bahasa Hindi yang disesuaikan sepenuhnya.
  • Sisipkan spanduk promosi yang dilokalkan sebelum deskripsi produk.
  • Tambahkan CTA khusus pasar setelah paragraf yang ada.
  • Sembunyikan bagian yang tidak relevan bagi audiens satu bahasa.
  • Gunakan kembali markup promosi yang sama di beberapa halaman terjemahan.
FiturFungsinya
TerjemahkanMengubah teks terjemahan dalam konten yang dipilih
GayaMenyesuaikan presentasi visual elemen yang dipilih
Blok HTMLMengganti, menyisipkan, atau menyembunyikan HTML spesifik bahasa
CSS KustomMenerapkan perubahan presentasi berbasis CSS

2. Buka Editor Blok HTML

Pilih bahasa, targetkan elemen, lalu buka kontrol HTML-nya.

1
Masuk ke Dasbor MultiLipi, buka proyek situs web yang relevan, dan luncurkan Editor Visual.
2
Pilih bahasa terjemahan yang dituju. Tinjau manajemen bahasa or bahasa yang tersedia jika bahasa belum dikonfigurasi.
3
Arahkan kursor ke pratinjau halaman web dan pilih elemen yang tepat yang ingin Anda sesuaikan. MultiLipi mungkin mengidentifikasinya sebagai DIV, H1, P, atau SPAN.
4
Pilih HTML di bilah alat mengambang. Editor Gaya terbuka dengan Blok HTML tab aktif.
MultiLipi Editor Visual dengan elemen halaman web yang dipilih dan tindakan Terjemahkan, Gaya, dan HTML terlihat

MultiLipi Editor Visual dengan elemen halaman web yang dipilih dan tindakan Terjemahkan, Gaya, dan HTML terlihat

Gambar 1.1 — Editor Visual: elemen halaman web yang dipilih dengan tindakan Terjemahkan, Gaya, dan HTML.

Bilah alat mengambang memisahkan terjemahan konten, penataan visual, dan struktur HTML. Untuk perubahan yang hanya bersifat presentasi, gunakan Gaya atau ikuti panduan CSS kustom; gunakan HTML jika markup itu sendiri harus diubah.

MultiLipi Editor Blok HTML yang menampilkan elemen yang dipilih, kolom konten HTML, Pratinjau, dan kontrol Simpan HTML

MultiLipi Editor Blok HTML yang menampilkan elemen yang dipilih, kolom konten HTML, Pratinjau, dan kontrol Simpan HTML

Gambar 1.2 — Editor Blok HTML: elemen yang dipilih, kolom konten HTML, dan kontrol simpan.

3. Memahami antarmuka

Baca tag saat ini, tab, hierarki, dan cakupan induk sebelum melakukan pengeditan.

01

Identifikasi elemen

Tag yang dipilih—seperti DIV atau H1—muncul di bagian atas panel.

02

Tab editor

Visual menangani penataan gaya, Blok HTML menangani markup, dan CSS Kustom menangani aturan presentasi.

03

Hierarki elemen

Breadcrumb seperti html > body > main > div menunjukkan lokasi elemen yang dipilih.

04

Navigasi induk

Navigasi induk memindahkan pilihan ke luar menuju elemen penampung saat Anda memerlukan cakupan yang lebih luas.

4. Memahami tindakan pengeditan HTML

Pilih apakah akan mengganti bagian dalam atau menambahkan markup di samping pilihan.

MultiLipi Dropdown tindakan Blok HTML yang menampilkan Ganti Konten Dalam, Sisipkan Sebelum Elemen, dan Sisipkan Setelah Elemen

MultiLipi Dropdown tindakan Blok HTML yang menampilkan Ganti Konten Dalam, Sisipkan Sebelum Elemen, dan Sisipkan Setelah Elemen

Gambar 1.3 — Dropdown tindakan Blok HTML: ganti konten dalam, sisipkan sebelum, dan sisipkan setelah.

4.1 Ganti Konten Dalam (innerHTML)

Ini menggantikan anak dari elemen yang dipilih sambil mempertahankan elemen luar yang dipilih. Ini adalah pilihan yang tepat untuk mengganti judul, membangun kembali blok konten, atau membuat presentasi lokal yang berbeda.

HTML
<!-- Kontainer yang dipilih asli -->
<div>
  <h2>Selamat Datang di Toko Kami</h2>
  <p>Temukan produk terbaru kami.</p>
</div>

<!-- HTML dalam baru -->
<h2>Selamat Datang di Toko Kami</h2>
<p>Temukan produk terbaru kami.</p>

4.2 Sisipkan Sebelum Elemen

Menambahkan markup kustom tepat sebelum pilihan tanpa menghapus konten yang sudah ada. Gunakan ini untuk pemberitahuan yang dilokalkan, pengantar, spanduk kampanye, atau penjelasan khusus pasar.

HTML
<div class="localized-banner">
  <p>Penawaran spesial untuk pelanggan kami di Indonesia</p>
</div>

4.3 Sisipkan Setelah Elemen

Menambahkan markup tepat setelah elemen yang dipilih. Ini berfungsi dengan baik untuk tombol kontak, konten terkait, rekomendasi produk, dan ajakan bertindak yang dilokalkan.

HTML
<div class="localized-cta">
  <a href="/contact/">Hubungi Tim Kami</a>
</div>

5. Edit HTML di dalam halaman web yang diterjemahkan

Masukkan markup yang valid, periksa hasilnya, dan simpan melalui alur kerja yang didukung.

1
Pilih heading, paragraf, kontainer, atau elemen lain yang ingin Anda modifikasi.
2
Buka Blok HTML dari toolbar mengambang atau tab Editor Gaya.
3
Pilih Ganti Konten Internal, Sisipkan Sebelum Elemen, atau Sisipkan Setelah Elemen.
4
Masukkan atau modifikasi markup di kolom KONTEN HTML.
5
Klik Pratinjau dan periksa tipografi, spasi, tata letak, tautan, dan perilaku responsif.
6
Klik Simpan HTML, lalu konfirmasikan bahwa perubahan yang disimpan tetap terlihat di pratinjau halaman.
HTML
<div class="custom-section"><h2>Selamat Datang di Platform Global Kami</h2><p>Jelajahi produk dan layanan kami dalam bahasa pilihan Anda.</p></div>

Elemen umum mencakup judul, paragraf, kontainer, span, penekanan, tautan, dan daftar. Untuk terminologi yang harus tetap konsisten di seluruh terjemahan, konfigurasikan MultiLipi aturan glosarium daripada menduplikasi perubahan HTML secara manual. Untuk lokalisasi gambar dan visual, gunakan alur kerja terjemahan media.

6. Sembunyikan blok untuk bahasa tertentu

Hapus konten yang tidak relevan dengan pasar dari satu pengalaman yang diterjemahkan.

Yang Sembunyikan dalam bahasa ini kontrol menyembunyikan blok yang dipilih hanya untuk bahasa yang sedang diedit. Ini bisa sesuai untuk penawaran khusus pasar, produk yang tidak tersedia, atau pengantar lokal alternatif.

1
Buka halaman web yang telah diterjemahkan di Editor Visual.
2
Pilih elemen atau kontainer induk yang ingin Anda sembunyikan.
3
Buka tab Blok HTML.
4
Aktifkan Sembunyikan dalam bahasa ini.
5
Simpan dan verifikasi hasilnya dalam versi bahasa yang sama.

7. Membuat dan mengelola cuplikan HTML yang dapat digunakan kembali

Simpan markup yang berulang sekali, lalu pilih dari pustaka cuplikan Anda.

Cuplikan HTML yang Dapat Digunakan Kembali menyediakan pustaka bergaya WPCode untuk spanduk, pemberitahuan, CTA, blok produk, dan tata letak kustom yang berulang. Buka Cuplikan HTML, lalu pilih + Cuplikan Baru or Buat Cuplikan Pertama.

MultiLipi Pengelola Cuplikan HTML yang Dapat Digunakan Kembali yang menampilkan pustaka cuplikan, tombol Cuplikan Baru, dan status kosong

MultiLipi Pengelola Cuplikan HTML yang Dapat Digunakan Kembali yang menampilkan pustaka cuplikan, tombol Cuplikan Baru, dan status kosong

Gambar 1.4 — Cuplikan HTML yang Dapat Digunakan Kembali: pustaka cuplikan, Cuplikan Baru, dan status kosong.
HTML
<div class="global-promo">
  <h3>Temukan Layanan Kami</h3>
  <p>Jelajahi solusi yang dirancang untuk bisnis internasional.</p>
  <a href="/contact/">Hubungi Kami</a>
</div>

Setelah menyimpan, kembali ke Blok HTML dan gunakan Sisipkan Cuplikan Tersimpan.... Tautan + Kelola di dekatnya akan membuka kembali pengelolaan cuplikan.

8. Sesuaikan judul dan elemen individual

Pertahankan tag semantik saat mengubah markup internal yang dilokalkan.

Untuk menyesuaikan H1, pilih judul itu sendiri, konfirmasikan tag yang dipilih adalah H1, pilih Ganti Konten Internal, edit markup, pratinjau, dan simpan.

MultiLipi Editor Blok HTML mengedit HTML internal dari judul H1

MultiLipi Editor Blok HTML mengedit HTML internal dari judul H1

Gambar 1.5 — Editor Blok HTML: mengedit judul H1 dengan konten HTML kustom.
HTML
<span>Optimalisasi LLM melampaui</span>:
Rekayasa di Balik Visibilitas AI

9. Pratinjau, simpan, pulihkan, dan konten dinamis

Pahami bagaimana status penyuntingan memengaruhi terjemahan dan konten yang dimuat.

Pratinjau

Periksa markup bersarang, tautan, spasi, dan tata letak sebelum menyimpan.

Simpan HTML

Pertahankan modifikasi saat ini melalui alur kerja editor yang didukung.

Pulihkan

Gunakan tindakan pemulihan yang tersedia, lalu verifikasi cakupannya secara tepat.

10. Praktik terbaik untuk kustomisasi HTML

Jaga perubahan lokal agar tetap presisi, valid, responsif, dan aman.

  • Pilih elemen terkecil yang mencapai hasil yang diinginkan.
  • Utamakan penyisipan jika konten asli harus tetap ada.
  • Pastikan tag tetap valid, tertutup, dan bersarang dengan benar.
  • Uji tautan yang telah dilokalkan alih-alih berasumsi /contact/ akan teratasi dengan benar di setiap bahasa.
  • Hindari skrip yang tidak tepercaya, penangan acara, dan kode sematan yang tidak dikenal.
  • Periksa kontrol viewport desktop dan seluler sebelum menyimpan.
  • Gunakan cuplikan untuk struktur yang berulang dan aturan glosarium untuk terminologi yang berulang.
  • Jangan menyembunyikan fungsionalitas penting hanya untuk menyederhanakan tata letak yang dilokalkan.

Untuk tata letak kanan-ke-kiri (RTL), tinjau dukungan bahasa RTL. Jika pengunjung harus secara otomatis diarahkan ke lokal yang sesuai, konfigurasikan pengalih bahasa pengunjung. Untuk pekerjaan konten massal, panduan impor dan ekspor terjemahan mungkin lebih efisien daripada pengeditan HTML elemen demi elemen.

11. Pemecahan masalah umum

Diagnosis masalah cakupan, tindakan, sintaksis, dan status terjemahan.

01

Tab Blok HTML tidak muncul

Pilih elemen halaman web yang dapat diedit, lalu pilih HTML dari bilah alat mengambang atau buka Blok HTML di Editor Gaya.

02

Konten menghilang setelah penggantian

Anda kemungkinan mengganti elemen anak dari kontainer induk. Pulihkan jika perlu, pilih elemen yang lebih kecil, dan coba lagi.

03

HTML yang disisipkan berada di posisi yang salah

Konfirmasikan tindakan Sebelum/Sesudah dan target yang dipilih. Navigasi induk mengubah cakupan penyisipan.

04

Judul yang sama muncul dua kali

Ganti konten bagian dalam judul yang ada alih-alih menyisipkan judul lain di sampingnya.

05

HTML kustom terlihat tidak benar

Periksa sintaksis, tag penutup, CSS situs yang ada, dimensi induk, dan perilaku viewport responsif.

06

Konten dinamis tidak tersedia

Berhenti mengedit, biarkan terjemahan dan pemuatan dinamis selesai, lalu mulai mengedit kembali.

07

Cuplikan yang dapat digunakan kembali hilang

Konfirmasikan bahwa cuplikan telah disimpan di HTML Snippets atau + Kelola, lalu buka kembali Sisipkan Cuplikan Tersimpan.

08

Blok tersembunyi masih terlihat

Verifikasi kontainer yang dipilih, bahasa saat ini, status tersimpan, dan rendering dinamis yang tertunda.

12. Daftar periksa Editor Blok HTML Akhir

Langkah terakhir sebelum Anda menyelesaikan perubahan HTML yang dilokalkan.

Halaman web terjemahan yang benar sudah terbuka
Elemen dan tag yang dituju sudah dipilih
Hierarki induk dan cakupan sudah benar
Tindakan pengeditan yang sesuai sudah dipilih
Konten anak yang diperlukan sudah dipertahankan
HTML yang disisipkan berada di posisi yang tepat
Visibilitas bahasa sudah sesuai dengan tujuan
Cuplikan yang dapat digunakan kembali sudah disimpan
Markup valid dan bersumber dengan aman
Tautan dan tombol berfungsi
Pratinjau desktop dan seluler terlihat benar
Simpan HTML telah digunakan dan diverifikasi

Pertanyaan yang sering diajukan

Jawaban cepat untuk alur kerja Editor Blok HTML yang umum.

Apa itu Editor Blok HTML di MultiLipi?
Ini adalah fitur Editor Visual untuk mengganti atau menyisipkan HTML, mengelola visibilitas blok khusus bahasa, dan menggunakan cuplikan yang dapat digunakan kembali pada halaman web yang diterjemahkan.
Apakah saya memerlukan pengalaman pengodean?
Pengetahuan dasar HTML disarankan. Pengeditan sederhana dapat menggunakan markup yang ada, tetapi penggantian yang kompleks memerlukan pemahaman tentang struktur dan penumpukan yang valid.
Bisakah saya menambahkan HTML tanpa menghapus konten yang ada?
Ya. Gunakan Sisipkan Sebelum Elemen atau Sisipkan Setelah Elemen alih-alih Ganti Konten Dalam.
Bisakah saya menyembunyikan bagian untuk satu bahasa?
Ya. Pilih blok yang sesuai dan aktifkan Sembunyikan dalam bahasa ini untuk halaman terjemahan saat ini.
Bisakah saya membuat cuplikan HTML yang dapat digunakan kembali?
Ya. Buka Cuplikan HTML, buat dan simpan cuplikan, lalu pilih melalui Sisipkan Cuplikan Tersimpan di editor.
Apakah ini mengubah kode sumber asli situs web saya?
Anggap ini sebagai operasi penyuntingan halaman terjemahan yang dikelola oleh MultiLipi. Antarmuka tidak menunjukkan bahwa perubahan ditulis kembali ke CMS atau repositori sumber asli Anda.
Mengapa terjemahan dijeda saat menyunting?
Menjeda menjaga konten yang dipilih tetap stabil. Untuk konten dinamis yang baru dimuat, hentikan penyuntingan, biarkan terjemahan selesai, lalu mulai menyunting kembali.

Siap untuk menyesuaikan?

Bangun pengalaman lokal yang lebih baik

Mulailah dengan elemen terkecil yang sesuai, pratinjau setiap perubahan struktural, dan simpan hanya setelah memeriksa hasilnya pada ukuran desktop dan seluler.

Apakah artikel ini membantu?

Dalam artikel ini

Bagikan

Siap Go Global?

Mari diskusikan bagaimana MultiLipi dapat mengubah strategi konten Anda dan membantu Anda menjangkau audiens global dengan optimasi multibahasa yang didukung AI.

Isi formulir ini dan tim kami akan menghubungi Anda dalam waktu 24 jam.