OverviewCareer 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?
- About Branding Configuration
- Identifying Headers and Footers
- Using Headers and Footers in Branding
- General iCIMS Content Display Settings
- Additional Options for Mobile Responsive Branding
- Test Branding Access Overview
- Important Test Branding Options
- Other Test Branding Settings
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.
- 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.)
- If a client does not have a secure site:
- 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).
- 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.
- 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.
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).
The settings fall into the following categories:
- Global Settings
- Link Settings
- Page Title
- Section Title
- Jobs Table Header
- Action Buttons
- Primary Buttons
- Secondary Buttons
- Application Step Status Bar
- Field Message
- Page Message
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.
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.
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.
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.
- 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.)
- 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.)
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.
- 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.)
- Desktop View: Opens a new window with the current Career Portal configurations as they will display on desktop computers.
- Mobile View: Opens a new window with the current Career Portal configurations as they will display on mobile devices.
- Help: Opens a new window with more information about fields and options on the Test Branding page.
- The Custom CSS field, visible in the Branding: Standard Pages section
- 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
- 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.)
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.