Vacancy List

The Vacancy List Web Component shows a list of available vacancies.

Usage

<mk-vacancy-list
    customer-id="your-customer-id"
    language="en-US"
></mk-vacancy-list>

HTML Attributes

Basic

Parameters marked with * are required.

Parameter	Default	Description
customer-id*		Your MindKey assigned customer id (GUID).
language*		The language to request.
culture		The culture to use. See Language & Culture for more information
details-href-prefix	''	The prefix added to links for the Vacancy Details page.
form-href-prefix	''	The prefix added to links for the Application Form page.
link-target	null	The target for all links (e.g., "_blank"). If set to null or undefined, no target attribute will be applied.

Display / Order

Default Site Parameters

Some attributes use the Site Parameters (Documentation, MindKey) as their default. The Site Parameters can be set by an HR person and helps them to customize the look of the Vacancy List Web Component without a developer assistance.

You only need to set any attribute with a Site Parameter default if you want to overwrite it. This is most likely for some special recruiting pages that should look different than any other page.

Parameter	Default	Description
show-start-date	By Site Parameters	true shows the vacancy's start date, false hides it.
show-end-date	By Site Parameters	true shows the vacancy's end date, false hides it.
show-long-date	By Site Parameters	If true will show the long date format. If false shows the short date format. Formats are documented here.
show-teaser-text	By Site Parameters	true shows the teaser text, false hides it.
show-locations	By Site Parameters	true shows the locations, false hides them.
show-regions	By Site Parameters	true shows the regions, false hides them.
show-apply-link	true	true shows the apply link, false hides it.
show-filters	By Site Parameters	true shows the filters, false hides them.
show-areas-filter	false	true shows the area filter, false hides it.
show-vacancy-types-filter	true	true shows the vacancy types filter, false hides it.
show-locations-filter	true	true shows the locations filter, false hides it.
show-regions-filter	true	true shows the regions filter, false hides it.
show-fields-of-work-filter	true	true shows the fields of work filter, false hides it.
show-search	false	true shows a input box to let candidates search for a text in the title or teaser text, false hides it.
show-empty-message	true	true shows a message when no result was found at all or after filtering. false hides it.
sort-field	By Site Parameters	Specifies a field for sorting the vacancies. Possible values: description, startDate, endDate, priority.
sort-decending	By Site Parameters	true to sort descending, false to sort ascending.
show-images	false	true to show vacancy list images, false to hide them.
use-banner-image-fallback	false	true to use the banner image if no list image has been set.
show-social-share	false	true to enable the social share feature. Please also set at least one of the following share-* attributes to true to enable sharing to a specific platform.
share-via-email	false	true to enable sharing via email.
share-via-linked-in	false	true to enable sharing via LinkedIn.
share-via-facebook	false	true to enable sharing via Facebook.
share-via-whats-app	false	true to enable sharing via WhatsApp.

Filter

The filters can also be set via a search parameter (e.g. #unsolicited=hide). Setting multiple filters at once will be joined via AND.

Default Site Parameters

Some attributes use the Site Parameters (Documentation, MindKey) as their default. The Site Parameters can be set by an HR person and helps them to customize the look of the Vacancy List Web Component without a developer assistance.

You only need to set any attribute with a Site Parameter default if you want to overwrite it. This is most likely for some special recruiting pages that should look different than any other page.

Parameter	Default	Description
unsolicited	By Site Parameters	Possible values: hide: Dont show unsolicited applications only: Show unsolicited applications only. bottom: Show unsolicited at the end of the list. top: Show unsolicited at the start of the list.
per-date	null	Filter per date. Format yyyy-mm-dd
access	external	Specifies the access type of the vacancies. Possible values: external: Show external vacancies only internal: Show internal vacancies only all: Show internal and external vacancies
vacancy-type-id	null	Only shows vacancies for a specific type id.
region-name	null	Only shows vacancies for a specific region id.
location-id	null	Only shows vacancies for a specific location id.
vacancy-area-name	null	Only shows vacancies for a specific area id.

Configurator

Basic

customer-id* — Your MindKey assigned customer id (GUID).

language* — The language to request.—da-DKde-DEen-USfi-FIhu-HUis-ISkl-GLnb-NOsv-SE

culture — The culture to use.

details-href-prefix — Prefix for Vacancy Details links.

form-href-prefix — Prefix for Application Form links.

link-target — Target for all links (e.g. "_blank").

Display

show-start-date — Show the vacancy start date.show-end-date — Show the vacancy end date.show-long-date — Show the long date format.show-teaser-text — Show the teaser text.show-locations — Show the locations.show-regions — Show the regions.show-apply-link — Show the apply link.show-filters — Show the filters.show-areas-filter — Show the area filter.show-vacancy-types-filter — Show the vacancy types filter.show-locations-filter — Show the locations filter.show-regions-filter — Show the regions filter.show-fields-of-work-filter — Show the fields of work filter.show-search — Show a search input box.show-empty-message — Show a message when no results found.

sort-field — Field for sorting vacancies.—descriptionstartDateendDatepriority

sort-decending — Sort descending.show-images — Show vacancy list images.use-banner-image-fallback — Use banner image if no list image set.

Filter

unsolicited — Unsolicited application display.—hideonlybottomtop

per-date — Filter per date (yyyy-mm-dd).

access — Access type of vacancies.—externalinternalall

vacancy-type-id — Filter by vacancy type id.

region-name — Filter by region name.

location-id — Filter by location id.

vacancy-area-name — Filter by vacancy area name.

Social Sharing

show-social-share — Enable social share feature.share-via-email — Share via email.share-via-linked-in — Share via LinkedIn.share-via-facebook — Share via Facebook.share-via-whats-app — Share via WhatsApp.

Stylesheets

structure.css — Basic structure without colors.vacancy-list.css — List style.vacancy-list-cards.css — Card style.vacancy-list-responsive.css — Cards on mobile, list on desktop.

Preview

Enter a customer-id and select a language to see a live preview.

Code

Component snippet

<mk-vacancy-list></mk-vacancy-list>

Full HTML page

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>MindKey Recruiting</title>
    <script src="https://recruiting.mindkey.com/mk-recruiting-components.js"></script>

</head>
<body>
    <mk-vacancy-list></mk-vacancy-list>
</body>
</html>