Implementing front-end pages for Jobs Plugin

The plugin provides 3 components for building the jobs vacancies list page & category page, job vacancy details page and category list for the sidebar.

Jobs vacancies list page

Vacancy list

Use the Vacany List component to display a list of job vacancies on a page. The component has the following properties:

• Page number - determine what page the user is on. it is used as a routing parameter. The default value is {{ :page }} to obtain the value from the route parameter :page.
• Category filter - a category slug to filter the job vacancies by. If left blank, all are displayed.
• vacancies per page - how many job vacancies are displayed on a single page. The default value is 10.
• No vacancies message - message to display in the empty job vacancies list.
• vacancy order - the column name and direction used for the sort order. The default value is published_at desc.
• Category page - path to the category page.
• vacancy page - path to the job vacancy details page.

Category list

use the Categories List component to display a list of categories with links. The component has the following properties:

• Category slug - the value used for looking up the current category by its slug. The default value is {{ :slug }} to obtain the value from the route parameter :slug.
• display empty categories - determines if empty categories should be displayed. The default value is false.
• categoryPage - path to the category page.

List page (jobs.htm) example

title = "Jobs"
url = "/jobs/:slug?/:page?"

[jobVacancies]
pageNumber = "{{ :page }}"
categoryFilter = "{{ :slug }}"
vacanciesPerPage = 10
noVacanciesMessage = "No vacancies found"
sortOrder = "published_at asc"
categoryPage = "jobs"
vacancyPage = "job"

[jobCategories]
slug = "{{ :slug }}"
displayEmpty = 0
categoryPage = "jobs"
==

<div class="sidebar">
    <h2>Categories</h2>
    {% component 'jobCategories' %}
</div>

<div class="content">
    <h2>Jobs</h2>
    {% component 'jobVacancies' %}
</div>

Job vacancy detail page (including vacancy contact form)

Vacancy details

Use the vacancy component to display a Job Vacancy on a page. The component has the following properties:

• vacancy slug - the value used for looking up the job vacancy by its slug. The default value is {{ :slug }} to obtain the value from the route parameter :slug.
• category page - path to the category page.

Vacancy contact

Use the vacancy contact component to display a contact form for current vacancy, so you can get applications via email (inluding vacany-id and vacancy-title).

Details page (job.htm) example

title = "Job"
url = "/job/:slug"

[jobVacancy]
slug = "{{ :slug }}"
categoryPage = "jobs"

[jobContact]
==

<div id="content">

    {% component 'jobVacancy' %}

    {% component 'jobContact' %}

</div>