28. Translation

Are you working on a bilingual or multilingual website? Setting up your website within a content management system (CMS) is just the start. To enhance user experience and provide ease of navigation, you'll need to incorporate a language switcher or translation element. This feature will enable visitors to easily toggle between languages. Here's a guide on how to bring in and style out this element:

Step 1: Adding the Translation Element

From the "Add Elements" drawer on the left of your CMS interface, scroll down to find "Translation". Click, hold, and drag this element into your page layout. A common and convenient place to drop it is in the website header.

Step 2: Styling the Translation Element

Once the translation element is added, click on it and align it where you want it to go on your page. "Settings" allows you to change the width of the box in which the language switcher appears, as well as the height, which essentially adds padding at the top and sides. However, you still have normal styling, additional padding, and margins as you need.

Step 3: Customizing the Translation Element

For more specific settings, head over to the left side of your CMS interface. Here, you can choose whether to display the full language name or only a language code, and adjust the spacing between flags and names. You can also deactivate the flag option and adjust size and spacing accordingly.

Step 4: Coloring and Typography

Change the typography to match your site's style. Note that the color option only applies to the top link within this element. To customize the drop-down menu color, select "Open drop down menu". Here, you can change the color to suit your design.

Step 5: Checking Mobile Responsiveness

Remember to check how your language switcher looks on different devices, such as tablets and mobile phones. This step ensures that the switcher not only looks good but also fits various designs.

Building and maintaining a multilingual website can be complex, but with the right tools and know-how, you can create a user-friendly, multilingual online presence. Your website visitors will appreciate the ease of switching between languages, ensuring they have the best possible user experience.