Bubble.io and Printful integration: Step-by-Step Guide 2024

Creating an integration between Bubble.io and Printful involves linking two platforms together, one being Bubble.io, a visual programming language for web and mobile applications, and the other being Printful, a printing and drop shipping service for clothing and home goods. The exact method of integration can vary according to specific needs, but a general guide is as follows:

Step 1: Understand the Basics

Before proceeding further, make sure you have a basic understanding of how Bubble.io and Printful function individually.

Bubble.io allows you to design a functional web application easily without requiring extensive knowledge of coding.

Printful offers on-demand order fulfillment and warehousing services. When a customer purchases a product on your eCommerce platform, Printful will print the products and fulfill orders directly to your consumers.

Step 2: Create Accounts

You will need to create accounts in both Bubble.io and Printful if you haven’t already done so.

Step 3: Generate Printful API Key

You will initially need to generate an API key from your Printful account. To do so:

• Open your Printful dashboard.
• Head over to the Stores section and find API on the dropdown list.
• Click the Generate API key.
• You'll now see an API key generated for your account. Copy this key as you'll need to enter it within Bubble.io.

Step 4: Installing the API Connector Plugin

To integrate Printful with Bubble.io, you'll need to install the API Connector plugin:

• Open your Bubble.io dashboard.
• Go to the Plugins tab and click add plugins.
• In the Plugin search bar, type API Connector and install it.

Step 5: Configuring the API Plugin

• After installing the API plugin, go back to the application editor.
• Go to the Plugins tab and find the API Connector.
• Click on Add another API
• Now, you'll be configuring multiple calls to the Printful API. Firstly, set up the 'get product' API call.
• Paste your API key in the shared headers section with the key being "Authorization" and the value being "Bearer YOUR_API_KEY".

Step 6: Set up API Calls

Depending on your needs, you can configure multiple API calls, but at its core, you'll usually need to set up a GET and POST API.

To configure a GET API call to fetch printful product details:

• Click on Add another API Call.
• Name the API Call 'Get Product'.
• Choose 'GET' as the method.
• Use the Printful product API URL: https://api.printful.com/products/ for the endpoint.
• Enable 'Use as data' as the data type.

To configure a POST API call to create orders in printful:

• Click on Add another API Call
• Name the API Call 'Create Order'.
• Choose 'POST' as the method.
• Use the Printful order API URL: https://api.printful.com/orders for the endpoint.
• Enable 'Use as action' as the data type.

Step 7: Parsing API Response

Bubble.io allows you to parse API responses and use the data within the application. You can click on the button Initialize call to get the data structure.

Step 8: Configuring Workflow

Once the API is integrated and successfully returns the required data with GET request, you need to set up workflows to trigger API Calls.

• Go to your bubble.io application editor.
• Open any page and drag and drop any UI element like a button, which you can use to trigger workflows.
• Go to the workflow tab and start a new workflow related to the button you created.
• In the Workflow Editor, look under Plugins, and you will see 'Create Order’.
• Fill in the required dynamic data in this workflow action.

Remember, the workflow setup may change according to your specific application design and functionality.

After you've finished setting up everything, Bubble and Printful are now integrated! You can now automate product printing and order fulfillment by triggering workflow actions based on your user's actions in your Bubble.io app.