Job Board

Table of Contents

• How to use
• General
• Search Bar
• Favorites Toggle
• Items > General
• Items > Icons
• Items > Apply Button
• Job Entry Stack

---

---

Introduction

Here you can learn how to use the Job Board stack from Weavium. Of course, if you have any questions along the way, you are always welcome to visit the support page and leave us a message. ^_-

---

How to Use

Job Board is extremely easy to set up! In fact, all you have to do is drag the stack onto the page, add Job Entrys using the ( + ) button, and then input your information!

There are tons of color customization options as well!

---

General

Here you will find a couple of general properties that pertain to the entire stack such as the Font, and the Maximum Width

Max Width

The max width simply determines the maximum width that the stack can stretch. It will automatically respond to fit mobile devices.

Font

With this select dropdown, you can choose from a list of hand-picked web fonts, all of which work great with Job Board.

---

Text Content

Job Board allows you to customize all of the text that is used throughout the stack. This is great if your website uses a different language, or if you prefer different terminology!

You can edit the text for:

• Favorites Section
• Apply Button
• Days Remaining
• Contracts
  • Full-Time
  • Part-Time
  • Internship
  • Temporary
• Wage Types
  • Annually
  • Monthly
  • Daily
  • Hourly
  • Project

---

Search Bar

This is where you can edit the search bar, most of the configuration options are colors, but there are a few others as well.

Size

The height of the Search Bar

Font Size

The size of the text when typing into the search bar

Radius

The corner roundness of the search bar (also applies automatically to favorites toggle)

Colors

The editable colors for the Search Bar include:

• Background
• Text
• Icon (Search Icon)
• Highlight Background
• Highlight Text

---

Favorites Toggle

The favorites toggle refers the entire Favorites bar which can be found directly below the search bar. This bar acts as a button that will toggle all of the users favorited job entries.

Max-Width

This can be used to make the Favorites toggle wider or smaller, depending on your preference.

Alignment

When the toggle is not spanning the full-width, you can set its alignment to:

• left
• center
• right

Colors

The editable colors for the favorites toggle include:

• Bar Background (Initial, and Selected states)

• Bar Text (Initial, and Selected states)

• Count Background (Initial, and Selected states)

• Count Text (Initial, and Selected states)

• Toggle Background (Initial, and Selected states)

• Toggle Circle (Initial, and Selected states)

• Favorited Heart (Background, and Text)

---

Items > General

Here you will find a few basic options that pertain to all items, as well as some of the major item colors

Spacing

The vertical spacing between each entry

Radius

The corner roundness of each entry

Colors

The editable colors for the general items section include:

• Background

• Text

• Location

• Time Remaining

• Tags (Background & Text)

• Button Background (Initial & Hover States)

• Button Text (Initial & Hover States)

NOTE: The Buttons refer to the favorite button, and the view more dropdown arrow on the right hand side of each job entry

---

Items > Icons

Here you can edit the icons on the left side of each job entry

Icon Sizes (Circle & Icon)

The circle controls the size of the outer part of the icon, while the icon controls the actual icon inside of the circle

Icon Radius

This determines the roundness of the icon circle

Colors

The editable colors for the entry icons include:

• Background (circle color)
• Icon (icon color)

---

Items > Apply Button

Here you can configure the styles for the apply button, as well as set up the action for when the button is clicked.

Padding (Vertical & Horizontal)

Controls the padding around the edges of the button

Font Size (Vertical & Horizontal)

Controls the size of the text inside of the button

Colors

The editable colors for the apply button include:

• Background (Initial & Hover States)
• Text (Initial & Hover States)

Apply Button Action (Select Dropdown)

There are two options for apply button action:

• 1. Open an email dialogue for the user to send a message
• 2. Direct the user to a contact page where they can reach you

If you select one of these options, you will then see inputs for including email information, or the url to your contact page.

---

Job Entry Stack

The Job Entry Stack refers to each individual item/entry added to the list. If you click on a job entry in the editor, you will see all of the options for customizing the information in the inspector panel.

The options include:

Title

The title of the position

Location

The location where the position will be carried out

Close Date

The date that the job opening will end

Short Description

A short description for the user to get a basic idea of the job.

NOTE: There is a special area for including more detailed information, therefore this description should be kept short~

Contract Type (Dropdown)

There are 4 contract types to choose from (more coming very soon)

• Full-Time
• Part-Time
• Internship
• Temporary

Wage Type (Dropdown)

There are 5 wage types to choose from (more coming very soon)

• Yearly
• Monthly
• Daily
• Hourly
• Project

Wage

Here you can input the actual payment for the job. Note, you should include your own currency symbol here.

Icons

Lastly, you can set the icon for each job entry here as well!