The Banner Image section of the Web Campaign Builder allows you to upload a banner image that will be visible at the top of every PURL page across all student accounts. This banner will serve as a visible representation of your school brand, and should be designed using your branded fonts, hexadecimal color values and general visual personality.

The recommended size for a banner image is 1240px by 158px. When created at these dimensions, the banner will span the active portion of a PURL page, and can actively collapse in different viewing environments.

To upload a banner image, click the ‘Choose File’ button in the Banner Image builder area. This will open an upload dialog. Select the banner image file you would like to upload and, once selected, click ‘open’ to complete the upload. We suggest the following graphics formats for this image: .jpg, .gif, .png.

Banners can either be static or dynamic. If you upload only a single banner, it will be static—meaning that the same banner will show for every PURL page, regardless of pertinent information in a student’s record. If you would like a different banner to display for a certain sub-population of your student records (e.g., different banners for students going to different campuses or different banners for different majors), you can utilize dynamic banners.

The dynamic nature of a banner is controlled by a student’s asset selection. For instance, you can choose to have your banners change based on the Majors asset using the dropdown menu under the Banner Image Upload field and, using the Majors Asset Type Builder, upload unique banners for every major asset. The banners visible on student PURL pages will then reflect their own major selection directly.

It should be noted that if you elect to build dynamic banners, any assets within that selected control asset (Major, in the example above) that lack a banner, either by choice or by accident, will display the general banner image uploaded in the Banner Image section of the Web Campaign Builder. This image should be broad enough to represent information pertinent to all records.

The Other Images portion of the Web Campaign Settings Builder allows you to customize secondary images related to the PURL Banner and the browser window.

A Favicon is a small image that appears in the tab of a browser. It adds visual navigability to your PURL page when opened among multiple tabs.

Favicons must be cut to 16px x 16px and saved in the .ico format to display correctly. To upload a custom favicon, simply click “Choose File” in the Favicon area of the Other Images section and select the appropriate .ico file. This image is static for all PURLS.

The Banner Image that you created in the Banner Image section spans the width of the active area of any PURL page, but additional graphic information is required to continue the designed look of the banner when the browser page is open wider than the banner’s width. To continue this graphic information, you have the option to either program a single color, or, if your banner incorporates a continuing pattern, you can upload a background image slice.

This image slice will be repeated along the top of the page, in line with the banner image, and will overwrite the Header color if uploaded. Using a header background is an ideal way to continue simple graphic patterns, like a horizontal line or a repeating texture, across the length of a browser window.

The Footer Background follows the same concept as the Header Background previously described. It will overwrite the Footer Color if uploaded.

To use a single, flat color to extend your banner, rather than a repeating image, you can use the Header and Footer Color settings. These setting will produce a single color bar extending across the header area past the boundaries of the banner and along the footer area.

To set a Header Background color, either pick a color from the color selector by clicking on the color block to the right of the text field and targeting your desired hue, or directly insert a hexadecimal value. We suggest that you utilize the hexadecimal value matching the edges of your Banner Image for a seamless transition from the Banner Image to the Header Background Color.

The Footer area of a PURL page is a single color block of the same dimensions as the header, and contains contact information about your school. You can select a background color for this block in the same way as described in the Header Background section. We recommend that this color should be complementary to the footer text color for enhanced legibility.

This field allows you to set the color for the text in the footer area that lists the contact information for your school. Choose this color to compliment the Footer Background color for legibility.

The Text Colors portion of the Web Campaign Settings Builder allows you to set up a consistent color styling palette for text elements across PURL pages. While most text appearing on a PURL page can be custom-styled for size, font and color, the Text Colors are of the Web Campaign Settings Builder provides a base set of options that are linked to the HTML coding of that text. So, for example, you can edit the color of a portion of text by hand using the text editing features in any text window, or you can utilize HTML attribute tags to reference the colors outlined in the Text Colors area. These attributes are as follows:

Large text typically used as the ‘title’ for a page. References the <h1> tag.

Slightly smaller than Header Text, Sub-Header Text is used to partition different sections of text within a single page. Reference the <h2> tag.

The majority of the displayed text will be this color. References untagged copy within <p> elements.

Copy that links to another HTML page, called a link, will display in this color. The link color applies to the following states: default, rollover, active and visited. References the <a href> tag.

Events on the EMP Calendar will display in a scrolling Event Banner on the homepage of every PURL. You can adjust the color of that banner, as well as the header text and body text in this section. We recommend setting these options to compliment the colors found elsewhere in the Web Campaign Settings Builder.

This flat color will serve as the background for the scrolling Event Banner and will need to be complimentary to the text featured in the banner for legibility. The default value, #EEEEEE, is a neutral grey.

The color of the event name.

This smaller text, under the Header, details the next available event date.