Lesson 3: Site Layout

Now that we have the proper branding in place, it's time to update the layout of your site. In this lesson, we'll update the links in your Navigation Menu and update your Homepage Layout.

Update the Navigation Menu

JobBoard.io gives you the ability to set your own Navigation Menu. You can link to internal or external pages. To manage your Navigation Menu:

1. Navigate to Site Config in your JobBoard.io Admin panel.
2. Choose the Themes & Customization tab.
3. Click Edit Navigation Menu.

From here we'll be able to create, edit, and delete Nav Items.

Create a new Nav Item

1. Click the Create New Nav Item button.
2. To link to a JobBoard.io page, choose the page in the Select page dropdown. To link to an external page, enter the Name as you'd like it to appear on the site and enter the URL.
3. Click Save.

If you selected a JobBoard.io page and would like to update the Name, you can do so following the Edit instructions below.

Edit an existing Nav Item

1. Click the Edit button corresponding to the item you'd like to edit.
2. Complete any desired changes.
3. Click Save.

Delete a Nav Item

To delete a Nav Item, simply click the delete button corresponding to the item you'd like to remove.

Re-order the Nav Menu

You'll also be able to re-order the Nav Items with a simple drag and drop. Click and hold the arrow on the left of the Nav Item you'd like to move, and place in the desired order.

Update the Homepage Layout

Setting the Homepage layout is the last big change we have to make to get the site looking the way we want it. JobBoard.io offers a number of widgets, explained in more detail here. For the purposes of this lesson, we'll update the default widgets. All changes take effect when you click Save, so feel free to review your changes on the home page as you go, just be sure to refresh the page.

1. Navigate to Site Config in your JobBoard.io Admin panel.
2. Choose the Themes & Customization tab.
3. Click Edit Homepage layout.

You should now have the homepage editor in front of you. You'll notice there are three sections with widgets in each. If you review carefully, you'll see that these sections and widgets correspond to the current layout of your home page.

Edit the Search Widget

1. Click Edit on the Search Widget.
2. Set a Headline and Sub Headline. Use the Headlines to Welcome visitors to the site and let them know what to expect! You can clear these fields if you don't wish to use a Headline.
3. For the Hero Image, click the refresh icon to upload a new image. We recommend an image of 1000x500 pixels as a *minimum size. The image will automatically scale when viewed on your site based on the visitor's screen dimensions.
4. If you don't wish to use a Hero Image, you can set a Background color instead.
5. Enable or disable the Search Options as desired.
6. Click Save.

Edit the Text Widget

1. You'll see a Text Widget in the Sidebar section. Click the Edit button.
2. The default text welcomes you to JobBoard.io. You should update this to welcome visitors to your site, tell them about your company, and discuss the benefits of utilizing your site in their job search. Be sure to update the Header Text for the widget as well if desired.
3. When you're done updating the Text, click Save.

Edit the Employer Widget

Editing the Employer Widget directly will allow you to add and remove featured employers. Example data is used by default. You should be sure to delete these before launching your site, though you can leave them in as a reference for the time being if you'd like.

1. You'll see the Employer Widget in the Main Column section. Click the Edit button.
2. Click Delete on each of the example Employers to remove them from the Widget.
3. If you've skipped ahead and already have employer profiles on your board that you'd like to add to the Widget, you can use the Search box to locate those records.
4. Click Save when your changes are complete.

Edit the Backfill Widget

For the Backfill Widget, you'll at least want to update the Header.

1. The Backfill Widget is located in the Main Column. Click the Edit button.
2. Update the Header Text. "Jobs from our Partners" or "Jobs from the Web" are a few examples of commonly used Headers.
3. Make other adjustments to the widget as desired, and click Save. We'd recommend waiting to Modify your backfill settings until after the completion of these lessons.

Update Remaining Widgets

The remaining widgets don't necessarily need to be updated prior to launch but do have some settings available that can be used to tweak exactly how each widget works. Feel free to click the Edit button on each remaining widget and explore your options. When you're ready, proceed to Lesson 4 below.