A two sided marketplace allows for buyers and sellers to share goods or services for purchase. A few examples include: Airbnb, Upwork, Etsy and more!

There are many tools you can use to build 2-sided marketplaces. You’ll need a website platform, a database tool or platform, a payment processing platform, a membership management platform and a form platform or tool. Depending on the tools you choose you might also need to include an automation tool to connect everything together.

Once you’ve decided on what tools you’re going to use for each of the above, it’s time to think through the data and visualization of the marketplace.

Start with a wireframe to help you as you build out your 2-sided marketplace:

1. A wireframe for how you want the marketplace website to look
2. A visual flow of the data needed:
3. User types
4. Types of data to be collected
5. How to collect appropriate data from each user type
6. Payment collection
7. How members will add, edit and delete profile information

Once your wireframes are complete, you’re ready to build.

In this example we’ll walk through how to use the Co.live template by Softr and a corresponding Airtable base to create our two-sided marketplace. Use the Softr Help Docs for detailed questions as you build.

Step 1. Duplicate the Softr template, review the page settings and user groups

‍

To find any templates for Softr, simply navigate to Softr.io and click on Explore and then templates.

1. Create an account or sign into Softr. Find the Co.live template, preview the Airtable base (if needed) and duplicate the template into your Softr account by selecting the “Use Template” button.
2. Go to “Settings” on the left hand side of the screen.
3. Open “General” and rename the application and domain. Add a favicon now or wait until the build is complete.
4. Hit Save.
5. Go to “Settings”.
6. Open “User Groups and Permissions”.
7. Open “User Groups”.
8. Select each user group and adjust user group name and condition settings based on your marketplace needs.
9. Click “Update User Group” after any adjustments made.
   💡 Note: User Groups correspond to User Type in the Airtable User Table. User groups help to establish visibility settings on the Softr application to ensure when users login they see information corresponding to their profile and user groups.
10. Go to “Theme”.
11. Adjust the typography and colors for heading, body and buttons.
12. Click “Save”.
13. Go to “Pages”.
14. Move pages by clicking and holding on the handlebar.
15. Review page settings for each page by clicking on the three dots “...”.
16. Go to “Visibility” settings and adjust as needed for your marketplace.
    💡 Note: Pages you think you might not need can be disabled by clicking on the three dots “...”, clicking “General” and then toggling off “enable page”. Click the “delete page” button to completely remove any unwanted pages.

‍

Step 2. Connect your Softr site to Airtable

‍

To add an Airtable base to any page in Softr you simply need to click the + to add a block, choose “Dynamic” select the “List” dropdown. Select the best List block layout to start from.

1. Select the List block to connect to Airtable.
2. Click the “Setup Airtable” button on the right hand window.
3. Enter your Airtable API Key found in your Airtable Account page using the documentation provided in Softr to help you locate it if needed and click “Connect to Airtable”.
4. If you’re using a template, next click the “Copy Template Base” to open the corresponding Airtable base.
5. Once open, click “Copy Base” located in the righthand corner of the template base.
6. Select the appropriate workspace to add the base to in your Airtable account.
7. Go back to Softr and click the blue text “Click here to refresh”.
8. Select the correct base from the dropdown list and click “Finish”.

‍

Step 3. Adjust your Airtable List Block settings

‍

When working with Dynamic List or Dynamic List Details blocks it is important to remember that content is updated in the corresponding Airtable Base, not in Softr. To access the settings for the Dynamic List block, simply click on the list to expand the righthand style panel. Use the refresh icon at the top of the List Style panel to refresh the connected base when making adjustments to the Airtable data.

1. Access the Dynamic List Block settings by clicking on the block.
2. Review the Airtable Base, Table, Default view, Sort by, Items per page and Items per view. Make adjustments.
3. Set any conditional filters that are needed for your marketplace.
4. Review and adjust inline filters making additions or deletions as needed. These filters help visitors filter down how they review information. Adjust their position and how data is shown to match your marketplace needs.
5. Toggle the search bar on or off. Adjust placeholder text and search by terms as needed.
6. Review and adjust list item fields by toggling off those which should not be displayed and/or adjusting what content is being shown in that field type.
7. Adjust See More button, and empty state messages.
8. Review and adjust “On Click” action for each list item using internal pages or external page links when appropriate.
   💡 Note: The list item field type cannot be adjusted in Softr. To adjust the field types, change the field type for the corresponding column in Airtable and refresh. Alternatively toggle off field settings that should not be displayed and add in fields as needed.

‍

Step 4. Set up Airtable List Blocks on additional pages

‍

Once the initial Airtable base is connected to the template, you’ll need to work through the remaining pages to make adjustments on displaying the List Block details as you did on the homepage.

1. Click Browse Hosts.
2. Select the List Block you want adjust and follow the steps to make adjustments as needed.
   💡 Note: To adjust the layout of a List Block simply click the +, choose “Dynamic” and select the appropriate List Block layout. Follow the steps to connect the correct Airtable base and table, setup the filters and connect the appropriate list items.
3. Click on the listing details page.
4. Adjust or add a new listing details block.
5. Next go to the Host Profiles page and review the listing block and list details with conditional settings.
   💡 Note: Take note of locks appearing on blocks as you go. These indicate sections that are visible to certain user groups. Review user groups by selecting the visibility icon for that block making adjustments as needed.
6. Continue to make adjustment to List blocks on Miami Listings, London Listings and Split Listings or delete pages as needed.

‍

Step 5. Add a form to allow users to become a host and list spaces

‍

To add a form to any page in Softr you simply need to click the + to add a block, choose “Dynamic”, select the “Form” dropdown and select the best block to start from.

In this example we’re reviewing the pre-built form on the “Become a Host” page.

1. Open the “Become a host” page.
2. Click on the form to open the right side style panel.
3. Make adjustments to the heading, subheading, background image, and form position. Access and adjust styling through the pallet icon.
4. Review the form fields included. Adjust or remove form field settings.
   💡 Note: Hidden fields can be used to capture information of logged in users such as name, email or other fields collected at signup.
5. Review the Softr Documentation to help with custom form adjustments.
6. Review the button text and action which controls where the form data will go once submitted. Change where the data will go by selecting the “Action” dropdown and choosing the appropriate action.
7. Repeat process for the form on the “List a Space” page. Be sure to review entire template to add or remove forms where applicable for your marketplace.

‍

Step 6. Review sign in/sign up and finalize settings for publish

‍

The final step is to review the application sign in and sign-up screens and make any last minute adjustments to get the site ready for publishing.

1. Click on the page “Sign in”. Adjust existing form or select a new sign in form.
2. To select a new form, click the +, select “Dynamic” and “User Accounts”. Choose the preferred sign in block to start from.
3. Click the page “Sign up” Adjust existing form or select a new sign up form.
4. To select a new form, click the +, select “Dynamic” and “User Accounts”. Choose the preferred sign up block to start from.
5. Review visibility settings for every page to ensure that the appropriate user groups have been enabled for your marketplace.
6. To prepare for publishing the site, complete and style adjustments, preview the site and review site settings.
7. Under settings for site, walk through each of the options making adjustments where necessary before publishing your site.
8. When all changes are made, click “Publish” and share your two-sided marketplace.

‍