Editor blok WordPress secara berkelanjutan memberikan peluang baru untuk kustomisasi situs. Pada tutorial ini, kita akan melihat penggunaan blok untuk membuat menu situs dalam dua bahasa, dan pengalih bahasa yang memungkinkan pengunjung untuk mengubah tampilan bahasa situs yang mereka lihat.
Anda dapat melihat demo tentang cara kerjanya di sini:
Dalam panduan ini
- Catatan dan referensi
- Metode
- 1. Penyiapan Halaman dan Slug Halaman
- 2. Pilih Tata Letak untuk Menu dan Pengalih Bahasa Anda
- 3. Buat Pengalih Bahasa
- 4. Tambahkan Menu Navigasi untuk Halaman Anda dengan Bahasa Pertama
- 5. Simpan Menu dan Pengalih Bahasa Baru Anda
- 6. Menu dengan Bahasa Kedua
- 7. Tambahkan Menu Baru Anda ke Halaman Lainnya
- 8. Tambahkan Lebih Banyak Halaman
- Pengalih bahasa ini tidak akan menerjemahkan halaman tetapi Anda dapat menampilkan situs dengan dua bahasa atau lebih kepada pengunjung. Anda perlu menerjemahkan halamannya sendiri!
- Pengalih bahasa ini hanya akan mengalihkan pengguna ke halaman beranda untuk tiap bahasa.
- Anda juga perlu memperbarui menu jika menambahkan halaman ekstra ke situs.
- Pengaturan awal memerlukan waktu tetapi setelah selesai, penyetelan dan pembaruan bisa dilakukan dengan cepat.
Tutorial ini memanfaatkan fungsi-fungsi berikut:
- Slug Halaman
- Halaman Induk dan Turunan
- Halaman Depan Statis
- Blok Kolom
- Blok Paragraf
- (Opsional) Gambar pada Baris (tersedia di bilah peralatan Blok Paragraf)
- Blok Navigasi
- Blok Pakai Ulang
1. Siapkan Halaman dan Slug Halaman
2. Pilih Tata Letak untuk Menu dan Pengalih Bahasa Anda
3. Buat Pengalih Bahasa
4. Tambahkan Menu Navigasi
5. Simpan Menu dan Pengalih Bahasa Baru Anda
6. Menu dengan Bahasa Kedua
7. Tambahkan Menu Baru Anda ke Halaman Lainnya
8. Tambahkan Lebih Banyak Halaman
Untuk meningkatkan efektivitas tutorial ini, kami menyarankan Anda untuk menggunakan salah satu tema yang kompatibel dengan Editor Blok kami, yang tersedia di sini.
Buka Situs Saya > Situs > Halaman. Mulailah dengan membuat satu halaman beranda untuk tiap bahasa yang ditampilkan di situs. Anda belum perlu menambahkan banyak konten; judul halaman cukup untuk sekarang.
Publikasikan tiap halaman untuk melakukan pembaruan, lalu ubah Slug Halaman tiap halaman sehingga merujuk ke bahasanya. Pada contoh ini, halaman beranda dengan Bahasa Prancis berjudul Accueil, disertai dengan slug halaman /fr/
:
![](https://en-support.files.wordpress.com/2019/12/frslug.png?w=1024)
Tetapkan halaman beranda dengan bahasa yang Anda inginkan sebagai halaman depan statis untuk situs Anda. Ini memastikan pengunjung situs untuk melihat situs dalam satu bahasa terlebih dahulu, dan dapat beralih ke bahasa yang lain.
Setelah memiliki semua halaman beranda yang diperlukan, buat beberapa halaman konten untuk bahasa lainnya. Anda masih belum perlu menambahkan konten. Untuk sekarang, Anda cukup memposkan halaman berisi judul saja.
Saat membuat halaman ini, tetapkan sebagai Halaman Turunan dari halaman beranda bahasa pilihan Anda, menggunakan bagian Atribut Halaman:
![Gambar: Menunjukkan judul halaman, dan bagian Atribut Halaman tempat menentukan halaman induk.](https://en-support.files.wordpress.com/2019/12/parentpagesetting.png?w=1024)
Contoh – ikhtisar struktur halaman
![Gambar: Ikhtisar struktur halaman induk dan turunan.](https://en-support.files.wordpress.com/2020/04/parentchildstructure.png)
Di Situs Saya > Situs > Halaman, klik pada judul halaman beranda bahasa utama Anda untuk membukanya di editor WordPress.
Di bawah judul halaman pada editor, tambahkan Blok Kolom, lalu pilih tata letak dua kolom. Jika Anda berubah pikiran untuk tata letak yang dipilih, jangan khawatir karena Anda bisa mengubahnya di pengaturan blok. Lihat panduan Blok Kolom untuk informasi lengkap cara melakukannya.
Kami sarankan untuk menggunakan tata letak dengan porsi satu kolom lebih besar dan satu kolom lebih kecil. Kolom yang lebih kecil akan memuat pengalih bahasa dan kolom yang lebih besar akan memuat menu Anda.
Atur Blok Kolom menjadi lebar atau lebar penuh:
![Gambar: Menunjukkan perataan lebar untuk blok kolom](https://en-support.files.wordpress.com/2019/12/columnalignment.png?w=1024)
Ada dua metode untuk menampilkan pengalih bahasa Anda – Anda bisa mengetik nama bahasanya, atau menggunakan gambar pada baris untuk menampilkan bendera.
Catatan: Kami tidak menyarankan penggunaan bendera sebagai representasi bahasa karena dua alasan:
1. Lebih sulit diakses pengunjung yang mungkin tidak bisa melihat gambar bendera
2. Dapat menyebabkan kebingungan akibat kesalahpahaman pengunjung terkait bendera dan bahasa – tidak semua orang memiliki tingkat pemahaman yang sama!
Agar lebih jelas, kami menyarankan Anda menggunakan metode tautan teks (metode 1 atau 2).
Metode 1 – tautan teks pada Blok Navigasi
![Gambar: menunjukkan Blok Navigasi pada daftar blok.](https://en-support.files.wordpress.com/2019/12/navlang1.png)
Anda kemudian dapat mengubah teks tiap item agar menampilkan namanya dalam bahasa yang sesuai (atau versi singkatan.):
![Gif animasi: Mengubah teks tiap tautan pada blok navigasi.](https://en-support.files.wordpress.com/2019/12/navlang2.gif)
Metode 2 – tautan teks pada Blok Paragraf
![Gambar: Menunjukkan pemilihan Blok Paragraf pada daftar blok.](https://en-support.files.wordpress.com/2019/12/addparagraph.png?w=1024)
Ketik nama bahasa dengan format yang Anda inginkan, misalnya “EN” dan “FR”, atau “Bahasa Inggris” dan “Bahasa Prancis”.
Sorot tiap nama bahasa, lalu klik tombol Masukkan Hyperlink untuk menautkan nama bahasa tersebut dengan halaman berandanya. Contoh:
![Gif animasi: menyorot satu bagian teks dan mengaturnya sebagai tautan ke halaman situs](https://en-support.files.wordpress.com/2019/12/textlink1.gif)
![Gif animasi: menyorot satu bagian teks dan mengaturnya sebagai tautan ke halaman situs](https://en-support.files.wordpress.com/2019/12/textlink2.gif)
Metode 3 – gambar pada baris
![Gambar: menunjukkan pemilihan Blok Paragraf pada daftar blok.](https://en-support.files.wordpress.com/2019/12/addparagraph.png?w=1024)
![Gambar: menu Pilihan Lainnya pada Blok Paragraf, dengan Gambar pada Baris disorot](https://en-support.files.wordpress.com/2019/12/inline1.png)
Ketika gambar ditambahkan, Anda bisa mengeklik gambar untuk mengatur ulang ukurannya:
![Gif animasi: Pilih gambar pada baris Anda dan pemilih ukuran akan muncul.](https://en-support.files.wordpress.com/2019/12/resizeflag.gif)
![Gif animasi: Klik gambar pada baris untuk memilihnya, kemudian klik tombol 'tautan'. Lalu Anda bisa memilih halaman yang ingin ditautkan.](https://en-support.files.wordpress.com/2019/12/linkimg.gif)
Di kolom yang lebih besar, tambahkan Blok Navigasi. Klik kolom yang kosong untuk membuka menu blok, cari Navigasi atau buka bagian Elemen Tata Letak:
![Gambar: menunjukkan subbagian Elemen Tata Letak pada daftar Blok, dengan blok Navigasi berada di sisi blok kanan atas bagian tersebut.](https://en-support.files.wordpress.com/2019/12/navblock1.png?w=1024)
Bloknya akan muncul dengan dua pilihan – pilih Buat kosong. Anda akan melihat blok siap digunakan untuk menambahkan halaman:
![](https://en-support.files.wordpress.com/2019/12/navblock2.png?w=1024)
Tambahkan tautan untuk tiap halaman dengan bahasa pertama Anda. Klik tombol Tambah Blok (tombol “+” warna hitam) di sebelah kanan blok navigasi untuk menambahkan tautan tambahan:
![](https://en-support.files.wordpress.com/2019/12/navblock3.gif?w=1024)
Gunakan tombol Navigasi Blok di atas editor untuk menentukan kolom Anda:
![Gif animasi: Menggunakan Navigasi Blok untuk menentukan blok kolom yang memuat menu navigasi dan pengalih bahasa.](https://en-support.files.wordpress.com/2019/12/selectcolumns.gif?w=1024)
Gunakan Bilah Peralatan Blok Kolom untuk menampilkan lebih banyak pilihan, lalu pilih Tambahkan ke blok pakai ulang:
![Gambar: menunjukkan Bilah Peralatan Blok dan pilihan Tambahkan ke blok pakai ulang.](https://en-support.files.wordpress.com/2019/12/addtoreusable.png?w=1012)
Beri nama blok pakai ulang baru Anda agar mudah dikenali, seperti Menu – Bahasa Inggris. Anda bisa mempelajari selengkapnya tentang cara kerja Blok Pakai Ulang di panduan ini.
Jangan lupa Perbarui halaman Anda untuk menerapkan perubahan ke halaman. Selamat, pembuatan menu pertama dan pengalih bahasa Anda telah selesai!
Untuk membuat menu dengan bahasa kedua, Anda dapat mengikuti langkah 1-5, atau bisa menggunakan pintasan:
Buka salah satu halaman dengan bahasa kedua Anda di editor WordPress. Klik tombol Tambahkan Blok (tombol “+” warna hitam) untuk menambahkan blok baru ke halaman. Pada daftar blok, gulir langsung ke bagian paling bawah untuk melihat kategori blok pakai ulang, tempat menu Anda disimpan. Anda juga dapat menggunakan kotak pencarian untuk menemukannya.
![Gif animasi: menggunakan menu blok untuk mencari blok pakai ulang.](https://en-support.files.wordpress.com/2019/12/findblock.gif?w=1024)
Setelah blok menu ditambahkan ke halaman tersebut, gunakan menu Pilihan Lainnya untuk Mengubah ke Blok Reguler:
![Gambar: Menunjukkan menu Pilihan Lainnya dan pilihan Ubah ke Blok Reguler.](https://en-support.files.wordpress.com/2019/12/converttoregular.png?w=928)
Setelah blok tersebut muncul sebagai blok reguler alih-alih blok pakai ulang, Anda bisa memperbarui Blok Navigasi agar menautkan halaman dengan bahasa kedua.
Metode 1 – hapus lalu tambahkan ulang Blok Navigasi baru
![Gambar: Menunjukkan navigator blok dan cara untuk memilih blok](https://en-support.files.wordpress.com/2019/12/blocknavigator2.png)
![Gambar: Menunjukkan menu Pilihan Lainnya pada Blok Navigasi, dan pilihan Hapus Blok](https://en-support.files.wordpress.com/2019/12/removenavblock.png)
Metode 2 – ubah item navigasi
![Gif animasi: mengubah item Blok Navigasi](https://en-support.files.wordpress.com/2019/12/changenavitem.gif)
Ketika Anda melakukan perubahan, simpan blok kolom baru ini sebagai Blok Pakai Ulang baru seperti padalangkah 5di atas, lalu beri nama baru yang menunjukkan bahwa blok tersebut adalah menu dengan bahasa kedua Anda.
Jangan lupa Perbarui halaman Anda untuk menerapkan perubahan ke halaman. Selamat, pembuatan menu kedua dan pengalih bahasa Anda telah selesai!
Menu dan pengalih bahasa Anda telah siap. Sekarang Anda bisa menambahkan menu dua bahasa ke halaman lainnya, seperti yang dijelaskan pada langkah 6 di atas. Perhatikan: setelah blok pakai ulang disimpan, Anda bisa menambahkannya ke halaman lain tanpa perlu mengubahnya ke blok reguler.
Apakah Anda sudah membuat halaman lain untuk masing-masing bahasa, dan perlu menambahkannya ke menu? Jangan khawatir, Anda bisa menyunting blok pakai ulang, dan akan diterapkan ke setiap halaman yang memuat blok tersebut. Detail selengkapnya tersedia di sini.