> ## Documentation Index
> Fetch the complete documentation index at: https://docs.hotfix.jobs/llms.txt
> Use this file to discover all available pages before exploring further.

> ## Agent Instructions
> Product noun is jobs.
> MCP at https://rest.hotfix.jobs/mcp is the hiring contract for agents. Clients sign in with Hotfix; API keys are for HTTP only.
> Do not invent unpublished REST or hiring stats. Webhooks are set up in the app; there is no REST route or MCP tool to manage them.
> Do not mention Greenhouse, Ashby, Quick Apply, or claim.
> Creating a draft, offer, or booking link does not send email.

# Company page and embed

> Your careers page lives on Hotfix and on your own site: your company page on hotfix.jobs, and the embed you add to your site with one snippet.

Your careers page lives on Hotfix and on your own site.

* **Your company page** is `https://hotfix.jobs/companies/{slug}`. It shows your About, every open job grouped by department and team, then your tech stack and perks. It shows only your jobs. Share the link anywhere.
* **The embed** puts the same jobs on a page of your own site with one snippet. People read a job and apply without leaving your site.

Each job has its own page at `https://hotfix.jobs/jobs/{job_id}` with two tabs: **Overview**, with the job's details and description, and **Apply**, with the apply form at `https://hotfix.jobs/jobs/{job_id}/apply`. Your slug is the last part of your company page URL, shown under **Settings** > **Company** > **Company page URL**.

A job is on your company page and in the embed while it's open. See [Jobs](/jobs).

## Share your company page

Link to your company page from anywhere: your website, a job post, an email. Department buttons above the jobs narrow them to one department, and the choice stays in the page URL as `?department=`.

To see where applicants came from, add `?source=` to the link, like `https://hotfix.jobs/companies/acme?source=linkedin`. See [Where they came from](/applications#where-they-came-from).

## Embed on your site

Add a container where the jobs should appear, and the script after it. You'll find this snippet ready-made under **Settings** > **Embed** > **Embed code**.

```html theme={null}
<div id="careers"></div>
<script
  src="https://hotfix.jobs/embed.js"
  data-company="acme"
  data-target="#careers"
  async
></script>
```

Set `data-company` to your slug. `data-target` is a CSS selector for the container. Without it, the jobs appear right after the script tag.

The embed shows your jobs grouped by department and team, with department buttons to narrow them, and each job's Overview and Apply tabs. It leaves out the Hotfix header and footer, since your page has its own, and its background is transparent so your page shows through. It grows to fit your jobs and never shows a scrollbar of its own.

### Links to a job

When someone opens a job in the embed, your page's URL gets `?hf_job={job_id}`. Share that link and it opens straight to the job. Back returns to the list. A chosen department goes into your page's URL too, as `hf_department`, so a reload or a shared link keeps it.

### Your jobs page

Once the embed is on your site, tell Hotfix where. In the app, go to **Settings** > **Embed** and enter that page's address under **Your jobs page**, like `https://acme.com/careers`.

Links Hotfix makes then open your page instead of your company page on Hotfix:

* The careers page link in emails to candidates (`{{careers_url}}` in templates).
* Job links you copy in the app, including tracking links, and **View listing**. A job opens as `https://acme.com/careers?hf_job={job_id}`.

Search engines still index your company page and job pages on hotfix.jobs. Leave the field empty to link to Hotfix again.

### Embed one job

To put a single job on a page, add `data-job` with the job's id. In the app, open the job and use the code icon (**Copy embed code**) to copy this snippet ready-made. The embed shows that job's Overview and Apply tabs, without the link back to all jobs.

```html theme={null}
<script
  src="https://hotfix.jobs/embed.js"
  data-company="acme"
  data-job="JOB_ID"
  data-target="#careers"
  async
></script>
```

To show only the apply form, add `data-view="apply"` as well, or pick **Apply form only** from the same menu. Use it when your page already describes the job.

When `data-job` is set, your page's URL doesn't get `?hf_job`.

### Where applicants came from

If someone lands on your page with `?source=` or `utm_source` in the URL, the embed passes it along. Their application keeps its `channel` and shows as **Embed** in your inbox and Analytics. See [Where they came from](/applications#where-they-came-from).

### Count applications

When someone applies in the embed, your page gets a `hotfix:applied` event, so you can count it in your analytics. It fires once the application is in: straight away, or after the candidate enters the code we email them, if you ask applicants to confirm. `event.detail` has your slug and the job's id, and nothing about the person.

```js theme={null}
window.addEventListener("hotfix:applied", (event) => {
  const { company, job } = event.detail;
  gtag("event", "job_application", { company, job });
});
```

The embed sets no cookies and runs no analytics of its own. Hotfix counts visits to it for your Analytics without storing anyone's address.

### Sites that can embed

By default, any site can embed your jobs. To allow only yours, go to **Settings** > **Embed** > **Embed options** and list them under **Sites that can embed**, one domain per line, like `acme.com`. Each domain covers its subdomains, so `acme.com` also allows `www.acme.com` and `careers.acme.com`. Add `localhost` to try the embed on your own computer. Browsers then refuse to show the embed on any other site.

## Match your site

Set the embed's look in the app under **Settings** > **Embed** > **Appearance**. It applies to the embed only. Your company page and job pages on hotfix.jobs keep Hotfix's own look.

| Setting | Options |
| - | - |
| Accent | Any hex color. Used for the Apply buttons. |
| Font | Geist (default), Inter, Roboto, Open Sans, Lato, Montserrat, Poppins, Nunito Sans, Work Sans, Manrope, Plus Jakarta Sans, DM Sans, IBM Plex Sans, Source Serif, Merriweather, Lora, Playfair Display, or System |
| Corners | Rounded (default), Square, which removes rounding everywhere, or Pill, which makes buttons and fields fully round |
| Apply label | Auto (default), White, or Black |

The preview shows the Apply button as the embed draws it.

**Website link** shows your website at the top of the offer and interview booking pages you send candidates. It's on by default.

### Override on one site

To use a different look in one embed, add attributes to its script tag. Each one replaces that setting for this embed only. Settings you don't override keep what you saved.

| Attribute | Values |
| - | - |
| `data-font` | `geist`, `inter`, `roboto`, `open-sans`, `lato`, `montserrat`, `poppins`, `nunito-sans`, `work-sans`, `manrope`, `plus-jakarta-sans`, `dm-sans`, `ibm-plex-sans`, `source-serif`, `merriweather`, `lora`, `playfair-display`, `system` |
| `data-radius` | `square`, `rounded`, `pill` |
| `data-accent` | A hex color like `#1F6B4A` |
| `data-accent-text` | `auto`, `white`, or `black` |
| `data-theme` | `light` (default), `dark` for a dark page (light text and dark controls, still transparent), or `auto` to follow the visitor's light or dark setting |

For example:

```html theme={null}
<script
  src="https://hotfix.jobs/embed.js"
  data-company="acme"
  data-target="#careers"
  data-font="inter"
  data-radius="pill"
  data-accent="#E4572E"
  data-accent-text="white"
  async
></script>
```

An unknown value is ignored, and the saved setting is used.

### Readable buttons

With the Apply label on Auto, the label is black or white, whichever is easier to read on your accent. If neither reads well, the button keeps the standard dark style instead of your accent.

Pick White or Black to match the buttons on your own site. Your choice is kept as long as it has at least 3:1 contrast with the accent. Below that, the readable color is used. White on yellow, for example, shows black. The preview in **Settings** > **Embed** says when this happens.

## Your own CSS

To restyle the embed beyond these settings, add up to 3 stylesheets in **Settings** > **Embed** > **Embed options** > **Stylesheets**. Each must be an `https` URL on your own site. Every embed loads them, and they win over Hotfix's styles. Your company page on hotfix.jobs doesn't load them.

Target these attributes rather than class names, which can change at any time:

| Attribute | What it marks |
| - | - |
| `[data-hf="job-list"]` | The job list |
| `[data-hf="job-filters"]` | The search, work type, and location filters |
| `[data-hf="department-filter"]` | The department buttons |
| `[data-hf="group"]` | A department's jobs, like Engineering |
| `[data-hf="group-heading"]` | A department's heading |
| `[data-hf="team-heading"]` | A team's heading inside a large department |
| `[data-hf="job"]` | One job, in the list or on its own page |
| `[data-hf="job-title"]` | The job's title |
| `[data-hf="job-meta"]` | The job's details: pay, place, work type, team |
| `[data-hf="job-summary"]` | The job's short summary in the list |
| `[data-hf="job-apply"]` | The Apply tab on a job page, until it is open |
| `[data-hf="job-header"]` | The top of a job page: title, details, and tabs |
| `[data-hf="job-tabs"]` | The Overview and Apply tabs; each is `job-tab` |
| `[data-hf="job-overview"]` | The Overview tab's description |
| `[data-hf="job-application"]` | The apply form |
| `[data-hf="apply-submit"]` | The form's submit button |

For example:

```css theme={null}
[data-hf="job-title"] {
  letter-spacing: -0.02em;
}
[data-hf="group-heading"] {
  text-transform: uppercase;
}
```

With stylesheets added, images and fonts in the embed load only from Hotfix. That keeps a stylesheet from sending what candidates type in the apply form anywhere else. It also means an image in a job description that's hosted elsewhere won't show in the embed, and neither will a font your CSS loads from another site. Use `data-font` or the **Font** setting instead.

## Opening and closing on every job

To show the same text on every job, go to **Settings** > **Embed** > **Job posts** in the app:

* **Opening** appears above each job's description, like a few lines about working at your company.
* **Closing** appears below it, like an equal opportunity statement.

Both are Markdown, up to 5,000 characters each. They show on each job's page on hotfix.jobs and in the embed, and they're part of each job's Markdown copy and of the description search engines read for Google for Jobs. They don't change the description you wrote for each job.

## Build your own

To design the page yourself, read your jobs from the API and render them however you like. No API key is needed, and you can call it from your site's own JavaScript or from your server.

```js theme={null}
const res = await fetch("https://rest.hotfix.jobs/v1/careers/acme");
const page = await res.json();

for (const job of page.jobs) {
  console.log(job.title, job.department_label, job.team_label, job.url);
}
```

| Route | Returns |
| - | - |
| [`GET /v1/careers/{slug}`](/reference/get-careers-page) | Your company name, headline, embed look, opening and closing, and every open job you have |

Each job has its `department` and `team`, with `department_label` and `team_label` to show, so you can group them the way your company page does. `team` is `null` when none of the department's teams fits. A job leaves the response when you close it. If your plan ends, the route answers `404` until you're on a plan again. `job_opening` and `job_closing` are `null` when unset.

### Applying

Each job has a `url`, its page on `hotfix.jobs`. Link your Apply button to that URL with `/apply` on the end, which opens the job's Apply tab. Applications land in your inbox.

On the apply form, a candidate who attaches a resume gets the fields your form asks for, like name, email, phone, and links, filled in from it. Only empty fields are filled, never over what they typed, and they check before they submit. The resume is read for this and not stored until they apply.

To see where applicants came from, add `?source=` to the link, like `{url}?source=careers-site`. See [Where they came from](/applications#where-they-came-from).

### Freshness

Responses are cached for up to five minutes. When you add, edit, or close a job, or change the embed's look, the cache is cleared and the change shows up within seconds.

### Fair use

Calls are limited per address. A normal careers page never gets near the limit. If you go over it, you get `429` with a `Retry-After` header. To be safe, fetch once per page view, or at build time if your site is static.

## Search engines

Search engines index your company page and your job pages on hotfix.jobs, with Google for Jobs markup on each job. The embed is not indexed, so your jobs don't show up twice. If you build your own page and want Google for Jobs to read it too, add `JobPosting` markup to your job pages yourself.

## Things to know

* The embed loads from `hotfix.jobs`. If your site sets a Content Security Policy, allow `https://hotfix.jobs` in `script-src` and `frame-src`.
* When your plan ends, your jobs pause: your company page and the embed show no open jobs until you reactivate. See [Billing](/help/billing).


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.