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

# Embed Job Listings

> Learn how to embed your open positions on your own website

# Embedding Job Listings

Displaying your open positions directly on your company website is a great way to maintain brand consistency and keep candidates on your platform. ArmInterview's embed widget is designed to be lightweight, responsive, and easy to integrate.

## Getting the Embed Code

1. Log in to your [ArmInterview Dashboard](https://arminterview.my/dashboard/company).
2. Navigate to the **Company Branding** section.
3. Locate the **Embed Job Listings** section.
4. Copy the provided `<iframe>` code snippet.

## Standard Implementation

The basic embed code provides a seamless experience for most websites:

```html theme={null}
<iframe 
  src="https://arminterview.my/embed/your-company-slug" 
  width="100%" 
  height="600px" 
  style="border:none; border-radius:12px; overflow:hidden;" 
  title="Company Jobs"
></iframe>
```

### Configuration Options

| Attribute   | Description                                                                                 | Default |
| ----------- | ------------------------------------------------------------------------------------------- | ------- |
| `src`       | The unique URL for your company. Ensure `your-company-slug` matches your dashboard setting. | N/A     |
| `width`     | Responsive width. We recommend `100%` to fit any container.                                 | `100%`  |
| `height`    | The height of the widget. Adjust based on the number of active jobs.                        | `600px` |
| `scrolling` | Enable or disable the internal scrollbar. Recommend `no` if height is sufficient.           | `no`    |

## Advanced Customization

### Responsive Wrapper

To ensure the widget maintains a perfect aspect ratio or handles mobile devices more effectively, you can wrap the iframe in a container:

```html theme={null}
<div class="jobs-embed-container" style="position: relative; overflow: hidden; width: 100%; padding-top: 56.25%;">
  <iframe 
    src="https://arminterview.my/embed/your-company-slug" 
    style="position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; border: none;"
    allowfullscreen>
  </iframe>
</div>
```

### Visual Identity

The embedded widget automatically inherits the visual settings defined in your dashboard:

* **Primary Color**: Used for buttons and key interaction elements.
* **Surface Color**: Used for backgrounds (White/Dark mode compatible).
* **Typography**: Inherits our clean, professional font family for readability.

## Frequently Asked Questions

<AccordionGroup>
  <Accordion title="Does the widget support Dark Mode?">
    Yes! The widget automatically detects the user's browser theme preference or inherits the theme settings from your main ArmInterview dashboard configuration.
  </Accordion>

  <Accordion title="Can I filter jobs by department?">
    Currently, the embed shows all active public job listings. We are working on adding query parameters to filter by department or location.
  </Accordion>

  <Accordion title="Will it slow down my website?">
    No. The widget is optimized for performance, using lazy loading for assets to ensure your main page content loads first.
  </Accordion>
</AccordionGroup>

> \[!TIP]
> Always use `https://` in the `src` URL to ensure security and prevent mixed-content warnings on your site.
