*Page Themes

Video Watch the video

Interface > Page Themes

See also Page Theme Custom Website Menu

This tool helps you design and brand your publicly-viewed pages. From one location, you can create and customize themes for publicly-viewed pages of your registration management system, including event pages, calendars, registration forms, and other pages viewed by registrants. Create themes either for PC/desktop viewing or to automatically fit the size of a person's device (mobile-friendly/responsive recommended).

Under Interface > Page Themes, you'll find a library of mobile-friendly themes or desktop themes you can use immediately. Make copies of them to add your own touch or create your own from scratch.

Make a Responsive (mobile-friendly) theme

First, click "Create New Theme."

You'll choose a logo to work with on the next screen. You're not yet choosing a logo for your theme. As you'll see on the next screen, you're getting a handy shortcut for choosing theme colors to match your graphic.

Click Continue

This is where it starts to get fun. Choose two colors for your theme by putting the cursor over the logo and watching the colors change on the example. When you're happy and have named your new theme, click Save and Continue.

Messages & Labels; Bars, Buttons & Links; Calendar View; Listing View

On the left in each of these sections, select sizes, styles, colors and positioning of elements on various pages and forms. In each case, you'll see how the changes will look as you make them on the right side of the page.

Headers & Footers
By default, if you have added a logo under Application > Account > Defaults (not required) your responsive theme will place your account logo at the top of each page using the [AccountLogoHeader] Tag. A default logo also appears on the page footer. Override either of these by clicking on the Edit Footer/Header Content button.

You'll start with one regular (desktop viewing) header and one footer. You'll also have a mobile header and mobile footer. Headers and footers can be anything, including graphics and text. If you want to have a larger header, for example, when someone views your pages on a PC, you would add it in "Header 1." (You can change the label.) If you want people to see a smaller header when viewing on a mobile device, edit "Mobile Header." The software will automatically re-size for a mobile device. Graphics and files are available from the File Library. 

Attach to Pages Tab

The theme will apply by default to all pages. However, you can point certain headers/footers to individual areas. In fact, each page type could have its own header and footer.

Assignments

After you assign a theme to one or more events, you can view on this screen which events or modules have it. You can also remove or apply the theme to all events.

CSS (Advanced)

If you or someone in your organization has web development expertise, use this tool to further adjust your page styles.  Make sure you review the documentation provided in the system: