Picture of Infigo Iframe Integration Overview and Setup

Infigo Iframe Integration Overview and Setup

The Infigo iframe integration allows you to embed the Infigo Design Tool (Editor) directly into your application, enabling customers to design products seamlessly within your platform. This integration provides a comprehensive solution by offering the entire Infigo workflow, from creating output/artworks to pushing data into MIS systems and supporting approval processes.

Incomplete
Establishing a connection with our API

Overview

Firstly, you need to raise a ticket with our Support Desk here. Simply request for a new API token to be created on a specific storefront of yours and we will then provide this for you.

Our API uses basic authentication, so when using Postman to test the API you can take the API Token and add it to the Authorization tab, with Type set to Basic Auth. Then paste the API Token into the Username field.

Authorization Tab

To test this out, download the attached Postman Collection which includes our Authentication check API Request.

The response contains details about the storefront and provides confirmation that the API connection is good.

Authentication Check Endpoint

To authenticate API communication and validate credentials, you can utilize the endpoint provided by Infigo.

The Authentication Check Endpoint offered by Infigo serves this purpose, ensuring that the connection is established successfully.

Available Endpoints

Infigo provides a comprehensive set of endpoints to facilitate seamless integration with its platform. These endpoints allow you to load editors, manage customers, place orders, and generate outputs—all designed to enhance the customization and order flow in your applications.

  • Editor Endpoints: Integrate Infigo’s design editors dynamically within your application. Use these endpoints to capture personalization data, generate artwork, and finalize orders, providing a smooth customization experience for your customers.

  • Customer Endpoints: Manage and retrieve customer data efficiently. These endpoints let you create new customer records or access existing customer information, enabling a personalized shopping experience.

  • Order Endpoints: Simplify order management with endpoints designed to place, record, and retrieve order details, supporting your end-to-end order workflow.

  • Output Endpoints: Generate and access outputs based on orders and editor interactions. Whether you need downloadable files or print-ready artwork, these endpoints ensure you can deliver the right products to your customers.

You can check all of them in the usages of iframe-demo-app API services.

Flow Overview
Iframe.drawio_v1.png
Embedding Our Editors in Another Site

Embedding our editors into your existing site or another site is relatively straightforward. This article attempts to provide you with all the tools and understanding you will need to successfully mimic the process.

Supported Editors: MegaEdit, Infigo Editor

Firstly, we recommend viewing the attached resources (see below) as they provide additional information on how the process works along with tools to get set up quickly and start testing.

The first step with all API communication is to obtain your API Token from the Support Team.

Now that you have this, we can look at the specifics required to load an editor, capture personalization, and then create the artwork or place an order.

Infigo API Chart

The User Journey Is:

For reference, check Infigo Demo Application and GitHub Repository.

Infigo Setup

You need to ensure Infigo is configured to allow you to utilize the external iframe from a security perspective.