Branding Settings for All Web Components

These settings will change the branding for all of your web components.

By default, your online Event Registration pages and forms use a standard template for all styles on the page. You can update some of these colors and set up some main navigation options by using a custom "Branding Template" for these pages, and selecting your preferred style elements.

Here's a sample of how a Registration form with NO Branding Settings appears: 

admin1.png

To update this format with custom colors, a logo, and navigation:

  1. Click on the Admin menu and then Global Settings.
  2. Click on the Web Preferences tab and then Branding Settings.

  1. Click on the Website Domain, if you have more than one, and choose the desired domain. This allows you to have different branding settings for each domain.
  2. Click on the Branding Template drop down list and choose Custom.
  3. After making changes to the settings described below, click Save (at the top).

Hide Association Name: This is on the right side and, if enabled, the association name will not appear at the top of the page. If you uploaded a logo that contains your organization name then we recommend hiding the association name.


Favicon URL: This is the small image that appears on the left side of the browser tab when the page is being viewed. Paste or enter the URL of the image. If you need to upload your image first, you can upload it in the Web Content feature of MC Trade.

Logo URL: This is the association logo image that appears in the upper left corner of the page. 

Logo Hyperlink URL: This is the page that should load if someone clicks on the logo image.


Use which user tracking solution: If you want to track the pages that use the branding settings in your Google Analytics account, choose either Google Analytics or Google Tag Manager, and enter the ID number for your account.


Termly Integration Settings for Cookie Consent: This section allows you to fill out your Termly information. To learn more, click here.


Custom Colors: Define any custom colors by clicking Pick a New Color.

  • Color 1 is the color of the header background. The header menu text color will adjust automatically to black or white depending on the background shade. However, if you chose a lighter background and the text is still white, drag the transparency slider all the way to the right to make sure the background color is fully opaque. This should restore the black default text color.
  • Color 2 is the color of the greeting bar which contains the name of the event, form, or login greeting info with the name of the logged in user.
  • Color 3 is the button color which is also used in some sub-navigation items on certain pages.
  • Color 4 is the color of hyperlinks instead of the default/standard blue. The best practice is to choose one of the other colors, like the button color, to indicate a clickable item.

Each of these colors can be selected or entered as a hex code.

When selecting, if you wanted green, for example, you would click here:

Then you would click somewhere in here to choose the degree of green:

The other option is to do a web search for, as an example, "hex code light green" and then copy and paste that here:

Whether you select it or enter the hex code, click outside of the window to close it.


Header Menu: Click Add a Menu Item if you want to add a menu item that, for example, allows visitors to easily navigate back to the main website. We recommend setting up this to match the highest level navigation on your primary website. 

  • Menu item title: Enter the menu item name.
  • Menu item URL: Enter the URL to which the menu item will point.
  • New tab: If enabled, it will open in a new tab.
  • Click the three bars on the left to drag and drop the menu into the order (left to right) that you want it to appear at the top of the page. 

  1. After making changes to these settings, click Save (at the top).

Now refresh your registration/public form page. The default styles have been overridden with your selected font and colors, and your menu items updated at the top of the page.

public_app.png

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request