M
M
MangoApps Guides
Search…
Custom
Custom branding (Admin Portal > Branding > Custom) offers full customization options to bring a look and feel into the web portal using CSS and JavaScript. This includes support for setting up different branding for different child companies, business units, departments and many more.

Custom CSS

Network admins can customize the entire MangoApps experience for users with global CSS.
  1. 1.
    Default Branding: This is the default branding that will be used on all pages of the web portal. This branding will also be used on all non-logged pages (such as the login page, reset password page).
  2. 2.
    User-Specific Branding: Allows you to create custom branding for users based on a set of conditions.
  3. 3.
    Add New Branding: Create custom conditional branding.

How to

Setup Branding

Follow the given procedure below to set up the branding:
  1. 1.
    Click Setup Branding. Setup Default Branding window opens.
  2. 2.
    Enter the title for your branding.
  3. 3.
    Turn on the toggle switch to activate your custom CSS.
  4. 4.
    Input your custom CSS.
  5. 5.
    For custom header CSS and HTML, repeat the steps from 1 to 3.
  6. 6.
    Click Preview to view what your custom CSS will look like on the portal.
  7. 7.
    If you do not want to save your work, select Cancel.
  8. 8.
    To save your custom CSS, click on Save.

Add New Branding

With Conditional Custom Branding, users from specified organizations and office locations can get a custom branding experience.
Follow these steps to add new branding:
  1. 1.
    Click Add New Branding to create custom branding to apply to specified users.
  2. 2.
    Enter the title for your branding.
  3. 3.
    Turn on the toggle switch to activate your custom CSS.
  4. 4.
    Input your custom CSS.
  5. 5.
    For custom header CSS and HTML, repeat the steps from 1 to 3.
  6. 6.
    Click Preview to view what your custom CSS will look like on the portal.
  7. 7.
    If you do not want to save your work, select Cancel.
  8. 8.
    To save your custom CSS, click on Save.

Custom JavaScript

Network admins can choose to execute a JavaScript code snippet each time after a page is loaded. Code snippets to track page views or add custom functions that can be added to your domain for extra functionality.
  1. 1.
    Activate JavaScript: Click the toggle bar to execute the specified code snipped each time after a page is loaded.
  2. 2.
    JavaScript: Add the JavaScript code snippets.
  3. 3.
    Save Settings: Click the Save Settings to apply the chosen settings.
Did this article help? Your feedback adds value when we shape up the help articles. Hit the smiley
below to let us know!
Last modified 17d ago