Global Settings Customization Guide

To ensure a cohesive and branded experience across your platform, global settings allow you to customize colours, typography, logos, and more.


Accessing Global Settings

To update the global settings for your theme, page, or widget:

  1. Open Theme/Page/Widget

    • First, select the Theme, Page, or Widget you want to edit.
    • Click on Edit to open the item in edit mode.
  2. Navigate to Global Settings

    • Once in the editing view, go to Global Settings to access the various customization options such as colours, typography, logo, date format, and number format.


Note: The Theme Settings have the highest precedence, meaning they override Page Settings.  Similarly, Page Settings will override Widget Settings. This hierarchy ensures that your overarching design remains consistent.


Customizing the Theme Settings


Updating Colors:

  • Follow the same process to edit color options under Global Settings > Color Settings.
  • The chosen colors will apply globally across your theme, pages, and widgets unless overridden at the page or widget level.
  • You can also choose from the pre-existing palettes.


Updating Typography

  • Adjust typography settings such as font family, size, and style under Global Settings > Typography Settings to control the fonts for the entire platform.
  • You can either choose from the list of fonts available or choose your own fonts.


Updating the Logo

  • Upload a new logo under Global Settings > Logo Settings to set your primary branding across the theme. This can be overwritten at the page level if needed.


Date and Number Format Settings


Date Format

  • Navigate to Global Settings > Date Format to standardize the date across your platform. The default setting can be overridden at the page level for specific needs.


Number Format

  • Configure the Number Format under Global Settings > Number Format for consistent formatting. If you have page-specific requirements, they can be adjusted under individual page settings.


Adding Custom CSS

For further customizations, add CSS under Global Settings > Custom CSS. This ensures your styles apply across all themes, pages, and widgets unless overwritten.

css
Copy code
/* Example: Adjusting button background */ .btn-primary { background-color: #4CAF50; }

Precedence of Settings

To summarize, the precedence works as follows:

  1. Theme Settings have the highest priority and apply first.
  2. Page Settings override Theme Settings where applicable.
  3. Widget Settings will override Page Settings for elements contained within specific widgets.

Conclusion

By following the above steps and understanding the precedence of settings, you can effectively customize and maintain a consistent and branded user interface across your platform.

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article