Career Site Builder: Business widgets

Available for	Roles	Super Admin, Admin, Team Member, Limited Team Member, Interviewer Limited to 5 users per Lever instance
	Packages	Standard Career Site Builder

Lever's Career Site Builder allows you to create your own custom career site connected to your Lever environment. You can use the builder to control the look and feel of your career site, ensuring that each candidate's experience aligns with your organization's brand. Widgets are the building blocks of your site. In this article, you will learn about the different types of business widgets that you can add to your career site. For guidelines on how to use widgets on your career site, including adding and editing widgets, refer to our widgets overview article. Click below to reveal the full list of business widget types:

Contact forms

Use the Contact Form widget to add a complete web form to your site. The Contact Form widget allows you to provide visitors with a variety of input areas; specific text, drop-down, radio buttons, check boxes, date, time, email, and phone numbers. You can use the form for email newsletter opt-ins, customer questions, or simply to gather feedback from your site visitors.

On radio buttons and check boxes, you can add images to display for the options. The images will not appear in the email received from the form submissions, but the selected label appears (even if hidden on the site). We do not recommend duplicating contact forms, as this typically results in issues in the duplicated contact form.

Content editor

To access the content editor, right-click the widget, and click Edit Content.

On the 'Form Items' tab:

• Decide what information you would like to collect from your visitors and then modify the existing fields by clicking the name of the field; to add new fields, click Add Field
  • If your form includes a File Attachment field, the file name must not include a space when uploaded. The file size limit for attachments is 10MB.
• Type the text you want to appear on the 'Submit' button
• By default, reCAPTCHA validation is added to new forms. This protects your form from spammers and speeds up the form submission process for site visitors. Select a reCAPTCHA position. Select to display the reCAPTCHA as an icon or text in the form.
• Type a Form title; to hide the form title, click the eye icon.
  • If you change the title of the form, the title only changes after a new response is submitted. To change the form name quickly, we suggest you submit a test response and wait a few minutes for the form to update.

On the 'Submission' tab:

• To set the email address and subject for receiving form responses, click Submission recipients; make sure to enter the email address in the Submission recipients step in order to have a copy of the information submitted.
  • If the Submission recipient is empty, the primary email in the content library will be used. If no such email exists, the account owner will be used as the default submission recipient. All responses go to the form responses page.
• To set the confirmation and error messages to display when visitors submit a form, click Submission actions. Use the Rich Text Editor to add color, emphasis (bold, italics and underline), and bullets to text in the message boxes. To have the form redirect to a page after submission, click the 'Redirect to a page after submission' toggle, and select the page to which you want to redirect.
• To add tracking code to your form, click Tracking, and paste conversion code or AdWords in the field provided

On the 'Integration' tab, send successful submission data to a third-party service (see below for more information on integrations).

Design editor

To open the contact form design editor, right-click the Contact Form widget, and click Edit Design. In the design editor, you can change the button layout, items, frame, and spacing.

Layout

On the 'Layout' tab:

• Click the layout icon to select a layout design for the contact form
• To change the form alignment, click Left or Right

Item

On the 'Item' tab:

• To make edits to the field style and field text, click Fields
• To edit the button style and button text, click Button; to revert back to the theme style, click Revert to theme button

Frame

On the 'Frame' tab:

• To make edits to the frame style, click Frame Style; you can change the background by adding a color or image
• To change the text style of the title, click Form Title
• To change the text style of the submission notification, click Submission Message

Spacing

To make edits to the padding and margins of the contact form, click the 'Spacing' tab. For more information about spacing, see the 'Inner and outer spacing' section in our widgets overview article.

Add connected data

You can connect the email address to the content library, or to an email field in collections. Additionally, you can add collection fields such as apartment ID or team member name to the email subject or as external fields sent in the form. Those additional fields will be available not just in the form email but also when accessing the form responses data from site overview.

To add connected data to a contact form:

• Right-click the widget, and click Connect to Data
• Select the email address and additional fields you want to include in the contact form email
• (Optional) Click Edit Content and make any necessary changes to the content; all changes will be synced with your content library
• Click Done

Configure a GDPR-friendly contact form

To obtain consent from your visitors upon contact form submission, add a new field to your contact form following the instructions above and select either Opt-In or Free Text as the field type.

Add opt-in field

To add a check box confirming your visitor's consent to share form responses, add an Opt-In field. This field will be required to submit the form response. The default text is: "By checking, I agree to share my form responses"

Add free text field

To add a different notification, add a Free Text field. The field appears as a notification below the fields of your contact form.

Contact form responses

To manage and delete responses received from a contact form:

• From the Dashboard, click Site Overview, then select Form Responses; alternatively, in the side panel of the editor, click Content, click Site Content, and then click Manage Form Responses
  • The option to export Contact Form responses is only available when you access the responses from the Dashboard.
• The Form Responses page opens and allows you to remove any response to any form on the site. You can search for relevant responses in the 'Search responses' search box. Ensure you search for the exact name, phrase, or characters.
• Click on the relevant form tab to open a table which includes:
  • The date of the form response submission
  • The input from each of the form fields
  • The option to delete the form response
• To export form responses in CSV format, click Export to CSV in the top-right corner of the Form Responses section

This option will not be available if there were no form responses on the live site.

Respond to customer contact form submissions

You can respond to an applicant's contact form submission directly from your email. When you receive an email from Website Builder with the details of the contact form submission, click Reply to Customer in the body of the email. This allows you to reply to the email address of the customer. If the customer listed more than one email address, it will only be sent to the first email address listed.

Contact form integrations

To extend the reach of your Contact Form, integrate it with Google Sheets, Mailchimp, Constant Contact, or a third-party application using Webhooks. To add integrations, right-click the contact form, click Edit Content, and click the 'Integrations' tab.

Google Sheets integration

Use the Google Sheets integration to instantly add contact form submission data to a spreadsheet in Google Sheets. All contact fields in the form will be populated into the spreadsheet, including a time stamp of when the form was submitted.

• Click Google Sheets, and click Sign in with Google
• Click Allow to grant permissions to connect to your Google account. If your computer is connected to multiple Google accounts, select the account you would like to connect to this form.
• Select if you want to add data to an existing spreadsheet or to a new one
• Select the spreadsheet you would like to submit the form data to. You can select the spreadsheet from a list, or use the search bar to find a specific sheet.

If you are using the Google Sheets information, keep in mind the following:

• If you have multiple forms on the site you can connect each one to a different spreadsheet, including spreadsheets in different Google accounts
• You can connect a couple of forms to the same spreadsheet. In this case, make sure that the fields and order in the form are identical to fit the information submitted.
• Submitting form data to a Google spreadsheet does not prevent you from downloading the data as a .csv file, or from receiving form submission emails

MailChimp integration

MailChimp is a tool for the distribution of email campaigns, newsletters, and so on. By using the new form integration, site owners can manage contact lists of potential clients (site visitors) by collecting email addresses, which are submitted to the form and send them automatically to MailChimp.

You must have a MailChimp account. Once you have an account, create a mailing list in your MailChimp account where the contact details will be collected.

• Click MailChimp, and then click Connect to MailChimp
• Sign in with your MailChimp credentials
• Select your MailChimp contact list from the drop-down menu
• Configure your form fields. In addition to the email address, you can automatically send first name and last name fields to MailChimp. You must set up the email, first name, last name fields within the form.

The only fields you can connect to MailChimp are First Name, Last Name, and Email. The integration will only work if you configure the fields with the exact same name on the Contact Form. A field may be left empty if you select to Leave this field empty in the drop-down menu.

Constant Contact integration

This is a similar integration to MailChimp, but allows site owners to create mailing lists in their Constant Contact account. You must have a Constant Contact account. Once you have an account, create a mailing list in your Constant Contact account where the contact details will be collected.

• Click Constant Contact, and then click Connect to Constant Contact
• Sign in with your Constant Contact credentials
• Select your Constant Contact list from the drop-down menu
• Configure your form fields. In addition to the email address, you can automatically send first name, last name, and phone number to Constant Contact. The user is required to set up the email, first name, last name fields within the contact form. Email address and text message are added by default.

Webhook integrations

Numerous online and cloud services offer integrations through a path called Webhooks. Webhooks send notifications to a specific web address called the endpoint URL. You can connect the contact form to send an event when the contact form is submitted.

To connect the contact form to another service using Webhooks, you need to create a custom endpoint URL with your desired service and paste it into the Webhooks integration field in the contact form. Once you add a Webhook URL, and the form is submitted, a POST request is sent to the endpoint with the data in the body in JSON format. The following is an example of the JSON data:

{"Submission Date":"06/02/2016 10:23:54","Form Title":"Contact Us","Name":"John Smith","Email":"test@example.com","Phone":"(555).555.1212","Message":"Webhook Form Submission!"}

Submission Date and Form Title will always be provisioned. The other fields (field_name : value) are based on the fields configured in the form. All field information is set as a string and contained in quotation marks. For example, 7 is sent as "7".

Create an endpoint URL
Endpoints are set up on third-party services (for example, Zapier or Slack), or another server that you control. These endpoints are specifically set up to receive notifications from the Webhook.

Integration ideas

• Zapier - Connect the contact form data to Zapier for unlimited possibilities. Connect with virtually any modern cloud service, including CRMs like Salesforce, Sugar CRM, Zoho and more.
• Slack - A robust messaging app that you can connect to receive notifications as soon as form data is submitted.
• Custom Integration - Create your own custom Webhooks to integrate with the contact form. For example, save submissions into a database or connect to custom apps or third-party services.

File attachments

Files can be attached to submissions by creating a file attachment field in the contact form. Links to uploaded files are available in the form submissions’ download file, as well as in any of the form integrations such as Webhooks and Google Sheets. There are no restrictions on the type of file that may be uploaded. Site visitors are not be able to upload files larger than 10MB.

• Click a contact form to open the Content editor.
• On the 'Form Items' tab, click Add field, and select File attachment from the field type drop-down
• To change the name of the field, type placeholder text
• A link to upload files is added to your form

Contact form troubleshooting

If the Submission recipient is empty, the primary email in the content library will be used. If no such email exists, the account owner will be used as the default submission recipient. All responses go to the form responses page. If you are not able to receive any form submissions that are being sent using the Contact Form widget, most likely it is because our mail is being filtered as spam on your email server. If you do not receive emails from Website Builder, check your spam folder. If you still do not see the email, make sure to white list the IP addresses 167.89.22.215 and 149.72.216.48 in your email provider's settings.

The following checklist only applies to contact forms built using the Contact Form widget:

• Check the form responses to ensure the contact form is working. You can click the contact form >>> click form responses to download it.
• Check to see if the email is valid. If you enter multiple emails, remember to use a comma between emails (no spaces) to separate them.
• Check your spam folder on your site.
• Check your email filter and blacklist settings to ensure that they are not being blocked.
• Add no-reply@multiscreensite.com to your email white list.
• Create a new page and insert your contact form there to see if it works.
• Turn off any custom scripts in your site in the site settings.

If your contact form still does not work after running through the troubleshooting checklist, contact your email provider to look into why our contact form email submissions are not being received. If it is working on another page on your mobile site but not the page it is meant to work on, that usually means there is a custom script interfering with your contact form working. Either reset the page or check your page for any custom scripts that might be causing this issue.

Zoom widget

Zoom is a great tool for attracting new visitors, creating a database of email addresses for future communications, and solidifying your client's reputation in their field. Add a Zoom widget to your site to allow your customers to communicate with their clients through video conferences. The meeting or the webinar can be seen by visitors in a frame on the site. In order to use the widget, you must have a Zoom account in zoom.us. The meeting settings are configured within zoom.us, and once the meeting details are added, you can click to join the meeting from the site. Sites must be in HTTPS to use the Zoom widget.

Content editor

To access the content editor:

• Right-click the widget, and click Edit Content; Configure the following:
  • Default Meeting ID - Type the default meeting ID for recurring meetings. To allow visitors to type a unique meeting ID, leave this blank. Type a Meeting ID if you are registering for a known event (recurring or not), so your customers do not need to enter the ID.
  • Request a meeting ID - If there is a default meeting ID for recurring meetings, disable this option.
  • Request a meeting password - Go to zoom.us to configure if the meeting requires a password. Ensure you have a way to communicate the password with your customers if you require one.
• Configure the text you want to appear on the buttons and fields of the widget (Join button, button text while joining, Name label, and so on).

Design editor

To access the design editor, right-click the widget, and click Edit Design. Configure the design of the Input fields and Join Button.

Troubleshooting

Error message: "Your connection has timed out and you cannot join the meeting. Verify your network connectivity and try again".

To troubleshoot this error message, try the following:

• Clear browser cache and cookies
• Try accessing zoom meeting from a different browser.
• Try using a different Zoom account to create the meeting.
• If you are creating the meeting using your personal meeting ID, try creating a meeting with a generated ID. If you created it with a generated ID, try creating a meeting with your personal meeting ID.
• Check your Zoom profile settings on the Zoom website. Is your profile set to only create meetings by invite or host approval? Are all your meetings password protected by default? There are several settings that may affect this.

Map widget

Show your visitors a map of any location you like. Use the Map widget to show the location of your brick-and-mortar business or a special event. You can also use it to show customers where they will find parking.

Content editor

To access the content editor:

• Right-click the widget, and click Edit Content
• Type your business address in the field provided
• Select the address from the drop-down that appears. If your address does not show up in the drop-down, it means the HERE database that Website Builder uses does not contain the address. To submit or correct the address, contact HERE Map Creator.
• You can choose to display a map button instead of a map image. To display a map button on specific devices, select the 'Use button on' devices where you want the button to appear. If no devices are chosen, the map image will be displayed.
  Type the text that you want to appear on the button in the 'Text on button' field provided

Display location info popup

To display a location information popup on the map widget:

• Type a title and description for the popup
• Select to display the popup On hover, On click, or Always from the Popup display drop-down

Design editor

To access the design editor, right-click the widget, and click Edit Design. Click the 'Layout' tab to edit the design of the map that appears on your site.

Embed a Google Map using an HTML widget

To embed maps from Google Maps using the HTML widget:

• Navigate to Google Maps
• Search for the location you want
• Click on the menu on the top left, then click Share or embed map
• Click the 'Embed map' tab.
• Copy the URL in the quotes after <iframe src =". Make sure to copy the complete URL nested in the quotes.

• Navigate to your site and, in the left panel, click Widgets, and drag the HTML widget into a row or column

• Use the following embed code and add the URL you obtained from Google Maps in the quotations after iframe src=:
  <div class="embed-container"><iframe src=" " frameborder="0" allowfullscreen></iframe></div>

• Go into Developer Mode

• Click Site HTML/CSS, and then click site.css

• Embed the following CSS into this section:
  .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

The map will resize appropriately for the different device views. If you use the normal Google Maps embed code, the size of the map widget will appear static on all devices and will cut off in the mobile view.

Google Calendar widget

Keep site visitors up-to-date at a glance by adding the Google calendar widget to your site. It is a great way to keep visitors engaged by showing them upcoming events, bookings, workshops, seminars and more. The widget provides a seamless integration of a public Google calendar and can be customized like any other widget. This widget enables you to display public Google calendars only.
If you have added a calendar after connecting an account, the calendar may not appear in the calendar options. To display, disconnect and then reconnect the account. The Google Calendar widget does not display multi-day events.

Content editor

To access the content editor:

• Right-click the widget, and click Edit Content
• Click Sign in with Google; after the account is connected, you will see all public Google calendars associated with that account
• Select the public calendar you want to display and which day of the week you want the calendar to start on
• To add or edit events, go directly to the Google calendar

Design editor

To access the design editor:

• Right-click the widget, and click Edit Design
• To customize the style of the calendar sections, click Calendar; customize the following:
  • Header—month & icon
  • Days of the week
  • All days
  • Events
  • Today
  • Calendar direction
• To customize the style of the event popup that displays when you click an event in the calendar, click Event Popup; on mobile, events are marked with a dot.

Supported fields

The following fields are supported in the Google Calendar widget:

• Title
• Description
• Date and Time

The following fields are not supported:

• Location
• File

Click to call

A Click To Call widget initiates a phone call when pressed. Adding a Click To Call button to the mobile version of your site makes it easy for visitors to call your business. The Click To Call widget asks the visitor's device to call the number set in the phone number field. Some devices may not have a way to handle this (most desktop computers and tablets, for example), or may handle it in unusual ways. We recommend using the Click To Call button on the mobile version of your site, only.

Content editor

To access the content editor:

• Right-click the widget, and click Edit Content
• Type a phone number in the field provided; type a plus symbol (+) before the country code for international numbers
  • There is no standardized way to automatically dial extensions.
• Type the text you want to display on the button

Design editor

To access the design editor, right-click the widget, and click Edit Design. To make the widget a floating widget, enable the 'Floating' toggle, and select a position for the widget. To display the floating button on the current page only, enable the 'Show on this page only' toggle.

Click to email

When you add an Email widget to your site, you make it possible for visitors to be prompted to send an email to your address. Adding this to your home page can help turn visitors into customers; adding it to contact pages makes it easy for visitors to contact you as quickly as possible. The Email widget asks the visitor's device to email the address set in the email address field. Some devices may not have a way to handle this, or may handle it in unusual ways. You may also want to display the email address so that users who cannot send an email automatically through their device can send an email manually.

Content editor

To access the content editor:

• Right-click the widget, and click Edit Content
• Type an email address in the field provided; this email address added to the button is not hidden, and can be collected by anyone visiting the page.
  • If you would prefer to hide your email address from potential spammers, consider using a Contact Form instead. See the 'Contact forms' section above for more information.
• Type the text you want to display on the button

Design editor

To access the design editor, right-click the widget, and click Edit Design. To make the widget a floating widget, enable the 'Floating' toggle, and select a position for the widget. To display the floating button on the current page only, enable the 'Show on this page only' toggle.

Business hours

The business hours widget displays the days and times your business is open. This widget is particularly useful for making sure your customers can easily find out when to contact or visit your business, ensuring that you do not lose any potential customers due to a misunderstanding about when you are available.

Content editor

Once you add a business hours widget to your site, it automatically tries to find your business hours and add them to your site. If you want to change the hours, right-click the widget and click Edit Content.

Build business hours online

• Select the Online option in the business hours widget
• Type the name of your business or your business's phone number in the search box
• Select your business from the drop-down list
• Click Edit Business Hours to make any changes if the automatic import tool does not find the correct hours.

Build your own business hours

• Select the Build Your Own option in the business hours widget
• From the menu, select whichever day or days you want to set hours for and select the appropriate hours from the drop-down
• To set multiple hour ranges in a single day, click Add Hours
• Click Set Special Days and Holidays to add exceptions to your business hours or to make customers aware of different hours on those days

Advanced options

You have the following advanced options:

• Start Week On - Set what calendar day your business week starts on
• Use 24-hour clock - Toggle between a 12-hour AM/PM clock and a 24-hour clock
• Combine days with identical opening hours - If multiple consecutive days in your workweek have identical business hours, this option combines them, so that they appear on the same line
• Title - Select a title to display above your business hours (or hide it by clicking the eye icon)

Design editor

To access the design editor, right-click the widget, and click Edit Design:

• On the 'Item' tab, edit the design of the items, such as font, size and color
• On the 'Frame' tab, change the background and border styles
• On the 'Spacing' tab, customize the inner and outer spacing

Multi-location widget

The Multi Location widget displays a list or map of all of your business locations. Visitors can see these locations, find the nearest location to them, and click to call the specific business location they want to visit. This widget does not give directions from one location to another.

Content editor

To access the content editor:

• Right-click the widget, and click Edit Content
• To find your location online, type the address of your business location
• To add another location, click Add location
• Edit the text of the 'Nearest location button' and 'Multi location title'; to hide the button and title, click the eye icons
• To edit the location settings, click a location in the list
  • Edit the business address
  • Display or hide the location title
  • Add additional information, and a location phone number; to display a click to call button on the location, click the 'Show Click to Call' button toggle
  • Create a link to display on that location's entry to guide your visitors to a specific page.

The 'Find Nearest Location' button can only appear under a secure connection (HTTPS). When visiting the site from a non secure connection (HTTP) the button will not show.

Design editor

To access the design editor:

• Right-click the widget, and click Edit Design
• On the 'Item' tab, configure the style of the following:
  • Item title
  • Additional information
  • Click to Call button

Yelp reviews

The Yelp Reviews widget displays reviews from your Yelp profile. Customer reviews can improve your reputation and boost the confidence of potential applicants. The Yelp Reviews widget only shows positive reviews, and Yelp sends only three reviews to the widget. In some cases, fewer than three reviews may appear.

Content editor

To access the content editor:

• Right-click the widget, and click Edit Content
• Type the address of your Yelp page in the field provided, and click the 'Search' button
  • If there is a Yelp page with this URL, it will connect automatically
  • If this is not the correct page, click Enter your Yelp URL again and type another URL
    • If the URL does not connect to a Yelp page, you will see the following message: "No results found. Please modify your search". To try again, simply edit the URL in the text box above this message.
• Edit the title of your Yelp reviews.; to hide the title, click the eye icon

Design editor

To access the design editor, right-click the widget, and click Edit Design.