Integrating the SonicJobs Easy Apply functionality in a ReactJS websites could be challenging, requiring to handle all the logic, modal view, iframes, etc. The SonicJobs Easy Apply Button handle all this complexity in one single ReactJS component that can replace your standard “Apply“ button when needed.
Add the package in your project with:
npm install @sonicjobs/easy-apply-button
or
yarn add @sonicjobs/easy-apply-button
or
pnpm add @sonicjobs/easy-apply-button
Import the component:
import SonicJobsEasyApplyButton from "@sonicjobs/easy-apply-button"
When needed, replace your existing "Apply" button with this component.
The component comes without styles, so it can be integrated seamlessly in your website.
import SonicJobsEasyApplyButton from "@sonicjobs/easy-apply-button"
[...]
const JobPage = (props) => {
const { jobData } = props
return (
//...
<SonicJobsEasyApplyButton
className="btn-apply" // <-- you can pass a className
style={buttonStyle} // <-- or a style object
jobId={jobData.jobId}
partnerName="partnerName"
country="us">
<span>Apply</span>
</EasyApplyButton>
// ...
)
}
Prop name | Required | Type | Value | |
---|---|---|---|---|
jobId |
yes | string | the jobId coming from our XML feed |
e.g. 65e52d14125c9366eca6dccb
|
partnerName |
yes | string | the unique partner name assigned to you | e.g. yourcompanyname
|
country |
yes | string, one of us , uk
|
the country code | e.g. us
|
candidateEmail |
string | the candidate email, if available | If the candidate is logged-in you can provide the email to shorten the apply flow | |
testUrl |
string | the testing environment URL provided by us | When needed, we can provide a testing environment URL |
other than these it also accepts all the common button
props, except onClick
, so you can use the className
or style
to customize the appearance of the button.
The package comes with Typescript definitions.
Depending on your website configurations, you may need to update your CPS including our host microsite.sonicjobs.com
to frame-src
.