Job Post Plugin

Intro

The Job Post Plugin is a Javascript plugin that renders a Job Post on a page and allows candidates to apply to that job post. By default, the 3B delivered Job and Application objects are used, however this guide will detail how to link the plugin to an ATS Job and Application objects. This plugin is available from version 3.4+ of the 3B Onboarding package.

Basic Implementation

The JobPost Visualforce page delivered by 3B Onboarding serves as a template for how to fork a custom Visualforce/Website page. The product delivered Job Post Visualforce page depends on the inclusion of the following imports:

<!-- Utilities -->
<script src="{!URLFOR($Resource.b3o__GeneralUtils, 'index.js')}" defer="true" type="module"></script>
        
<!-- Component -->
<script src="{!URLFOR($Resource.b3o__JobPostResources, 'index.js')}" defer="true" type="module"></script>

After the imports, you would need to create a custom element on the page <job-post>. This is the element that renders the actual job post.

<job-post 
    job-id="{!$CurrentPage.parameters.id}" 
    public-site="{!$Site.baseUrl}"
></job-post>

Place the <job-post> element in the body of the page. Finally, you would need to include an initializer script like so:

<script>
    const globals = {
        sessionId: '{!GETSESSIONID()}',
        siteUrl: '{!$Site.baseUrl}',
        useREST: false,
        router: b3o.GlobalRemotingRouter
    }
</script>

Note that when forking the JobPost page to a custom Visualforce page, you would need to assign a controller to the new Visualforce page controller="b3o.GlobalRemotingRouter"

Advanced Implementation

To import the Job Post component on a Wordpress (or any other hosted site), you would need to change the basic implementation to be compliant with non-salesforce systems. Here's an example of how to initialize the Job Post plugin externally:

<!-- In the header of the page -->
<script src="https://your-domain.my.salesforce-sites.com/onboarding/resource/b3o__GeneralUtils/index.js" defer="true" type="module"></script>
<script src="https://your-domain.my.salesforce-sites.com/onboarding/resource/b3o__JobPostResources/index.js" defer="true" type="module"></script>

<!-- In the body of the page -->
<job-post 
    job-id="..." 
    public-site="https://your-domain.my.salesforce-sites.com/onboarding"
></job-post>

<!-- In the footer of the page -->
<script>
    const globals = {
        siteUrl: 'https://your-domain.my.salesforce-sites.com/onboarding',
        useREST: true,
        router: b3o.GlobalRemotingRouter
    }
</script>

Note that we assume here that the Public Guest Site url is "https://your-domain.my.salesforce-sites.com/onboarding". You would also need to implement a custom mechanism to write to the job-id attribute (for e.g. getting URL params).

Linking to an ATS Object Schema

The component <job-post> is by default linked to the 3B delivered Job and Application objects. Below, you can find a list of default properties set to the <job-post> component:

jobTitlePath = 'b3o__Job_Advert_Title__c';
jobBodyPath = 'b3o__Job_Post_Body__c';
jobFootPath = 'b3o__Job_Post_Footer__c';

siteNamePath = 'b3o__Site__r.b3o__Public_Name__c';
jobTypePath = 'b3o__Job_Type__r.Name';
empTypePath = 'b3o__Employment_Type__c';
payInfoPath = 'b3o__Pay_Information__c';
jobRefPath = 'b3o__Job_ID__c';
jobExpiryPath = 'b3o__Available_Until__c';

jobRegFormPath = 'b3o__Registration_Form__c';
jobAppFormPath = 'b3o__Application_Form__c';
jobQuickAppFormPath = 'b3o__Quick_Apply_Form__c';

jobAppBtnLabelPath = 'b3o__Apply_Button_Text__c'
jobDocPackPath = 'b3o__Document_Pack__c';
jobQuestSetPath = 'b3o__Question_Set__c';

To link to a Salesforce based ATS object schema, you would need to override the default properties to be requested by the server by adding them as attributes to the <job-post> component and converting the camelCaseAttribute to hyphen-case-attribute like so:

<!-- Import Scripts -->
...

<job-post 
    job-id="..." 
    job-board-name="Default"
    places-api-key=""
    job-relationship-field="b3o__External_Job__c"
    candidate-relationship-field="b3o__Contact__c"
    job-object-name = 'b3o__External_Job__c';
    job-app-schema = 'b3o__External_Application__c:b3o__External_Job__c:b3o__Contact__c'
    site-coordinates-path = 'b3o__Site__r.b3o__Coordinates__c'
    job-title-path = 'b3o__Job_Advert_Title__c'
    job-short-path = 'b3o__Job_Post_Short_Description__c'
    job-body-path = 'b3o__Job_Post_Body__c'
    job-foot-path = 'b3o__Job_Post_Footer__c'
    job-featured-path = 'b3o__Featured_Job__c'
    job-posted-path = 'b3o__Date_Posted__c'
    job-board-path = 'b3o__Job_Boards__c'
    site-field-path = 'b3o__Site__c'
    site-name-path = 'b3o__Site__r.b3o__Public_Name__c'
    job-type-path = 'b3o__Job_Type__r.Name'
    job-type-field-path = 'b3o__Job_Type__c'
    emp-type-path = 'b3o__Employment_Type__c'
    pay-info-path = 'b3o__Pay_Information__c'
    job-ref-path = 'b3o__Job_ID__c'
    job-expiry-path = 'b3o__Available_Until__c'
    job-app-form-path = 'b3o__Application_Form__c'
    job-app-btn-label-path = 'b3o__Apply_Button_Text__c'
    job-doc-pack-path = 'b3o__Document_Pack__c'
></job-post>

<!-- Import Initializer -->
...

Replace the 3B fields with their ATS equivelent fields.

Note that the jobAppSchema requires that you specify the Application Object Name:Job Reference Field:Contact Reference Field. These will allow the system to figure out if the logged in user has already applied for the job or not and render the UI accordingly.

Labelization

In addition to the field mapping for Salesforce ATSs, the component is fully labelized to support overriding default text rendering and add the ability to localize the component for different languages.

The following properties are made available for SIs to override:

postNotFound = 'Error 404';
postNotFoundDetails = 'Post not found.';
labelJobLocation = 'Location';
labelJobType = 'Job Type';
labelJobEmpType = 'Employment Type';
labelJobPay = 'Pay';
labelJobRef = 'REF';
labelJobExpiry = 'Expires';
labelAlreadyApplied = 'You already applied for this job.';
labelGoToDocuments = 'Application Documents';

Styling

The provided plugin is delivered with basic styling, however it implements an open architecture that allows implementers to add CSS overrides. Adding CSS overrides is beyond the scope of this article.

Overriding Default Registration Workflow

By default, if a user is not logged in, we will display the 3B Form responsible for registering users through the field path jobRegFormPath. If you wish to override this behaviour and implement a custom registration page, override the alternativeApplicationPage attribute of the component with the URL of the page that will be handing the user registrations.

The custom page that handles user registrations must fire an iFrame event where the event.data.event_id is set to "3bforms" and the path event.data.contactId is set to the newly created/retreived Contact Id, see the example below:

window.parent.postMessage(
    {
        event_id: '3bforms',
        data: {
            contactId: ...
        }
    }, 
    "*" 
);

Note that the plugin will automatically add the following URL parameters to the override page: jobId

Overriding Default Application Workflow

By default, we will display a 3B Form defined in the field path jobAppFormPath. You can override this behaviour by specifying a web page in the alternativeApplicationPage attribute.

Just like overriding the default registration workflow, you need to fire a message event where the event.data.event_id is set to "3bforms" and the path event.data.appId is set to the newly created application record id, see the example below:

window.parent.postMessage(
    {
        event_id: '3bforms',
        data: {
            appId: ...
        }
    }, 
    "*" 
);

Note that the plugin will automatically add the following URL parameters to the override page: jobId, userId and appId (if available)

Permissions

With version 3.3+ of the onboarding package, the user running the plugin will be required to provide ACCESS (Read) permissions on the object and fields that are to be used with the Job Post plugin. This means that by default, the out of the box plugin requires access to the 3B Job and the client facing fields. If the app is embedded on a customer's website, then the access needs to be configured on the Guest User Profile level.