Skip to main content

Important system message. Read More

View Alert [ close x ]
Content Starts Here
< Back

Article

Branding: Recruit Career Portals

Release: 16.4

View As PDF

Overview

Career Portal Branding is a free service provided by iCIMS in which iCIMS Branding Team uses a client's existing HTML structure to create a branding template “wrapper.” This branding wrapper surrounds a client’s Recruit Career Portal, making it a seamless transition when a candidate navigates from the client's corporate website to the Career Portal.  The branding wrapper surrounds iCIMS Career Portal content, which iCIMS staff configures separately to complement the wrapper.
 
Note: This guide concerns Recruit Career Portal branding. For information on Connect Portal branding, see the Branding: Connect Portals article.

This article is composed of the following sections:

How Does Branding Work? What Must a Client Provide?

iCIMS offers two types of branding, Replica and Template Branding. For both types of branding, iCIMS will use a branding template that acts as a wrapper around Career Portal content. This wrapper surrounds Portal pages, and can include the header, the top and side menus, and/or the footer/copyright. (If the functionality in any of these elements of the client’s site disrupts the format and/or functionality of the Career Portal, they will be removed. This happens most frequently with client search bars and dropdown menus.)
 
Everything inside of this branding wrapper is iCIMS Career Portal content, which is configured separately by the Branding team or iCIMS Technical Support to complement the branding template and corresponding client website. (Note: The branding template and content display settings will be used for all pages of a specific Career Portal, and cannot be configured on a per-page basis.)
 
The two types of branding, as well as what clients must provide for each type, are as follows:
  • Replica Branding – iCIMS Branding Team will use the existing code from a client’s corporate website to create a branding template “wrapper.”
    • Client must provide one public URL from their existing corporate website, preferably from client’s secure server (ex: https//:www.mysite.com/careers.html). Generally, this should be an interior page within their site such as a Careers landing page; it cannot be a full flash site. (Please note that iCIMS Branding Team can only use one URL—they cannot mix and match content from multiple pages.)
    • Note: iCIMS Branding Team will copy the code from the client’s website and use it to create the branding template for the Recruit Career Portal. However, several changes must be made in order to prepare a client’s HTML code for use on a Career Portal, such as ensuring that all links, images, style sheets, and scripts link back to the client’s corporate web site. Thus, iCIMS must be given a URL to the client’s existing web site for branding purposes, not simply a .zip file containing the contents of the client’s web site.
  • Template Branding – iCIMS Branding Team will use a client’s logo and color theme to create a branding template “wrapper.”
    • Client must provide a logo or a banner image (optimized for web), either from a public URL or one provided by the client. Client must provide us with a URL of web page that iCIMS can borrow the logo and styles from. 
To summarize, when the Branding Team creates a Replica Branding, all they need is the URL of the client’s website. They will then copy the code from the client’s site and use it to create the branding template “wrapper” for the Recruit Career Portal. If the client wants to do a Template Branding, the only thing the client must provide is a web-optimized logo or banner image. (This can either be provided via a public URL or as an attachment to the branding request.)
 
Note:
  • iCIMS strongly discourages the use of 3rd party iFrames with Career Portals. Portals with 3rd party iFrames frequently do not display correctly on mobile devices and may be blocked by some browsers.
  • The Branding Team is unable to use full flash sites as a basis for the branding template.
  • The client is responsible for providing their content, which includes their images and scripts, over a secure connection.  If a client has a secure site, iCIMS will brand from the secure URL provided by the client.
    • If a client does not have a secure site:
      • iCIMS will use an internal tool to secure the client’s resources. It will dynamically grab the client’s assets and host them on iCIMS secure server. (Note: Not all sites can be secured using this method.  If iCIMS cannot secure the site, iCIMS recommends a Template Branding or client access to Test Branding.)
      • iCIMS can provide a Template Branding that contains your company’s header image and/or logo, which iCIMS will host for you. Though this would not exactly match your website’s current branding, it should prevent pop-up warning messages that candidates may experience on an unsecure site. (See Additional Information on Forced SSL on Career Portals to learn more.)
  • The Branding Team cannot use the following file types: .zip, .pdf, .psd (Adobe Photoshop), .ai (Adobe Illustrator), .doc (Microsoft Word), .xls (Microsoft Excel), .ppt (Microsoft PowerPoint).

About Branding Configuration

Branding consists of the following major components, which make up the branding template “wrapper” that surrounds Career Portal content.
  • Pre-Header and Header – contains HTML that precedes the Career Portal HTML
  • Footer – contains HTML that follows the Career Portal HTML
 
The Pre-Header, Header, and Footer elements are outside of the Career Portal content area; they can include top-level menus, left menus, or right sidebars. These elements are part of the branding template wrapper that surrounds Career Portal content. In the following sections of this guide, the header and footer are represented by the letters A and C, respectively.
 
Once the branding template “wrapper” is created, it will be placed around iCIMS Career Portal content. This content is not affected by the branding template, but is configured separately by iCIMS staff in basic “What You See Is What You Get” (WYSIWYG) editors. The settings available to configure iCIMS Career Portal content are described in the General iCIMS Content Display Settings section of this guide. In the following sections, the Career Portal content are is represented by the letter B.
 
Note:
  • The same Pre-Header, Header, Footer, and Display Settings will exist for all pages within the client’s Recruit Career Portal. The pre-header, header, and footer brand the Career Portal, while the Display Settings provide global styling over iCIMS Career Portal Content. Each individual Career Portal can have a different branding, but the pages within a single Career Portal must share the same branding.
  • Further, iCIMS cannot configure different branding for a candidate’s mobile vs. desktop experience of the site. Clients may provide an optional mobile-only logo and header text to brand their site for mobile access, but all other branding will be stripped away to ensure a smooth mobile browsing experience.

Identifying Headers and Footers

Once the client determines the web page to use as the Career Portal’s branding template, iCIMS will determine which portion(s) of the page are to be used as the branding template header and footer.
 
The screenshot below shows how the Branding Team would assess a client’s existing site. Section A represents the header, and section C is the footer. Section B is page content that will be replaced with iCIMS Career Portal content (which iCIMS staff configures separately).
An image that highlights the header and footer sections of a client careers website.

Using Headers and Footers in Branding

The screenshot below shows how the Portal will look after the Branding Team creates the branding template “wrapper”. Section A represents the header, and section C represents the footer. Section B is Career Portal content, configured separately by iCIMS staff using the display settings described in the next section of this guide.
An image that highlights the header and footer sections of a Career Portal.

General iCIMS Content Display Settings

iCIMS Career Portal content is configured by iCIMS staff using the settings described below. This content is configured separately from the branding template “wrapper.”
 
The settings fall into the following categories:  
Please note that these settings represent the choices that a client may request iCIMS staff make for Career Portal content, and that these settings are entirely separate from the branding template “wrapper.” iCIMS Branding Team may not be able to exactly match the font or styling on a client’s corporate site, because iCIMS maintains a single source code and does not customize Portals for clients. For more information on iCIMS branding ability for all clients, please see the Single Source Code section of the Branding: Additional Information on Forced SSL & Single Source Code article.

Global Settings

The Global Settings apply to the entire Portal.
An image that displays Global Settings with options selected.
Please note that the only font options available for the Font-Family attribute are as follows: Arial, Arial Black, Calibri, Comic Sans MS, Courier, Geneva, Georgia, Helvetica, Impact, Lucida Grande, Lucida Sans Unicode, Sans-serif, Serif, Tahoma, Times New Roman, Trebuchet MS, Verdana, Hei, and STHeiti. (iCIMS cannot use any fonts that are not included in this list.)
 
Note: Any text formatting applied by a client in a job description or other areas of the Portal that are configured using HTML editors will override the settings above. It strongly recommended that clients do not change the font attributes/properties (i.e., font-size, font-color, font-family) for these fields, so that the global settings are not overridden and consistency is maintained throughout all Portal pages.

Link Settings

The Link Settings apply to links throughout the entire Portal.
An image that displays Link Settings.

Page Title

The Page Title attributes affect the main titles of Portal pages, highlighted in the first screenshot below. The second image shows the options available for iCIMS staff to configure.
An image that highlights the Page Title on a page.
An image that highlights available options for iCIMS staff to configure the Page Title.

Section Title

The Section Title attributes affect the section titles of Portal pages, highlighted in the first screenshot below. The second image shows the options available for iCIMS staff to configure.
An image that displays the Section title in context.
An image that displays options available for iCIMS staff to configure the Section Title.

Jobs Table Header

The Jobs Table Header attributes affect the list of jobs on the Portal, shown in the first screenshot below. The second image shows the options available for iCIMS staff to configure.
An image that shows the Job Table Header in context.
An image that displays options available for iCIMS staff to configure the Job Table Header.

Action Buttons

The Action Buttons settings affect the action buttons for the entire Portal. Action buttons are shown in the first screenshot below; the second image shows the options available for iCIMS staff to configure.
An image that displays Action Buttons in context.
An image that displays options available for iCIMS staff to configure the Action Buttons.

Primary Buttons

The Primary Buttons settings apply to primary buttons for the entire portal (such as Submit, Search, login, etc.). A primary button is shown in the first screenshot below; the second image shows the options available for iCIMS staff to configure.
An image that displays a Primary Button in context.
An image that displays options available for iCIMS staff to configure the Primary Buttons.

Secondary Buttons

The Secondary Buttons settings apply to secondary buttons for the entire portal (such as Add More, Delete, etc.) The first image below shows an example of a secondary button; the second image shows the options available for iCIMS staff to configure.
An image that displays a Secondary Button in context.
An image that displays options available for iCIMS staff to configure the Secondary Buttons.

Application Step Status Bar

The Application Step Status Bar settings apply to the status bar candidates view as they complete an application on the Portal. The first image below shows an example of the application step status bar; the second image shows the options available for iCIMS staff to configure.

An image that includes the Application Step Status Bar on the Portal.
An image that includes the Application Step Status Bar options available for iCIMS to configure.

Field Message

The Field Message settings apply to field messages shown to Portal users throughout the Portal. The first image shows an example of a field message in red; the second image shows the options available for iCIMS staff to configure.
An image that displays a field message in context.
An image that displays options available for iCIMS staff to configure the Field Message.

Page Message

The Page Message settings apply to page messages shown to Portal users throughout the Portal. The first image shows an example of an error page message; the second image shows the options available for iCIMS staff to configure.
 
An image that displays a Page Message in context.
An image that displays options available for iCIMS staff to configure the Page Message.

Additional Options for Mobile Responsive Branding

All Career Portals use a responsive design to automatically accommodate the viewing experience for candidates, whether they are on a desktop/tablet or a smartphone. In order to ensure an optimal experience for candidates accessing Career Portals on smartphones, branding will be simplified for these users and all header/footer elements (the branding template “wrapper”) will be stripped away.
 
By default, the mobile view will pull the client’s Platform logo from the system. If the client would like a different logo for the mobile view, they may provide a mobile-specific logo and heading to use when a mobile device is detected.
An image that displays mobile header logo and mobile header text in context.
  1. Mobile Header Logo: Clients may provide the URL for a logo to use when their responsive Portal detects a mobile device. (Note: The image cannot be a .GIF file.) This image will be dynamically resized based on a candidate’s screen size when they access the Portal. (Note: If a client does not have a Platform logo and no mobile header logo is specified, there will be no logo on the Portal.)
  2. Mobile Header Text: Clients may provide header text to use when their responsive Portal detects a mobile device. (Note: By default, the Portal will display the company name. If no company name is provided, no header text will display.)
In addition to the mobile logo and header text, iCIMS can also configure the labels for the “Read more” and “Read less” links for clients.


Test Branding Access Overview

Clients may request Test Branding access to grant a member of their company or an affiliated third-party web designer access to their iCIMS system for the purpose of completing the branding design themselves, or if they plan to consistently make alterations to their Career Portals which would be easier with access to make the modifications themselves on a regular basis.
 
Once the client is satisfied with the test branding and has a final version ready for production, the client can request that iCIMS go live with the branding. (Note: Once the site is pushed live, iCIMS will be able to update the Portal colors/fonts to complement the new design. Currently, however, iCIMS is not able to update the test site without also affecting the live site.)
 
Note: Test Branding access will allow a client to work only with their branding template “wrapper.” Clients cannot configure the Career Portal Display Settings, even with Test Branding access.

Important Test Branding Options

An image that displays the options listed below in context.
  1. Select a Group: Leave on Career Portals if changes should be made globally, or pick an individual Career Portal to edit. (Note: The Desktop and Mobile View buttons will only be available if an individual Career Portal has been selected from this dropdown.)
  2. Desktop View: Opens a new window with the current Career Portal configurations as they will display on desktop computers.
  3. Mobile View: Opens a new window with the current Career Portal configurations as they will display on mobile devices.
  4. Help: Opens a new window with more information about fields and options on the Test Branding page.

Other Test Branding Settings

Warning: The following field has been retired and, if edited, will have no impact on how the Portal displays:
  • The Custom CSS field, visible in the Branding: Standard Pages section
Icon and Icon Colors:
  • Portal Icon Theme (dropdown): Set the Portal Icon theme by selecting one of the available options in the dropdown
  • Background Color (textfield): Specifies the background color of an icon (should usually match the page's background)
  • Border Highlight Color (textfield): Highlight the icon's main image border
  • Border Color (textfield): Border of the icon's main image
  • Oval Highlight color (textfield): Highlight around the image enclosing the “main” image
  • Oval color (textfield): Image that encloses the “main” image
  • Symbol Highlight color (textfield): Highlight around the “main” image
  • Symbol color (textfield): The color of the arrow, notepad, or logout portion of the icon.
  • ‘iCIMS’ color (textfield): Controls the text color of the “Powered by the iCIMS Talent Platform” logo
Branding Standard Pages:
  • Header HTML (textbox): HTML code for the 1st half of the header on every page on the Career Portal (html code up to, but not including </head>)
  • Header HTML after CSS declarations (textbox): HTML code for the 2nd half of the header on every page on the Career Portal (html from </head> down to where the Career Portal code is to begin goes in header)
  • Footer HTML (textbox): HTML code for the footer of every page on the career Portal (html from where Career Portal code ends to end </html>)

Tips for Working on the Test Branding Page

  • In order to save your changes, click outside of the field in which you made the changes.
  • When Career Portals is selected from the Select a Group dropdown, any changes will be made globally, to all Recruit Career Portals.
  • When Career Portals is selected from the Select a Group dropdown on the Test Branding page, any field that is gray matches the corresponding setting on the Live Branding page for Career Portals. Any field that is white has been modified and no longer matches the Live Branding page.
  • To return to the default setting for a given field, click the Reset to Default icon. (Note that you cannot undo this change. Use caution when resetting a field to its default.)
Note: Due to the way most browsers cache data, toggling between Test and Live views of a given portal may be difficult. You may need to clear your cache to successfully view the Live site after viewing your Test branding.


For additional information regarding Forced SSL and Single Source Code in the context of Portal Branding, please refer to the Branding: Additional Information on Forced SSL & Single Source Code article.