In this article, you will learn to add Flow Cards to different categories in your Marketplace.
Before we begin, here's a reminder for you.
- Flow Card: A Flow Card is the blueprint of an app's integration that appears on your Integration Marketplace. Using the Flow Card, your end-users can set up the integration the Flow Card represents.
- Categories: Flow Cards appear in your Marketplace under different categories. For example, if a Flow Card represents an integration Flow of a CRM, it will appear under the CRM category. Depending on the integration, a Flow Card could appear under multiple categories.
In the image above, you can see 8 different Flow Cards that denote integrations with different applications.
In the image above, you can see the Categories these Flow Cards appear in.
For example, you can see all the Flow Cards that belong to the 'CRM' Category.
You can create as many Categories as you require and add as many Flow Cards to your Marketplace that you think are useful for your end-users.
Selecting Categories and Flow Cards
Let's begin selecting the Categories and Flow Cards for your Marketplace.
Step 1: Go to the Categories and Flow Cards tab in your Marketplace Deployment Builder.
Step 2: Click on the search bar under the heading Select Categories and Flow Cards to show.
A dropdown will appear where you can view and search for all the Guided Flows that you have created in your selected workspace.
Step 3: Select a Guided Flow and click on it to add to your Marketplace (shown above).
As you'll add the Guided Flow to your Marketplace, Integry will automatically place it inside the appropriate Category. These categories are created based on the categories that were saved for the App Connector inside Integry.
You can change the category your Flow Card is placed in, add a new category, or delete an auto-generated category in your Marketplace Deployment Builder (more on this later).
Adding Flows to Your Marketplace
As you already know, you can add Guided Flows to your Marketplace. These Guided Flows are created in the Guided Flow Builder for your selected App Connector.
Other than Guided Flows, you can also add Flows to your Marketplace.
Let's say, you want to add a Card to your Marketplace but you don't have an App Connector or Guided Flow created for that third-party application in your workspace. You can search for that app in the search bar (shown above) and add a Flow to your Marketplace.
A Flow when added to the Marketplace will appear as a Flow Card that will redirect your end-users to a help document or Custom Flow Builder - depending on your Marketplace's configuration.
For example, we haven't created an App Connector or Guided Flows for Contentful app in our workspace, but we can add its Card to our Marketplace. In the above image, you can see that a Flow has been added.
Flow Card Settings
After selecting your Flow Card, you can now configure its appearance in your Marketplace.
Step 4: Click on the Flow Card to open its settings menu.
The above image shows the Flow Card Settings menu, where you can edit the following:
- Title: The name of the Flow Card.
- Summary: The short description displayed on the Flow Card.
- Flow Card Icon: The icon or logo of the app which is displayed on the Flow Card.
- Flow Card Color: The color of your Flow Card.
- Categories: The Categories under which the Flow Card appears.
- Keywords: Add the keywords you want to display on the Flow Detail Page. These keywords will help the end-users understand the niche of the app and the nature of the integration.
- Detail Page: This is a toggle button. If you turn it on, your end-user will be able to view a Flow Detail page. If you turn it off, your end-user will not be able to view the Flow Detail page. Instead, they'll directly be taken to the integration set up screen.
Turning the toggle on will enable you to set the following information for the Flow Detail Page.
- Website link: Here you can add the Flow Card's. For example, we can add Sendinblue's website link here.
- Terms of Service URL: Add the link to your Terms of Service webpage here.
- Documentation URL: Add a link to your app's documentation site here.
- Support URL: Add a link to your support site here.
- Social Media profiles: Add a link to your website's Facebook, LinkedIn, and Twitter pages here.
- Screenshots: Add screenshots here that will appear on the Flow Detail Page.
- Description: Add a description here that will appear on the Flow Detail Page.
Close the menu when you're done.
Until now, you have learned how to add and configure the appearance of your Flow Cards to your Marketplace. Next, you'll learn how to create categories and how to add or remove your Flow Cards to or from a category.
Creating a Category
If you want to create a new category that doesn't exist in Integry's system, you can create it in the following way.
Search for that category in the Select Categories and Flow Cards to show search bar and click on the 'New +' button, as shown in the image above.
In this example, we've created a category 'email marketing.'
Here's how you can configure the settings for your newly created category.
Take your cursor over to the category you want to configure and click on the settings button, as shown above. It will open up a Category Settings menu.
In this menu, you can customize the following:
- Title: This is the title of the Category.
- Show: If this toggle is on, your end-users can view this category in your Marketplace. To hide it from your end-users, toggle it off.
- Sorting: This field lets you sort the Flow Cards inside your Category. There are three sorting options.
- Alphabetical: This will sort the Categories in alphabetical order.
- Newest first: This will sort the Categories according to the time of creation.
- Manual: This will keep the sorting that you have manually set by dragging and dropping the Flow Cards.
- Number of Rows: Total number of rows the Flow Cards will appear in this Category. For example, if you choose 10, two rows will be assigned to this Category in the Marketplace.
You can delete a Category from your Marketplace by clicking on the 'Delete Category' button at the bottom of the settings menu.
When you close this Category Settings menu, the changes you made will be saved, and you'll get back to the 'Categories and Flow Cards' main page.
Adding a Flow Card to a Category
Flow Cards are added to their default Categories automatically. However, if you want to change a Flow Card's category or want to add it to multiple categories, you can do that too.
Add a Flow Card to a Category by clicking the 'Add Flow' button in front of that Category, shown above. You can search for Flow Cards to add to this category.
Add the selected Guided Flow to the category.
Removing a Flow Card From Your Marketplace
If you want to remove a Flow Card from a category in your Marketplace, you can remove it by clicking the 'x' in front of the Flow Card's name, as seen in the image below.
Adding a Flow Card to the Featured Category
To mark some of your Flow Cards as featured for your end-users, you can add them to a Featured category in your Marketplace.
Take the cursor over to the Flow Card you want to add to the Featured Category and press the Star icon. The Flow Card will be marked as featured and the star icon will turn yellow. You don't have to manually create the 'Featured' category for your Marketplace. It's created by default as soon as a Flow Card is marked as featured.
Previewing Your Marketplace
To preview your Flow Cards and newly created categories in your Marketplace, click on the Open preview in new tab link.
Flow Page Appearance
Next, you can customize the appearance of your Flow Detail Page.
Click on Flow Page Appearance tab to configure the elements of the Flow Detail Page.
Click on the Keywords toggle to display relevant keywords on the Flow Detail Page.
The above image shows the keywords appearing on the bottom-left.
Flow Card Logo
Click on the Flow Card Logo toggle button to show or hide the logo on the Flow Detail Page.
Click on the Show screenshots toggle button to show or hide screenshots on your Flow Detail Page.
The above image shows screenshots appearing in the highlighted area.
Links Panel Location
Finally, you can choose the links panel location. The below image shows the link panel on the left.
Once you're done configuring your Marketplace settings, you can preview it and do some final touches before making it live for your end-users.
You have successfully created your Marketplace Deployment. You can always add more Categories and Flow Cards to your Marketplace by following this help guide.
Now you will just have to provide the URL of your Integration Marketplace to your end-users. You can get it added to the Integrations section inside your app.