Summary

  • Overview
  • Video Lesson
  • Add Language Element
  • Add Site Language
  • Quick Navigation In Language List
  • Language Layout
  • Language Options
  • Language Element Properties
  • Best Practice
  • Delete Warning

Overview

The Language Element allows website creators to translate web content into other languages. It also allows switching languages on live websites. You can add the Language Element to the HTML, WordPress, and Joomla sites and sites published from the Desktop Applications to Nicepage Hosting.

IMPORTANT! You cannot use the Language Element in the Nicepage Online Editor. We are working on that.

Video Lesson

See Also

More video lessons

Add Language Element

Add the Language element to the Add Panel's selected Header or Footer Block.

add-language-element.png

Add Site Language

After adding the Language Element, you see the Tooltip informing you to add another language for translating a website.

language-element-tooltip-arrow.png

You can add a new Site Language.

  1. Select the Language element.
  2. Go to the Property Panel to the right.
  3. Click the Add button.
  4. Select the Language from the list in the Add Language dialog.
  5. Click the OK button.

See the new Language added to the Language Element.

add-site-language.gif

Quick Navigation In Language List

In the Add Language dialog, quickly navigate to the Language group by pressing the first letter of the Language Name.

quick-navigation-add-language.gif

Language Layouts

Choose one of the six layouts of the Language Element for the website.

language-layouts.png

You can switch the Language Layout in the Property Panel for the selected Language element in the Header or Footer.

language-layout-property-panel.gif

Language Options

Open the Language Option Menu in the Property Panel by clicking on the Icon to move the Language up and down, edit the Language Name, change its Icon, and delete it.

language-option-menu.png

Edit Language Name

You can now edit the Language Name by choosing the Rename variant from the Options Menu, clicking on it in the Property Panel, and editing it in the dialog.

edit-language-name.gif

Move Languages

You can rearrange Languages by clicking the Move from the Options Menu or dragging the three-dot Icon to the left of the Language in the Property Panel.

rearrange-languages.gif
language-spacing.gif

Delete Languages

Delete a Language from the Language Element by selecting from the Options or clicking the Bucket icon. All translations remain on the Project, and you can restore them anytime by adding the same Language back.

delete-language.png

Language Element Properties

Language Icon Spacing

You can modify Spacing between the Flag icons in the Language Element by dragging or adding a value in the Spacing property of the Property Panel.

Language Text Styling

Change the Text and Spacing Properties in the Property Panel for the Horizontal Language layouts.

language-text-property.png

Switch the Language Layout in the Property Panel for the selected Language element in the Header or Footer.

language-text-spacing-property.png

Language Dropdown Styling

You can also modify the Item and Dropdown Properties in the Property Panel for the Dropdown List layouts of the Language Element.

language-item-property.png

Best Practice

After you add the second Language, you will see the Best Practice dialog with hints about translating texts.

best-practice-add-language.png

After you click ok, you will see the Arrow and the Tooltip similar to those in the Getting Started Tutorial pointing to the Language Switcher.

language-switcher-arrow.png

Language Delete Warning

You will see the warning when you delete the Language Element since your site visitors cannot switch the site language.

delete-language.png

## Summary - Overview - Video Lesson - Add Language Element - Add Site Language - Quick Navigation In Language List - Language Layout - Language Options - Language Element Properties - Best Practice - Delete Warning ## Overview The Language Element allows website creators to translate web content into other languages. It also allows switching languages on live websites. You can add the Language Element to the HTML, WordPress, and Joomla sites and sites published from the Desktop Applications to Nicepage Hosting. **IMPORTANT! You cannot use the Language Element in the Nicepage Online Editor. We are working on that.** ## Video Lesson ## <iframe width="600" height="330" src="https://www.youtube.com/embed/Bmwbj5p3bK4"" title="Nicepage Lesson: Language Element. Site Translations" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> ### See Also [More video lessons](page:1318) ## Add Language Element Add the Language element to the Add Panel's selected Header or Footer Block. !add-language-element.png! ## Add Site Language After adding the Language Element, you see the Tooltip informing you to add another language for translating a website. !language-element-tooltip-arrow.png! You can add a new Site Language. 1. Select the Language element. 2. Go to the Property Panel to the right. 3. Click the Add button. 4. Select the Language from the list in the Add Language dialog. 5. Click the OK button. See the new Language added to the Language Element. !add-site-language.gif! ## Quick Navigation In Language List In the Add Language dialog, quickly navigate to the Language group by pressing the first letter of the Language Name. !quick-navigation-add-language.gif! ## Language Layouts Choose one of the six layouts of the Language Element for the website. !language-layouts.png! You can switch the Language Layout in the Property Panel for the selected Language element in the Header or Footer. !language-layout-property-panel.gif! ## Language Options Open the Language Option Menu in the Property Panel by clicking on the Icon to move the Language up and down, edit the Language Name, change its Icon, and delete it. !language-option-menu.png! ### Edit Language Name You can now edit the Language Name by choosing the Rename variant from the Options Menu, clicking on it in the Property Panel, and editing it in the dialog. !edit-language-name.gif! ### Move Languages You can rearrange Languages by clicking the Move from the Options Menu or dragging the three-dot Icon to the left of the Language in the Property Panel. !rearrange-languages.gif! !language-spacing.gif! ### Delete Languages Delete a Language from the Language Element by selecting from the Options or clicking the Bucket icon. All translations remain on the Project, and you can restore them anytime by adding the same Language back. !delete-language.png! ## Language Element Properties ### Language Icon Spacing You can modify Spacing between the Flag icons in the Language Element by dragging or adding a value in the Spacing property of the Property Panel. ### Language Text Styling Change the Text and Spacing Properties in the Property Panel for the Horizontal Language layouts. !language-text-property.png! Switch the Language Layout in the Property Panel for the selected Language element in the Header or Footer. !language-text-spacing-property.png! ### Language Dropdown Styling You can also modify the Item and Dropdown Properties in the Property Panel for the Dropdown List layouts of the Language Element. !language-item-property.png! ## Best Practice After you add the second Language, you will see the Best Practice dialog with hints about translating texts. !best-practice-add-language.png! After you click ok, you will see the Arrow and the Tooltip similar to those in the Getting Started Tutorial pointing to the Language Switcher. !language-switcher-arrow.png! ## Language Delete Warning You will see the warning when you delete the Language Element since your site visitors cannot switch the site language. !delete-language.png! ##