StatusPage.io

The following step by step tutorial will help you configure your StatusPage.io application with Translation Exchange service and allow you to translate your site to any number of languages.

If you haven't yet setup your project on Translation Exchange, please sign up here and follow the project setup instructions.

Step 1: Login to your StatusPage Dashboard, on the left side menu please select "Customize Page":

Step 2: From top menu click on "Custom CSS/HTML" tab. New page will open with three boxes on the left where you can insert your custom CSS/HTML code:

Step 3: Please enter code snippet from bellow in the "Customer Header HTML" box:

<script src="https://cdn.translationexchange.com/tools/tml/stable/tml.min.js"></script>

<script>  
tml.init({  
  key: "YOUR-PROJECT-KEY",
  translateBody: true,
  translateTitle: true
});
</script>  

IMPORTANT! Make sure to replace "YOUR-PUBLIC-KEY" and "YOUR-PROJECT-KEY" with your project credentials. Click "Save" and "Preview". If you do not have your token, you can get it from your Dashboard.

Translation Exchange provides a default language selector for changing languages. Add the following "div" tag where you would like the language selector to appear.

<div data-tml-language-selector="popup" data-tml-toggle=true data-tml-powered-by=true></div>  

Once you complete the above steps, please refresh your page. To activate the inline translation mode, use the following shortcut: CTRL+Shift+I

When you active the inline translation mode, your application content will be synchronized with Translation Exchange and your strings will appear in your Dashboard.

Integration with StatusPage.io application is now complete. Please follow our simple tutorial on how to order and publish translations for your site.