Getting Started with the Modern Job Board Template

This post details how to configure my "Modern Job Board" bubble template for your own specific niche. You can purchase the template here.

The Modern Job Board template is set up to showcase digital marketing jobs by default. But it's unlikely this is the niche you're targeting (if it is, I strongly recommend you try another niche as digital marketing is MUCH too broad). In this post, I'll outline the changes you'll need to make to set the template up for your own chosen market. We'll go through:

  1. The text elements you'll need to edit
  2. Adding your logo and favicon
  3. Choosing relevant categories
  4. Seeding your job board with jobs
  5. Setting up Stripe so you can take payments
  6. Setting up email notifications

It'll help if you have at least a basic working knowledge of bubble, but even if you're a complete beginner then you'll be good to go after reading these instructions.

Editing text elements

Let's assume your NoCode job board is for medical professionals in Boston. We'll need to change a few text elements to make this obvious to users. First, change the main heading on the index page. It says "Browse the Latest Digital Marketing Jobs" by default.

Default Title on Homepage of Modern Job Board Template

Let's change this to "Browse the Latest Jobs for Medical Professionals in Boston". Straight away it's pretty obvious to users who your nocode job board is for.

Updated Title on Homepage

We'll also need to update the text elements on the "Post Job Flow - Header" reusable element. This element is part of the post-job, edit-job, preview-job and checkout pages of our bubble template. These three pages all follow a similar format, where the reusable element at the top of the page contains your job boards logo, a text element and some shapes/text that shows how far along in the process of posting a job the user is.

Reusable "Post Job Flow - Header" element on post-job page of modern job board template

Obviously we'll need to change "Reach the smartest digital marketing talent" to something more appropriate for physicians in Boston. Let's go with "Find the best medical professionals in Boston".

Updated text on "Post Job Flow - Header" element on post-job page of modern job board template

Note: Conditional rules are used to change the formatting of the text/shapes in the reusable header, depending on what page the user is on. For example, when the user is on the "preview-job" page, the grey line for Step 2 will be coloured in purple, as will the "Step 2" text.

Adding your logo and favicon

No job board would be complete without a custom logo! If you don't have a logo ready to go, I generally recommend designing one yourself using Canva. It makes it super easy for anyone to make a professional looking logo in minutes. Once you have your logo, you'll need to replace the default logo on two reusable elements:

  1. Header
  2. Post Job Flow - Header

Replacing the existing logo that comes with the template is really easy. Simply click on the image element on the two reusable elements and upload your own logo.

Replacing the logo on the "Header" reusable element

Choosing relevant categories

Categories are used so users can quickly and easily see a specific type of jobs. For example, by default, when a user clicks on "SEO Jobs", they are brought to the "category" page and shown a list of SEO-related jobs.

Category page of Modern Job Board Bubble Template with SEO Jobs

SEO Jobs are obviously not going to be relevant for most niches. For our medical professionals job board, we're going to replace the existing four categories with the following:

To change your categories, go to the "Data" tab and go to "App Data".

App Data section of Data tab

You can either change the names of the existing categories or delete the default ones and create your own category names.

Updated app data with new categories

Make sure your categories have a "Slug" that matches the category. Slugs ensure that your nocode job board will have clean URLs. EG, instead of:

your URL will look like:

Google likes clean URLs, so slugs are good to have if you're planning to drive traffic to your job board via SEO (which you should be!). You can learn a bit more about slugs from this tutorial:

Once your categories are updated, you should notice the new category names in three locations in your bubble app:

Repeating group on index page
Footer with updated category names
Post-job page with updated categories

Seeding your nocode job board with jobs

All of the jobs data that comes with the Modern Job Board template are related to digital marketing. If we're building an app for medical jobs in Boston, we'll have to delete all the default jobs and manually input our own.

To delete all the jobs data that come with the template, go to the "App Data" section of the "Data" tab and click the select all button. Click the "Delete (24)" button to delete all the existing jobs data.

Deleting default jobs data

We now need to add new jobs data so that our job board doesn't look completely empty. If you have already have a large audience, you may be able to get recruiters/companies to post jobs organically. However, the reality is that most job boards start off with the founder curating and posting jobs themselves.

Some people scrape jobs from Indeed/Linkedin/other job sites. Others manually post the jobs themselves (EG see below).

tweet from Peter Askew on seeding job boards
Tweet from Peter Askew of

Modern Job Board template isn't currently set up to scrape jobs from third-party sources (although it is possible to implement this functionality with a bit of custom work). So you will need to manually curate jobs and post them to your job board by going to the "post-job" page and inputting the relevant data.

Setting up Stripe to take payments

Note: you will need to register for a Stripe account for this part of the setup. There are plenty of tutorials available on how to do this, including this one.

The Stripe plugin comes pre-installed with the Modern Job Board template. You'll need to provide the plugin with four Stripe keys in order to be able to process payments:

Navigate to the "Plugins" tab and click on the Stripe plugin. You can input the four keys here.

Stripe plugin in Bubble app

It's also a good idea to use your logo as the image for the Stripe checkout.

Email notifications

It's always nice to be notified when somebody posts a job on your bubble app. To get notified of when this happens, navigate to the checkout page and edit the workflow that occurs when somebody clicks on the "Purchase Post" button.

We're going to add one final step to this workflow, so you receive an email whenever somebody posts a job.

Adding a workflow action to send an email

Click on "Email" and then "Send email". Put your email address in the "To" field and whatever custom "Subject" and "Body" you want.