Skip to main content
All CollectionsSourceCandidate Experience Portals
Adding Candidate Experience Portals V3 to a Website or WordPress Site
Adding Candidate Experience Portals V3 to a Website or WordPress Site
Updated this week

In this Article:

Candidate Experience Portals V3 provides a new and intuitive way to implement your portal into your own website with a simple script! Here we will discuss how to add a V3 portal to a website and a WordPress site.

Adding BrightMove Portal V3 to a Website

BrightMove Portals have been redesigned to give the customer more control over where and how jobs are displayed and can be embedded into any website with little to no knowledge of web design.

Step 1: Add BrightMove Portal Embed Snippet to the HTML

First, open the HTML page you want to edit and find where you want your portal to display. We've used boilerplate HTML 5 below as an example below.

  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>My Brand Website</title>
  </head>
  <body>
    <main>
        <h1>Welcome to My Website</h1>  
          <article>
          <header>
            <h2>Careers Page</h2>  
            <p>Contact John at <a href="tel:(800) 555-1234">(800) 555-1234</a></p>
            <p>Some additional information here</p>
          </header>
        </article>
    </main>
   <footer>
     © My Brand
   </footer>
  </body>
</html>

Step 2: Copy Embed Script from your Portal List

All Version 3 portals will have the Share & Embed option available in the More dropdown.

Screenshot_2023-02-23_at_2.42.11_PM.png

Currently V3 portals are active beta, so please contact our Support team to upgrade your portal version to V3.

<script id="BMembedId">
 const portal = {
  guid: 'YOUR-PORTAL-GUID',
  portalPath : ''
 };
let bmEmbed = document.createElement("script")
bmEmbed.setAttribute("src", "https://bm-static-content.s3.amazonaws.com/portal/embed/prod/embedv3.js")
document.body.appendChild(bmEmbed)
</script>

You can place embed snippet anywhere inside the <body> tag. In this example it will be above the Contact paragraph.

Step 3: Save and Preview your changes

The final html with the embed script should look something like this:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>My Brand Website</title>
  </head>
  <body>
    <main>
        <h1>Welcome to My Website</h1>  
          <article>
          <header>
            <h2>Careers Page</h2>  

              <script id="BMembedId">
               const portal = {
                guid: 'YOUR-PORTAL-GUID',
                portalPath : ''
               };
              let bmEmbed = document.createElement("script")
              bmEmbed.setAttribute("src", "https://bm-static-content.s3.amazonaws.com/portal/embed/prod/embedv3.js")
              document.body.appendChild(bmEmbed)
              </script>
            <p>Contact John at <a href="tel:(800) 555-1234">(800) 555-1234</a></p>
            <p>Some additional information here</p>
          </header>
        </article>
    </main>
   <footer>
     © My Brand
   </footer>
  </body>
</html>  

Which will render your new V3 Portal within your html page!

Screenshot_2023-02-23_at_2.39.34_PM.png

That’s It!

There is no step four. You have just added the V3 Portal to your website!

Adding BrightMove Portal V3 to a WordPress Site

Embedding V3 Portals into a WordPress site is the same procedure as above, except instead of modifying the website html directly, you will want to create a new Page with a Slug. In this example we have created a new page titled portal at https://turborpo.com/portal/ with the page title Career Portal.

Screenshot_2023-02-23_at_2.48.21_PM.png

Final Installation

You will need new redirect rules for the direct entry into the Careers page from outside of WordPress, think direct link to Jobs. Install the Redirection Plugin here: https://wordpress.org/plugins/redirection/. Follow the basic installation instructions provided by the plugin author, and upload the following json file. Replace {YOUR-CAREERS-SITE} with your careers site, eg. '/careers'

{
"groups": [
{
"id": 3,
"name": "Redirections",
"redirects": 4,
"module_id": 1,
"moduleName": "WordPress",
"enabled": true
}
],
"redirects": [
{
"id": 1,
"url": "{YOUR-CAREERS-SITE}/search/*",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 2,
"url": "{YOUR-CAREERS-SITE}/job/*",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 3,
"url": "{YOUR-CAREERS-SITE}/apply/*",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 3,
"url": "{YOUR-CAREERS-SITE}/apply/*",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 4,
"url": "{YOUR-CAREERS-SITE}/form/complete/*",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 5,
"url": "{YOUR-CAREERS-SITE}/profile*",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 6,
"url": "{YOUR-CAREERS-SITE}/manageProfile*",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 7,
"url": "{YOUR-CAREERS-SITE}/listTimecard",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 8,
"url": "{YOUR-CAREERS-SITE}/viewTimecard/*",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 9,
"url": "{YOUR-CAREERS-SITE}/viewAttachments",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 10,
"url": "{YOUR-CAREERS-SITE}/forms",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 11,
"url": "{YOUR-CAREERS-SITE}/showSubmittals",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
},
{
"id": 12,
"url": "{YOUR-CAREERS-SITE}/logout",
"match_url": "regex",
"match_data": {
"source": {
"flag_query": "exact",
"flag_case": true,
"flag_trailing": true,
"flag_regex": true
}
},
"action_code": 0,
"action_type": "pass",
"action_data": {
"url": "{YOUR-CAREERS-SITE}"
},
"match_type": "url",
"regex": true,
"group_id": 3,
"position": 0,
"enabled": true
}
]
}

Your installation is complete!

Happy Hiring,

The BrightMove Team

Related Articles
Candidate Experience Portal Basics
Candidate Experience Portals - CNAME Configuration (Advanced)
Candidate Experience Portals - Self-Branding (Advanced)
Did this answer your question?