This repo contains Equipmentshare's Greenhouse API Level 5 integration. To learn how to contribute, please see the contributing guide.
Links of interest:
This custom Webflow site fetches data from the Greenhouse API and displays career positions on multiple pages. Some pages feature automatic filtering, while others allow the user to filter the results on demand.
The following scripts have been deployed for this project:
| Name | Latest |
|---|---|
| src/careers/openings | https://cdn.jsdelivr.net/npm/@eqsmarketing/frontend-site@2.2.3/dist/careers/openings.js |
| src/careers/department-template | https://cdn.jsdelivr.net/npm/@eqsmarketing/frontend-site@2.2.3/dist/careers/department-template.js |
| src/careers/position | https://cdn.jsdelivr.net/npm/@eqsmarketing/frontend-site@2.2.3/dist/careers/position.js |
| src/careers/custom-position | https://cdn.jsdelivr.net/npm/@eqsmarketing/frontend-site@2.2.3/dist/careers/custom-position.js |
The following section outlines the specific pages and elements where the deployed scripts should be applied for optimal functionality. It's separated by pages and elements where data attributes are required.
The following scripts must be placed in the Custom Code section of the page settings, right in the "Inside <head> tag":
<!-- [Attributes by Finsweet] CMS Filter -->
<script
async
src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmsfilter@1/cmsfilter.js"
></script>
<!-- [Attributes by Finsweet] CMS Load -->
<script async src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmsload@1/cmsload.js"></script>
<!-- Custom Code -->
<script
async
src="https://cdn.jsdelivr.net/npm/@eqsmarketing/frontend-site@2.2.3/dist/careers/position.js"
></script>Inside this page, you should add the following attributes to elements:
| ATTRIBUTE | DESCRIPTION |
|---|---|
data-element = "department" |
Placed to any text element, it will populate it with the job department. |
data-element = "title" |
Placed to any text element, it will populate it with the job title. |
data-element = "location" |
Placed to any text element, it will populate it with the job location. |
data-element = "posted-date" |
Placed to any text element, it will populate it with the job posted date. |
data-element = "contract-type" |
Placed to any text element, it will populate it with the job contract type. |
data-element = "description" |
Placed to a rich text element, it will populate it with the job details (note: all styles are coming from Greenhouse) |
The following scripts must be placed in the Custom Code section of the page settings, right in the "Inside <head> tag":
<!-- [Attributes by Finsweet] CMS Filter -->
<script
async
src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmsfilter@1/cmsfilter.js"
></script>
<!-- [Attributes by Finsweet] CMS Load -->
<script async src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmsload@1/cmsload.js"></script>
<!-- Custom Code -->
<script
async
src="https://cdn.jsdelivr.net/npm/@eqsmarketing/frontend-site@2.2.3/dist/careers/openings.js"
></script>Inside this page, you should add the following attributes to elements:
| ATTRIBUTE | DESCRIPTION |
|---|---|
gh-element = "link" |
Placed to an anchor link, will populate it with the job position URL. |
gh-element = "title" |
Placed to any text element, it will populate it with the job title |
gh-element = "office" |
Placed to any text element, it will populate it with the job location. This element must also have a fs-cmsfilter-field = "office" attribute. |
The following scripts must be placed in the Custom Code section of the page settings, right in the "Inside <head> tag":
<!-- [Attributes by Finsweet] CMS Filter -->
<script
async
src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmsfilter@1/cmsfilter.js"
></script>
<!-- [Attributes by Finsweet] CMS Load -->
<script async src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmsload@1/cmsload.js"></script>
<!-- Custom Code -->
<script
async
src="https://cdn.jsdelivr.net/npm/@eqsmarketing/frontend-site@2.2.3/dist/careers/department-template.js"
></script>An embed block must be placed on the page with the following code:
<!-- [Attributes by Finsweet] CMS Filter -->
<script type="application/json">
{
"department_id": DEPARTMENT_ID,
"metadata": {
"name": "METADATA_NAME",
"value": "METADATA_VALUE"
}
}
</script>Note: DEPARTMENT_ID, METADATA_NAME and METADATA_VALUE are dynamic values that will be populated by the CMS. These are used for filtering, both department_id and metadata could be without the other.
Inside this page, you should add the following attributes to elements:
| ATTRIBUTE | DESCRIPTION |
|---|---|
gh-element = "link" |
Placed to an anchor link, will populate it with the job position URL. |
gh-element = "title" |
Placed to any text element, it will populate it with the job title |
gh-element = "office" |
Placed to any text element, it will populate it with the job location. This element must also have a fs-cmsfilter-field = "office" attribute. |
The following APIs are used in this project:
| Service | Description |
|---|---|
| Greenhouse | Used to fetch career position data |
| Finsweet Attributes | Used for custom filter and sorting |