> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.teleporthq.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Localization in TeleportHQ

**Here is a quick guide to use localization (internationalization) in TeleportHQ to create multilingual websites.**

| [Enable localization](#2-enable-localization) | [Add a new language](#2-add-a-new-language) | [Add Language Switcher](#2-add-language-switcher) | [Manage localized text](#2-manage-localized-text) | [Set up main language](#2-set-up-main-language) | [Purchase new language slot](#2-purchase-new-language-slot) |

## Enable localization

||| Keep in mind that once enabled there is no way to disable localization. We recommend duplicating the project before enabling Localization.

To enable website localization in TeleportHQ, from the editor:

* Click on the Localization button in the Top-left of the Canvas (it will have English by default)
* Click Enable
* In the new modal select the Main language and click Enable

![Enabling localization](https://storage.crisp.chat/users/helpdesk/website/60c4bca58bb99c00/1-localization_b4ds6e.gif)

## Add a new language

To add a new language:

* Click on the **Localization button** in the Top-left of the Canvas just as before
* Click **Add Language**
* Search and select the language from the dropdown list
* In the new confirmation modal click **Add language**

||| IMPORTANT: You cannot add a new language if you do not have an available language slot purchased. Learn more about [How to purchase language slots](#2-purchase-new-language-slot).

![Adding a new localization language](https://storage.crisp.chat/users/helpdesk/website/60c4bca58bb99c00/2-localization_1xdaf8w.gif)

## Add language switcher

To make it possible to switch from one language to another you will need to add a language switcher somewhere on the page, generally it is added in the Navbar or Footer.

To add a language switcher to your website:

* Go to the **Left panel** -> **Elements** tab -> **Interactive** category
* Drag the **Lang switcher** interactive element to the website

To edit the repeatable content inside of the switcher, you can navigate to it by selecting the switcher and clicking Show in the Dropdown settings in the Right panel. You can then drag or add elements into the **Language switcher item**. This can be useful for example if you want to add a language flag inside of each **Language Switcher Item**. 

To add flags for each language you will need to add all of the language flags in the Language Switcher Item container and then use [Conditional rendering](/en/article/how-to-use-conditional-rendering-ugtqhd/) to show the proper flag when the correct language is displayed. 

| Keep in mind that the language container is a repeatable element, so you only need to edit one element.

![How to add and edit a language switcher](https://storage.crisp.chat/users/helpdesk/website/-/6/0/c/4/60c4bca58bb99c00/language-switcher_1gu85wd.gif)

## Manage localized text

To manage and update any text, original or translated:

* Click on the Localization button in the Top-left of the Canvas just as before
* Click Update content
* In the new window you can search and make changes to any text in the project
* Optional: Enable Automatically translate content switch to apply changes to the default languages to all other languages.

![Managing localized text](https://storage.crisp.chat/users/helpdesk/website/60c4bca58bb99c00/3-localization_1mprbed.gif)

## Set up main language

Once localization is enabled on a website you are able to select which one is the main lanugage.

To select the main language: 

* Go to the **Top Left part of the Canvas** where the languages are displayed
* **Enable the dropdown** menu
* From the Dropdown menu click on the **ellipsis icon** to open the settings
* Select **Set as Main Language**

![How to set up main language](https://storage.crisp.chat/users/helpdesk/website/-/6/0/c/4/60c4bca58bb99c00/main-language_1jfj0l4.gif)

## Purchase new language slot

Adding a new language to a project requires an empty language slot. Language slots are purchased at workspace level, which means that you can buy more than one and use them across different projects. To purchase a new language slot, from the Dashboard:

* Go to **Workspace settings**
* Choose the **Extra language** dropdown
* Click on the **Purchase Language Slot** button
* **Finalize the purchase** of the slot.

![How to purchase extra languages](https://storage.crisp.chat/users/helpdesk/website/-/6/0/c/4/60c4bca58bb99c00/extra-languages_1367xm.png)

| Now that you have an available language slot you can add languages to your projects.