Moved 2024-08-15

From the Portal Settings you can access the Theming for the portal site and backend. This will set the logo on your internal and external web pages, as well as the colors for the buttons and menus of the customer facing portal site and ticketing admin pages.

Portal Theming

• Main Logo and Site Colors
• Advanced Settings - CSS Overrides
• Public Facing Site Colors

Special considerations for this new release, May 12, 2022:

• If there is no theme or no primary color set, the default color for the ticketing core will remain what it has been. For the backend, this is “Evvnt pink”. For the public-facing portal sites, the button color is orange.
• Once the user selects a primary & secondary color, this will be respected across both core and portal. Users are encouraged to remove CSS overrides for primary/secondary buttons and to set preferred colors in the Theming settings.
• Portal that have a light logo (designed for a dark background) should be encouraged to change it to a logo designed for a light background. Alternatively, the CSS override at the bottom of this article can be applied to keep the dark background in the portal header.

Main Logo and Site Colors

Portal admins can set the the main logo image, the primary and secondary color for the site, and the preferred font from the available options. All of this can be done in the Portal Theme section.

How these colors display in your portal backend will show in the preview. The ticket site will use the primary color for the "Get Tickets" buttons on the customer facing pages.

The main logo will be shown in the backend and on your public-facing pages in the top left side. This one logo will also be shown at the top of most email notifications to organization users and customers.

Before any changes are applied, you will need to select "Save Theme".

Below is how the logo appears on the ticketing site.

Advanced Settings - CSS Overrides

The Advanced Settings can be expanded to show a text entry for any CSS override that you would like to be used for your portal site. Below is an example of a CSS override that will make the header darker:

header .container--header{
background: #263138;
}

Here is a CSS override that will make the logo larger on the homepage:

.container.container--header {
height: 80px !important;
}
.header_img {
height: 60px !important;
}

CSS overrides can be used to customize components, provide unique colors for specific elements, and hide items. Before any changes are applied, you will need to select "Save Theme".

Public Facing Site Colors