Skip to main content

Important system message. Read More

View Alert [ close x ]
Content Starts Here
< Back

Article

Branding: Connect Portals

Release: 16.2

View As PDF

Overview

Connect 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 Connect Portal, making it a seamless transition when a candidate navigates from the client's corporate website to the Connect Portal.  The branding wrapper surrounds iCIMS Connect Portal content, which iCIMS staff configures separately to complement the wrapper.

Note: Branding can be copied from a client’s existing iCIMS Recruit Career Portal, if desired. For information on Recruit Career Portal branding, see the Branding: Recruit Career Portals article.
 

How Does Branding Work? What Must a Client Provide?

Beyond simply copying branding a client may have on their iCIMS Recruit Career Portal, 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 Connect 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 Connect Portal, they will be removed. This happens most frequently with client search bars and dropdown menus.)
 
Everything inside of this branding wrapper is iCIMS Connect Portal content, which is configured separately by the Branding team or 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 Connect 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 Connect Portal. However, several changes must be made in order to prepare a client’s HTML code for use on a Connect 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 Connect 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 Connect 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 Branding: Additional Information on Forced SSL & Single Source Code 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 Connect Portal content.
  • Pre-Header and Header – contains HTML that precedes the Connect Portal HTML
  • Footer – contains HTML that follows the Connect Portal HTML
 
The Pre-Header, Header, and Footer elements are outside of the Connect 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 Connect 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 Connect 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 Connect Portal content are described in the General iCIMS Content Display Settings section of this guide. In the following sections, the Connect Portal content 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 Connect Portal. The pre-header, header, and footer brand the Connect Portal, while the Display Settings provide global styling over iCIMS Connect Portal Content. Each individual Connect Portal can have a different branding, but the pages within a single Connect 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 Connect 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 Connect 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 Connect Portal content, configured separately by iCIMS staff using the display settings described in the next section of this guide.
An image that displays the header and footer branding around a client Connect Portal.

General iCIMS Content Display Settings

iCIMS Connect 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:
  • Global Settings
  • Steps Menu
  • Link Settings
  • Page Title
  • Section Title of Fields
  • Primary Buttons
  • Secondary Buttons
  • Social Login Containers
  • Field Message
  • Page Message
 
Please note that these settings represent the choices that a client may request iCIMS staff make for Connect 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.

Steps Menu

The Steps Menu indicates the location (step) of the Connect Portal user, highlighted in the first screenshot below. The second image shows the options available for iCIMS staff to configure.
An image that highlights the Steps Menu in context.
An image that displays options available for iCIMS staff to configure the Steps Menu.

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 displays the Page Title in context.
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.

Primary Buttons

The Primary Buttons settings apply to primary buttons for the entire portal (such as Login, Upload Resume, Save & Continue, 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 the Primary Buttons 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 Finish Later, 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 the Secondary Buttons in Context.
An image that displays options available for iCIMS staff to configure the Secondary Buttons.

Social Login Containers

The Social Login Containers settings apply to Social Login Containers on Welcome Page (such as Facebook, Google+, LinkedIn). The first image below shows the social login container; the second image shows the options available for iCIMS staff to configure.

An image that displays Social Login Containers in context.
An image that displays options available for iCIMS staff to configure the Social Login Containers.

Field Message

The Field Message settings apply to field messages shown to Portal users. 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. 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 Connect 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 Connect 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 options for mobile branding for the Connect Portal.
  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. (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. (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 Connect 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 Connect Portal Display Settings, even with Test Branding access.

Important Test Branding Options

An image that displays important test branding options in context.
  1. Select a Group: Leave on Career Portals if changes should be made globally, or pick an individual Connect Portal to edit.
  2. Desktop View: Opens a new window with the current Connect Portal configurations as they will display on desktop computers. (Note: The Desktop View button will only be available if an individual Connect Portal has been selected from the Select a Group dropdown.)
  3. Mobile View: Opens a new window with the current Connect Portal configurations as they will display on mobile devices. (Note: The Mobile View button will only be available if an individual Connect Portal has been selected from the Select a Group dropdown.)
  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
Branding Standard Pages:
  • Header HTML (textbox): HTML code for the 1st half of the header on every page on the Connect 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 Connect Portal (html from </head> down to where the Connect Portal code is to begin goes in header)
  • Footer HTML (textbox): HTML code for the footer of every page on the Connect Portal (html from where Connect 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 Connect 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 Connect 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.