Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Warning

Changes to UI language files

You must have an "__EOF" label at the end of every language file, otherwise the UI will not load correctly and the login form will not display.

Warning

Changes to UI Client Configuration

You should add your custom configuration to the client-config-custom.json file. This new file should contain all custom UI configuration, such as language names and keyboards.
DO NOT make changes to client-config-default.json because your changes will be lost when you upgrade Abiquo.

Warning

If your JSON format is not correct, the Abiquo UI may not function. To check your file, you can use a JSON checker, for example http://jsonformatter.curiousconcept.com/#jsonformatter

...

Create custom UI labels

To create custom UI labels and API error messages:

  1. Go to the language file location which is as follows

    Code Block
    /var/www/html/ui/lang
    

    and find the default language file.

    Code Block
    lang_en_US_labels.json

    (warning) (warning) Do not change lang_en_US_labels.json because the platform will overwrite your changes when you upgrade

  2. To customize the US English labels, create a new custom file in the same folder called:

    Code Block
    lang_en_US_custom.json

  3. Copy any default labels you want to change to this file and enter the new text values. See UI labels, which also provides a change history for upgrades. For example, change "enterprise" to "tenant" in the part of the label after the colon "(:").

    Code Block
        "enterprise.create.title":"Create tenant",
        "configuration.systemproperties.wiki.user.createenterprise":"Create tenant",

  4. Copy any error messages you want to change from the list of default messages on the wiki. See UI error messages. Make appropriate changes, for example, for some sample messages VM-9999 and VM-10000. Tip: the error messages in table format are at User interface messages.

    Code Block
     "server.error.VM-9999":"VM error due to cosmic rays",
     "server.error.VM-10000":"VDC error due to increased sunspot activity",

  5. Your file must always end with the " __EOF " label, for example:

    Code Block
    {
      ... 
    
      "__EOF": "End of file"
    }


    If you do not add the __EOF label, the UI will not load correctly and the login form will not display

  6. Check your JSON format using a JSON validator, for example, https://jsonformatter.curiousconcept.com/#jsonformatter and remember:

    1. Check there are no commas after the last entry in the file, and that there are no missing commas between entries.

    2. You must escape special characters, for example, escape single and double quotation marks ('") and backslashes (\\) with a single or double backslash (\)

  7. Save your file in UTF-8 format

  8. To display your changes, reload the UI UI

The default language of US English is automatically compiled into the Abiquo UI Client, so if there are any problems with the language files, then the client will automatically revert to the default US English.

...

  1. Add the files to the server in the languages folder:

    Code Block
    /var/www/html/ui/lang
  2. Go to the configuration folder

    Code Block
    /var/www/html/ui/config
  3. Edit the client-config-custom.json file 

  4. Add your languages in the order that you want them to appear in the menu. For example, the default configuration is:

    Code Block
    {
        "config.languages" : [
            {"value":"en_US", "name":"English", "isDefault":true, "lcid":"1033", "flagIconUrl": "theme/abicloudDefault/img/country_flags/united-states-of-america.svg"}
        ],
    ...

    For example, to add the Spanish and French languages to the file, add  add a comma after the English entry, and add a new entry for Spanish and French

    Code Block
    {
        "config.languages" : [
    		{"value":"en_US","name":"English","isDefault":true,"flagIconUrl": "theme/abicloudDefault/img/country_flags/united-states-of-america.svg"},
    		{"value":"es_ES","name":"Spanish","lcid": "1034","flagIconUrl": "theme/abicloudDefault/img/country_flags/spain.svg"},
    		{"value":"fr_FR","name":"French","lcid":"1036"}
        ],
    ...
    

    Note that the platform will store the last language used in browser LocalStorage.

  5. (warning) Check your JSON format because the platform will not load the UI with an invalid configuration

    • Check for an extra comma at the end of the list or a missing comma in the list!

  6. (warning) Save the file with UTF-8 encoding to preserve the special characters

  7. For VMware ESXi for VNC, you can also add a keyboard configuration for each language, see Configure Abiquo UI

...

The platform will remember the last language used in the UI and select it on the login screen. The value is stored in the browser's localStorage with “language” language as the key and the language code as the value, for example, “eses_ES” ES for Spanish from Spain. 

...

Customize About and Support messages

...

  • To disable the popups, see Configure Abiquo UI

  • To change the messages in the About and Support popups, change the values of the "about_popup" and "support_popup" labels in the language files.

...

Additional customizations

  • To configure the browser tab name, see Configure Abiquo UI. Note: the platform will ignore the value of the "main.window.application.title" property in the language files.  

  • To configure the browser tab favicon, see Abiquo branding guide

...

  1. Add a message to the Backup tab of the popup to edit virtual machine configuration. See Display optional information message on VM backup tab

  2. Add a custom label for a new icon in the main menu bar. See Add external link in Abiquo header menu

...