Skip to content
Careers embed

Your open roles on your own site. One script tag.

The embed shows your open roles with an Apply link each, or one role's apply form inside your page. Consent is captured by SeekIQ, so the record is the same as on your careers page.

The snippet

Settings > Careers site > Embed builds this snippet for you with a live preview, and can check a page of your site for it. Replace the company slug with your workspace's.

HTML
<div id="seekiq-jobs"></div>
<script
  src="https://app.seekiq.io/embed.js"
  data-company="your-company"
  data-target="#seekiq-jobs"
  data-lang="auto"
  data-accent="#0e3b2e"
  data-radius="8"
  data-font="inherit"
  async
></script>

Preview

The list below is drawn by the same code as embed.js, with seven sample roles instead of live data. Search and filter it as a visitor would.

Sample roles. On your site the embed loads your open roles from SeekIQ.

Options

AttributeWhat it does
data-companyYour workspace slug. Required.
data-targetA CSS selector for the element to fill. Without it the embed appears right after the script tag.
data-langen, bn, hi, ur, ar, tl, es, id, ms or auto (the visitor's browser language). Arabic and Urdu read right to left. Default auto.
data-accentButton colour as a hex value. In the apply form a colour under 4.5:1 contrast falls back to the brand colour.
data-radiusCorner radius from 0 to 24. Default 8.
data-fontinherit uses your page's font, or name a font your page already loads.
data-departmentShow only one department.
data-locationShow only one location.
data-filtersauto offers search and every filter and off turns them off. To offer only some, list them separated by commas: search, department, location, mode, type. Default auto.
data-filters-minHow many open roles the list needs before the filters show, from 0 to 100. Default 6.
data-sync-urlPuts the visitor's filters in your page address (#seekiq=...) so a filtered list can be shared. Off unless set.
data-jobOne role's slug: show only that role.
data-viewapply with data-job opens that role's apply form inside your page.

Values that do not validate are ignored. The embed is light only and draws inside a Shadow DOM, so your page's CSS does not leak in and its CSS does not leak out.

Visitor filters

From six open roles the list gets a search box (role title and team) and filters for team, place (city or country, plus Remote), work style and job type. Each filter offers only the values your roles have, with a count beside each. A filter hides itself when every role shares one value.

data-department and data-location still apply first and hide their own filter, so a visitor cannot widen a list you narrowed.

When the embed is narrower than 480 pixels (its own width, not the screen's) the filters fold behind a Filter button and controls grow to 44 pixels. Screen readers hear the role count as it changes, and Clear filters brings every role back.

With data-sync-url the choices go into your page address as #seekiq=dept:sales;loc:dhaka, so a filtered list can be shared and opens filtered. Without it the embed never touches your address. It updates the address without a reload, a scroll or a hashchange event, and leaves a hash your page already uses alone until the visitor picks a filter.

HTML
<script
  src="https://app.seekiq.io/embed.js"
  data-company="your-company"
  data-target="#seekiq-jobs"
  data-filters="search,department,location"
  data-filters-min="4"
  data-sync-url
  async
></script>

The iframe list offers the same filters through ?filters= and ?filters_min=. It cannot change your page address.

List, one role or apply form

  • The jobs list: your open roles, each with an Apply link that opens the hosted job page and apply form.
  • One role: data-job shows only that role; a closed role shows a short line saying it is no longer open.
  • The apply form inside your site: data-job with data-view="apply" opens the form in a frame that sizes itself to its content. After applying, the status page opens in the same frame. Plans without this view show the role with its Apply link instead.
HTML
<div id="seekiq-apply"></div>
<script
  src="https://app.seekiq.io/embed.js"
  data-company="your-company"
  data-job="customer-support-lead"
  data-view="apply"
  data-target="#seekiq-apply"
  async
></script>

Without scripts

Some site builders strip script tags. Use an iframe instead and set a height, or add embed.js to the page as well and the frame sizes itself.

HTML
<!-- The jobs list -->
<iframe
  src="https://app.seekiq.io/embed/your-company?lang=en"
  title="Jobs at Your Company"
  style="width:100%;height:480px;border:0"
  loading="lazy"
></iframe>

<!-- One role's apply form -->
<iframe
  src="https://app.seekiq.io/embed/your-company/customer-support-lead/apply"
  title="Apply"
  style="width:100%;height:720px;border:0"
  loading="lazy"
></iframe>

Events

The embed's frames post one message to the page that holds them: their height, whenever it changes. embed.js listens for it and sizes the frame; you only need to handle it yourself when you use an iframe without embed.js.

JavaScript
// Only needed for an iframe without embed.js on the page.
// Act only on messages from a SeekIQ frame on this page.
window.addEventListener('message', (event) => {
  const msg = event.data;
  if (!msg || msg.type !== 'seekiq:embed-height' || typeof msg.height !== 'number') return;
  for (const frame of document.querySelectorAll('iframe')) {
    const fromSeekIQ = frame.src.startsWith('https://app.seekiq.io/embed/');
    if (fromSeekIQ && frame.contentWindow === event.source) frame.style.height = `${Math.ceil(msg.height)}px`;
  }
});

Check that the message comes from the SeekIQ frame before you act on it.

Applications themselves are not posted to your page. To react to a new application, use the application.created webhook: applications from the embed arrive with source embed and your site's origin.

Allowed sites

Settings > Careers site > Embed can list the sites allowed to show the embed: https origins such as https://acme.com, or https://*.acme.com for every subdomain, up to 20. An empty list allows any site. With a list, the embed pages tell browsers to refuse framing anywhere else and the jobs feed answers cross-origin requests only for those sites. Changes apply within a minute.

Own careers domain

On Growth and Enterprise, Settings > Careers site > Own domain puts the careers pages on a subdomain you own, such as careers.acme.com: add it and create the CNAME record shown. It goes live once the record is found. Job links in the embed and in candidate emails then use your domain. embed.js itself still loads from app.seekiq.io.

Content Security Policy

If your site sends a Content Security Policy, allow SeekIQ's app host in these directives. CV uploads happen inside SeekIQ's frame or page, so nothing else is needed, and neither unsafe-inline nor unsafe-eval is required.

HTTP
Content-Security-Policy:
  script-src 'self' https://app.seekiq.io;
  connect-src 'self' https://app.seekiq.io;
  frame-src https://app.seekiq.io

The AI screening notice, the consent checkbox, the privacy notice link and the time of consent are shown and recorded by SeekIQ inside its own page or frame. The host page cannot tick or hide them.

Applications that come through the embed are marked with source embed and the host site's origin, so you can tell them apart in reports and in the application.created webhook.