Message Customization

This section describes how to customize messages using JavaScript files and CSS files.

Adding Customization Groups

Add a customization group for each target or purpose of the customization.
Set the following information to customization groups:

  • Users, organizations, or roles for which you want to apply customizations
  • JavaScript files required for customization
  • CSS files required for customization
Steps:
  1. You can prepare JavaScript files and CSS files yourself.

  2. Click the administration menu icon (gear icon) in the header.

  3. Click "System settings".

  4. Select "Application settings" tab.

  5. Click "Messages".

  6. Click "JavaScript and CSS customization".

  7. On the "JavaScript and CSS customization" screen, click "Add customization group".

    Image with an action link to add customization groups surrounded by a red frame

  8. On the "Add Customization Group" screen, enter the "Customization Group name" field.

    You should set the name of the customization group.

    Image of the input field of customization group name

  9. In the "Applied to" field, click "Edit" and select the target for which you want to apply the customization.

    Select the target from the user, organization, or role. By default, the logged-in user has been set for the target.
    You also can select users who are not allowed to use Messages. Selecting such users does not cause an error.
    However, customizations are not applied to users who are not allowed to use Messages.
    The targets display in the order set automatically. Cannot change.

    Image of an edit action link surrounded by a red frame

    Image of selecting targets for customization

  10. In the "JavaScript customization" field, set the JavaScript file you want to apply.

    You can add up to 30 files or links.

    • File:
      Only files with a file extension of ".js" can be added.
      Up to 5 MB of files can be uploaded.
    • Link:
      Specify a URL starting with "https://" in up to 512 characters.

    Image of an add a JavaScript file action link

  11. In the "CSS customization" field, set the CSS file you want to apply.

    You can add up to 30 files or links.

    • File:
      Only files with a file extension of ".css" can be added.
      Up to 5 MB of files can be uploaded.
    • Link:
      Specify a URL starting with "https://" in up to 512 characters.

    Image of an Add CSS file action link

  12. You can change the order of the files and links as needed.

    JavaScript files run from top to bottom.
    Select the check boxes for the files and links you want to reorder, and then click "Move Up" or "Move Down".
    Image of a reordering action link surrounded by a red frame

  13. In the "Customization" field, select "Apply".

    Image of the Apply radio button surrounded by a red frame

  14. Confirm your settings and click "Add".

  15. On the screen where the customizations are applied, confirm that the design and item functions are fine.

Changing Customization Groups

Change the settings in the customization group.

Steps:
  1. Click the administration menu icon (gear icon) in the header.

  2. Click "System settings".

  3. Select "Application settings" tab.

  4. Click "Messages".

  5. Click "JavaScript and CSS customization".

  6. On the "JavaScript and CSS customization" screen, click the customization group name of the customization group to change.

  7. On the "Customization group details" screen, click "Edit".

    Image of an edit action link surrounded by a red frame

  8. On the "Edit customization group" screen, set the required items.

  9. Confirm your settings and click "Save".

  10. On the screen where the customizations are applied, confirm that the design and item functions are fine.

Reordering Customization Groups

Reorder the customization groups.
The JavaScript file and the CSS file are imported from top to bottom in the order appearing in "JavaScript and CSS customization" screen.

Steps:
  1. Click the administration menu icon (gear icon) in the header.

  2. Click "System settings".

  3. Select "Application settings" tab.

  4. Click "Messages".

  5. Click "JavaScript and CSS customization".

  6. On the "JavaScript and CSS customization" screen, click "Reorder Customization Groups".

    Image of a reordering action link surrounded by a red frame

  7. On the "Reorder Customization Groups" screen, reorder the customization groups.

    Screen to reorder customization groups

  8. Confirm your settings and click "Save".

  9. On the screen where the customizations are applied, confirm that the design and item functions are fine.

Deleting Customization Groups

Delete customization groups.
If you delete a customization group, its settings are disabled.

Deleting Customization Groups One by One

Delete customization groups one by one.

Steps:
  1. Click the administration menu icon (gear icon) in the header.

  2. Click "System settings".

  3. Select "Application settings" tab.

  4. Click "Messages".

  5. Click "JavaScript and CSS customization".

  6. On the "JavaScript and CSS customization" screen, click the customization group name of the customization group to delete.

  7. On the "Customization group details" screen, click "Delete".

    Image of a delete action link surrounded by a red frame

  8. Click "Yes" on the "Delete customization group" screen.

Deleting Multiple Customization Groups in Bulk

Delete multiple customization groups by selecting them at once.

Steps:
  1. Click the administration menu icon (gear icon) in the header.

  2. Click "System settings".

  3. Select "Application settings" tab.

  4. Click "Messages".

  5. Click "JavaScript and CSS customization".

  6. On the "JavaScript and CSS customization" screen, select the checkbox of the customization group to delete, then click "Delete".

    Image of the ‘Delete’ button which is surrounded by the red rectangle box

  7. Click "Yes" on the "Delete customization groups" screen.