Menerjemahkan situs web melibatkan lebih dari sekadar mengganti kata. Bahasa yang berbeda — seperti Jerman, Prancis, atau Spanyol — sering kali menampilkan string teks yang lebih panjang atau struktur tata bahasa yang bervariasi. Saat diterjemahkan, variasi ini dapat mengubah tata letak situs Anda, menyebabkan teks meluap, tombol rusak, atau header tidak sejajar.
Untuk mengatasi hal ini, MultiLipi Editor Visual menyertakan kontrol gaya visual tingkat lanjut. Fitur ini memungkinkan Anda melakukan koreksi terjemahan manual sambil secara bersamaan mengelola tampilan visual elemen halaman individual dalam waktu nyata — semuanya tanpa menulis kode khusus dari awal.
Keunggulan Kustomisasi Gaya Visual
Kontrol penuh atas tata letak dan salinan dalam satu antarmuka terpadu.
Terjemahan + Penataan Gaya dalam Satu Alur Kerja
Menggabungkan terjemahan teks dengan penataan gaya visual di dalam satu antarmuka memberi tim Anda kendali penuh di seluruh halaman web global Anda. Tidak perlu beralih konteks antara dasbor terjemahan dan editor kode — semuanya berada dalam satu permukaan klik-dan-sentuh. Ini adalah bagian inti dari penyampaian pengalaman yang dipoles dan terasa asli yang mendorong SEO Multibahasa hasil nyata.
Cegah Distorsi Tata Letak
Mudah perkecil ukuran font atau sesuaikan lebar wadah untuk bahasa yang secara alami memakan lebih banyak ruang karakter — menghentikan luapan teks dan tata letak tombol yang rusak sebelum mencapai pengunjung Anda.
Pertahankan Estetika Merek yang Ketat
Sesuaikan warna teks, kode hex latar belakang, dan dimensi elemen langsung di halaman yang dilokalkan agar sesuai dengan pedoman merek Anda yang tepat — memastikan setiap versi bahasa terlihat identik dengan situs utama Anda.
Tanpa Gesekan Kode
Lakukan modifikasi tingkat CSS yang tepat menggunakan bilah sisi visual yang intuitif alih-alih menggali kode stylesheet backend. Penyesuaian lanjutan masih tersedia melalui tab CSS Mentah bagi pengembang yang membutuhkannya.
Panduan Langkah demi Langkah: Gaya & Terjemahkan Elemen
Proses mulus, cukup arahkan dan klik pada pratinjau halaman langsung Anda.
Buka Editor Visual
Masuk ke Dasbor MultiLipi dan pilih proyek aktif Anda.
Arahkan ke panel navigasi kiri dan klik pada URL.
Temukan halaman yang ingin Anda perbarui, arahkan kursor Anda ke Editor Visual kolom, dan klik ikon Monitor/Layar untuk meluncurkan pratinjau halaman interaktif.
panel URL — klik ikon Monitor di sebelah kanan untuk membuka Editor Visual
Pilih Elemen Target
Jelajahi pratinjau situs web langsung Anda di dalam editor.
Klik langsung pada blok teks, judul, atau tombol tertentu yang ingin Anda ubah. Batas seleksi akan menguraikan elemen, dan panel konfigurasi akan terbuka.
Perbarui Terjemahan & Konten Teks
Di modal terjemahan tengah, edit teks yang dilokalkan secara manual atau klik Hasilkan Saran AI jika Anda memerlukan frasa alternatif.
Gunakan glosarium proyek atau penggantian memori terjemahan untuk memastikan konsistensi kosakata yang tepat di seluruh situs Anda.
Modal terjemahan — edit manual atau hasilkan saran AI, dengan dukungan glosarium & memori
Sesuaikan Opsi Gaya Visual
Lihat panel CSS Kustom bilah sisi kanan. Di bawah tab Gaya Visual Anda dapat melihat jalur pemilih elemen aktif (misalnya, main#main > section > div > div > h1). Ubah properti tata letak agar sesuai dengan teks terjemahan Anda dengan sempurna:
Lebar & Tinggi: Sesuaikan dimensi wadah atau atur ke otomatis agar konten terjemahan dapat mengalir secara alami.
Ukuran Font: Skalakan teks naik atau turun (dalam piksel) untuk mencegah masalah pemotongan baris yang umum terjadi pada terjemahan bahasa Jerman atau Rusia.
Warna Teks & Warna Latar Belakang: Masukkan kode hex yang tepat (misalnya, #0b1736) untuk mengubah properti warna dan menjaga halaman terlokalisasi Anda tetap sesuai merek.
Bilah sisi CSS Kustom — tab Gaya Visual dengan kontrol lebar, ukuran font, dan warna
Terapkan dan Simpan Perubahan
Setelah tipografi dan koreksi teks Anda terlihat benar, klik tombol biru Terapkan CSS di bagian bawah panel kanan.
Klik Simpan pada modal terjemahan teks untuk mengunci perubahan Anda dan mendorong gaya yang disesuaikan langsung ke pengunjung internasional Anda.
Perubahan gaya Anda hanya berlaku untuk versi terjemahan — halaman bahasa utama Anda tetap tidak tersentuh sama sekali.
Tips Pro: Menggunakan Tab Raw CSS untuk Penyesuaian Lanjutan
Untuk pengembang yang memerlukan kontrol penuh di tingkat stylesheet.
Tab Gaya Visual vs. Tab Raw CSS
Sementara Gaya Visual panel menangani perubahan padding, ukuran, dan warna sehari-hari secara instan, pengembang atau pengguna tingkat lanjut dapat beralih ke Raw CSS tab tepat di sebelahnya.
Ini memungkinkan Anda untuk menulis aturan gaya inline kustom atau media queries untuk viewport lokal tertentu, memastikan halaman global Anda terlihat sempurna di seluruh perangkat desktop, tablet, dan seluler — tanpa menyentuh basis kode utama Anda.
Tab Gaya Visual
- •Slider Padding & margin
- •Kontrol piksel ukuran font
- •Pemilih warna Hex
- •Input lebar / tinggi
- •Terbaik untuk: non-pengembang & perbaikan cepat
Tab Raw CSS
- •Aturan gaya inline kustom
- •Media queries per viewport
- •Selektor pseudo-class
- •Penggantian multi-properti yang kompleks
- •Terbaik untuk: pengembang & kasus khusus
Sempurnakan UI Global Anda Hari Ini
Lokalisasi yang hebat harus terlihat seperti asli, mulus, dan disengaja sepenuhnya.
Dengan memadukan terjemahan otomatis dengan penyesuaian visual waktu nyata, Anda memastikan halaman internasional Anda terlihat sama rapi dengan situs utama Anda. Masuk ke Dasbor MultiLipi, luncurkan Editor Visual, dan mulailah menyempurnakan tata letak global Anda hari ini.
Jelajahi Alat & Panduan Terkait
Menghadapi masalah tata letak yang kompleks? Jika elemen tertentu memerlukan solusi kustom di luar kontrol gaya standar, hubungi Dukungan MultiLipi — tim kami dapat membantu dengan konfigurasi CSS lanjutan untuk templat atau kerangka kerja spesifik Anda.