In this tutorial we will cover what is Dittofi's two sided marketplace template and how to choose, install and to set up Dittofi's marketplace templates.
Last updated
Dittofi's marketplace template is an online marketplace template can be used to as the foundation to build an entirely unique B2C or p2p marketplaces just like Amazon, Airbnb or Upwork. Marketplaces can be either:
To choose a marketplace template, you need to first sign up to Dittofi and then go to the marketplaces page inside the platform. To do this you must first visit the sign up or login page @ https://prod.dittofi.link/. This is shown below.
If this is the first time that you've logged into Dittofi, you will then get a list of template applications to choose from. This includes full stack learning management systems, CRM solutions, directory apps and more. From this list, you can search for "Marketplace" in the search bar (as shown below) to return a list of the different marketplace solutions.
PLEASE NOTE: Not all of the templates are developed by Dittofi. Some are developed by our technology partners. However, as such some of the templates are full stack templates. This means that they are fully functional marketplace solutions. Other tempaltes, such as those developed by our partners are frontend only solutions.
Frontend only solutions can be combined with our backend marketplace template however, this will be more work to hook up the frontend to the backend.
Choose the marketplace that you're most interested in. To learn more about each template, click the "View Tempalte" button to view the individual marketplace template. This will bring up a details screen that tells you what features are included within each template. Below is an example of the Peer to Peer Rental Marketplace template.
Once you have chosen a marketplace template, the next step is to install the marketplace template. To do this click the install button, give your marketplace a name, choose a Dittofi workspace to install your marketplace into and click "Install". This will create the marketplace inside your Dittofi workspace.
This will then install your marketplace inside of Dittofi's visual development studio. This can take a few minutes however it saves you 3 - 6 months of custom development time, so it's worth the wait.
Once your marketplace template has installed, the next step is to go through the guided onboarding for your marketplace. To do this click the "Build Code" button at the top of the marketplace screen.
Once the code has built, you can then click the "Preview" button and this will launch the marketplace template. This will load up an onboarding form for your marketplace template. This will allow you to enter key information such as the name of your marketplace, a description, the marketplace logo, your Stripe API keys and so on. Let's go through each of these steps now.
To build your marketplace code click "Build Code". This will generate your marketplace code and deploy this into Dittofi's prebuilt marketplace hosting model.
After the code has generated, click "Preview". Normally this will allow you to Preview your marketplace however, the first time you do this it will start a suite of forms to help configure your marketplace.
After clicking preview, you will see the following screen. Click "Get Started" to begin the onboarding process.
There are 10 steps to the onboarding process, let's go through each of these steps now.
Onboarding step 1. Give your marketplace a name
The first step in the process is to give your marketplace a name and description. Don't worry if you make a mistake here, you can change these at a later point in time.
Onboarding step 2. Create an admin of your marketplace
Step 2 is to enter an email and password for the admin of your marketplace. This can be changed later on and you have the option to add multiple marketplace admins.
Onboarding step 3. Input your marketplace logo
Next up, you need to input a marketplace logo. In this case we put in the name "Canal Hub" for my marketplace that will match canal boat owners with people who want to rent out canal boats.
You can change your logo later if needed.
Note. If you don't have a logo, you can use Google to search for a free logo generator on Google.
Onboarding step 4. Set your default currency
The default currency of your marketplace is the currency that you marketplace will default to. You can setup multiple currencies however there are certain best practices that you need to adhear to to make this work. For instance product, rental or service listings should only be in one currency. This will allow features such as the price filter to work well rather than comparing listings with different exchange rates such as the Yen vs the USD.
Onboarding step 5. Setting up payments
Now it is time to setup payments. To do this, you need to enter your Stripe API key. Stripe will give you two keys, a test key and a live, production key. It's best practice to enter your test key at this stage.
To find your test or production stripe key, visit your stripe dashboard and enter the developer section. You can then click to copy your stripe key, as shown below.
Important. If you've not already done so, remember you will need to setup a Stripe Connect account in order to accept payouts.
Once you have your Stripe key, you can come back to your marketplace and enter your Stripe key, as shown below.
Please note. The marketplace business model defaults to a commission based business model. We will show you how you can change this later or, alternatively, you can work with our development team to quickly implement a custom marketplace business model.
Onboarding step 7. Publish
Congratulates, it is now time to publish your marketplace. Click "Publish" to finish setting up your marketplace. You now have a fully functional two sided marketplace that is backed by enterprise grade code written in React and Google Go.
After clicking the publish button, you will get pulled through to the homepage of your marketplace. Your marketplace logo will be in the top left of the screen and your marketplace name is set at the bottom left of the marketplace, as shown below.
Now that you have your marketplace setup, in the next section we will give you a quick tour of the marketplace so that you can understand how it works.
