Translating Your App

You can translate your app by providing a translation file and creating a language settings page. You can also integrate with the  WPML plugin to translate WordPress content.

1. First, download our sample translation files* and add your translations.

In this package you'll find json files such as es.json, and de.json.

* Important! Rename your folder to i18n.

For example:

	"Language Name": "Deustch",
	"Logout": "Ausloggen",
	"Back": "Zurück",

The word on the left is the word in the app that needs to be translated, the word on the right is the native translation. Any word that you need translated has to be in this file, and the file must be named by it's two letter language code, such as en.json, es.json, de.json, etc.

You must include "Language Name" in any translation file.

Find all the translation strings in the en.json file, you can duplicate that file and change it for any language. You must also add any words from your menus and custom page titles. For example, if you have a menu item titled "My Profile," add that string to each translation file.

Optional language direction

If the language needs to change direction to rtl (Right to Left), then you need to add the dir parameter to the language file.

For example:

	"Language Name": "العربية",
	"dir": "rtl",
	"Language Settings": "مقدمة",
	"Intro": "مقدمة",
	"Login": "مقدمة",

2. Next, zip the i18n folder with your json translation files inside, and upload it under translation files.

When you are finished editing the files, you need to zip them.

Select only the files, not the folder, and compress into a zip file.

Rename the file

Upload this zip file in your app customizer Settings tab, under Translation Files.

Save, then refresh the page. You should then see the default languages menu populated.

AppPresser 3 Only
For AppPresser 3, do not change the i18n folder name. If you need to upload other files along with your translation files, zip them along with the i18n folder.

Upload your .zip file to the offline files in the app customizer "Settings" tab, and save.

Now, you need a way for users to select what language they want to use.

3. Create a custom HTML page with a language setting

AppPresser 4: see this article

If you just purchased, you are using AppPresser 4. Please click the link above.

AppPresser 3 Language Settings

AppPresser 3 only: Go to your app customizer => Custom Pages, and create a new page. Select custom HTML, and add this code:

    {{ 'Settings' | translate }}

  <button ion-item (click)="showLanguages()">{{ 'Language Settings' | translate }}</button>


Add all of your translations as indicated in the code above, and save the page. Add it to your menu and rebuild the app, and your app is translation ready!

Note: this feature does not work in the AppPresser 3 Preview app. Please test in the browser preview, or your own test app.

The language files you included in your assets will automatically show on this settings page. If you add new language files, you will have to rebuild and resubmit your app.

(The update data item above can be uncommented and used to update colors and menus when clicked)


The showLanguages() function is used on your button to open a modal (popup) and can be configured with a title and a CSS class name.

Parameters Type Required Usage
options json object optional Two options are title and cssClass.  You can use either one, both or use no options at all.

{title:'Switch Languages', cssClass:'switch-language-modal'}

Example using showLanguage() with options

<ion-button (click)="showLanguages({title:'Switch Languages', cssClass:'switch-language-modal'})">
    Open the Language Choices

Set a Default Language

If you prefer to set a default language other than English you can set this on the Customizer under the settings tab. You will need to upload your first and then rebuild your app.  Then you will need to refresh the page for the customizer to scan your app's i18n folder in order to populate the dropdown.

Translate WordPress Content With WPML

The translation files you included above only handle text strings in the app itself, not on your WordPress site.  To translate WordPress content, you can use the  WPML plugin.

Please note: we do not provide technical support for WPML, please contact the plugin authors for translation support.

This plugin is very popular for translating WordPress, and costs as little as $29.

Once you configure WPML and add your translations, your app will automatically load translated WordPress pages  and posts based on your language settings page. API list pages are also translated. No special setup is required, but you should make sure you have done the following:

WPML Settings

In our testing, we found the following settings are required:

  • Language url format has to be "Language name added as a parameter ( - German)" Note: some customers see issues with this setting, and choose "Different languages in directories" instead.
  • Add these to "Preserve URL arguments" - appp,list_type,num  You must also add any custom parameters you are using for WordPress list pages, such as category, author, etc.
  • Disable browser language redirect (checked)

WordPress App List Page

If you are using the App List page, go to the page editor and select these check boxes and click "duplicate"

All WordPress content needs to be manually translated with the WPML plugin, and certain things like custom post types and custom fields require extra setup. Please  consult WPML for help, we do not provide technical support for translating your WordPress site.

Translation Issues

If there are any issues with either the translations or selecting a default language, in most scenarios, it will be caused by an error in the JSON file. In order to check that your file does not have any errors, upload it to a JSON Validator, such as and if there are any errors, fix them then upload to My AppPresser again.