fbpx

Need Help?

Here are some good places you cant start.

Whats New?

Get updated about all the good stuff!

Layers Widget
Blog Template
January Updates

Job Listing

The Job Listing Widget allows user to effortlessly create detailed job listings that will attract top talent to your organization. Whether you’re hiring for a small startup or a large corporation, our widget makes it easy to showcase your job openings in a visually appealing and informative way.

With customizable fields and easy-to-use design options, you can tailor each job listing to highlight the unique requirements and benefits of the position. From job title and location to responsibilities and qualifications, you have full control over the content displayed.

 

Let’s look at each of the options in the “Job Listing Widget” below.

Install Job Listing Widget for Elementor

This widget requires Unlimited Elements PRO version installed and activated on your WordPress website.

  1. Go to Unlimited Elements Widget Library
  2. Search in the search bar for “Job Listing”
  3. Hover over the widget in the search results and click install
  4. Add your “Job Listing” widget to any Elementor Page 

General Settings

1

Items Source

Choose an item source to populate item.

  • Items
  • Posts
  • WooCommerce Products
  • Meta Field
  • JSON or CSV
  • Gallery
  • Terms
  • Users
  • Menu
  • Instagram
  • API Integrations
2

Transition Duration

Set the transition duration in milliseconds.

3

Item Image Size

Set the image size of items.

  • Medium Large
  • Large
  • Medium
  • Thumbnail
  • Full Size
  • 1536*1536
  • 2048*2048
  • WooCommerce Thumbnail
  • WooCommerce Single
  • WooCommerce Gallery Thumbnail
4

Show Empty Message

It will show empty message, when no items in listing.

5

Empty Message

Type text to show as empty message.

6

RTL

It will convert listing from right to left.

Layout Settings

1

Layout Settings

Set number of columns to show.

2

Show Graphic Element

Choose the graphic element to show.

  • Image
  • Icon
  • Text
3

Title HTML Tag

Choose html tag for title.

  • div
  • H1
  • H2
  • H3
  • H4
  • H5
  • H6
  • span
  • p
4

Show Job Info

Show/Hide the job info.

5

Show Salary/Pay Scale

Show salary/pay scale.

6

Show Description

Show/Hide the description.

7

Description Length

Set the description length.

8

Show Skills

Show/Hide the skills element.

9

Link on Image

Set the link on image.

Salary/Pay Scale Settings

1

Salary Position

Set the positioning of title.

  • With title
  • With info
2

Show Salary Prefix

Show/Hide the salary prefix.

3

Salary Prefix

Type the salary prefix.

4

Salary Suffix

Type the salary suffix.

5

Wrap Salary in New Line

Turn on or off the wrap option.

Job Info Settings

1

Show Company

Show/Hide the company element.

2

Company Icon

Choose an icon for company.

3

Show Job Location

Show/Hide the job location.

4

Job Location Icon

Choose icon for job location.

5

Show Job Type

Show/Hide the job type element.

6

Job Type Icon

Choose icon for job type.

7

Show Additional Info

Show/Hide the additional info element.

8

Additional Info Icon

Choose icon for additional info.

Buttons Settings

1

Show Buttons

Show/Hide the buttons.

2

Button Position

Set the button positioning.

  • Inline
  • Block
3

Buttons Align

Set the alignment of buttons.

  • Start
  • Center
  • End
4

Buttons Justify

Set the justification of buttons.

  • Start
  • Center
  • End
5

Button Text

Type text to show in button.

 

6

Show Button 2

Show/Hide the second button.

7

Button Text 2

Type text to show in second button.

8

Button 2 Position

Set the positioning of second button.

Animations Settings

1

Hover Animation

Select hover animation for job listing image.

  • Grow
  • Shrink
  • Pulse
  • Pulse Grow
  • Push
  • Pop
  • Bounce In
  • Bounce Out
  • Rotate
  • Grow Rotate
  • Float
  • Sink
  • Bob
  • Hang
  • Skew
  • Wobble
  • Buzz
2

Entrance Animation

Set the entrance animation.

  • Appear
  • Scale Down
  • Scale Up
  • From Left
  • From Right
  • From Top
  • From Bottom

Jobs Settings

1

Job Title

Type the Job Title.

2

Salary/Pay/Scale

Type salary/pay/scale.

3

Links

Type details and apply link.

4

Info

Type info about company.

5

Graphic

Add image and icon.

6

Skills

Type different skills.

Job Listing Widget Styling

All elements of the widget’s design can be managed using various styling choices. You have the freedom to select colors that harmonize with your website’s aesthetic. Customize the text, icons, fonts, and layout to tailor the widget’s appearance and functionality to your specific preferences.

Layout Styling

You can set the info layout,  alignment, justification, title salary positioning, and graphic element layout.

Job Item Styling

Set the item gap, padding, background color, content background, border radius and box shadow.

Job Title Styling

Set the job title typography, text color, and text shadow.

Salary/Pay Scale Styling

You can set the typography, text color, text shadow, prefix and suffix gap, typography, and color.

Job Info Styling

Set the gap, spacing, typography, text color, and text shadow.

Info Icons Styling

Here, you can set the icon size, background size, icon gap, border, icon color, icon background color, and border radius.

Job Description Styling

You can set the job description typography, gap, text color, and text shadow. 

Graphic Element Styling

Set the graphic element width, height, gap, image fit, padding and border radius of graphic element.

Skills Styling

Here, you can set the gap, spacing, skills positioning, typography, padding, text color, background color, and box shadow of skills element.

Buttons Styling

You can style the gap, spacing, width, padding, margin, typography, border, text shadow, and box shadow of button.

Usage Examples

Here are some live use cases for the Job Listing Widget.

Download is just a click away

Get instant access to tons of Elementor goodies, completely FREE!

Hurray!

You got FREE access to the worlds leading widgets for Elementor page builder!