Embed QuitlInk into your website

As a Fabric Shop in QuiltInk, you have the option to embed the QuiltInk pattern coloring pages for your Kits into your website.

 

For those who don’t have a website (if you sell fabric on Etsy, for example), there is an alternative option of using a link. This link can be opened in a browser and will directly redirect customers to your kit coloring pages on QuiltInk. You can also place this link on platforms such as Instagram or Facebook, allowing easy access for your customers.

 

QuitlInk offers you 3 possibility of embedding (or linking) the platform into your website:

  1. Embed the Kits tab from your profile page.
  2. Embed a single kit.
  3. Embed a specific color layout.

Code to embed your kits tab

With this option, you will be able to display and offer access to all your kits on your website, just as they appear in the Kits tab of your profile page in QuiltInk.

 

From there, visitors to your website can select the kit they wish to color and access their coloring pages.

 

This option is designed for situations where you want to create an exclusive coloring page on your website using QuiltInk. It provides a comprehensive view of your kits, making it easy for your customers to explore and color them, ultimately helping them make their selections.

 

WHERE TO OBTAIN THE CODE/LINK IN QUILTINK

 

To obtain the code for embedding your patterns tab, follow these steps:

  1.  Log in to your QuiltInk account.
  2. Click on the person icon on your profile page’s top bar and select “Edit Profile”.
  3. In the Shop Information section, find the code and link labeled “Code/Link to embed my kits tab.”
  4. Copy the code and embed it into your website as described in the section below.

Code to embed one single pattern or color layout

This option is intended for situations where you want to provide the ability to color a single pattern or color layout directly on a webpage, such as on a pattern sales page or within a blog post.

 

In these scenarios, visitors can color the patterns directly on your website while also getting inspired from the exclusive Wall for that specific pattern, which is included in the embedded window.

 

WHERE TO OBTAIN THE CODE/LINK IN QUILTINK

 

To obtain the code for embedding a single pattern or color layout, or the direct link, please follow these steps:

 

  1. Log in to your QuiltInk account.
  2. Click on the “Kits” button on your profile page.
  3. Locate the kit you want to embed and select on the “…” icon next to its name.
  4. From the drop-down menu, select the “Kit Information” option.
  5. At the Information of the kit page, you will see some information about your kit, and at the bottom, the codes to embed (or link) your whole kit or just the color layouts. Copy them and paste into your website as indicated in the next section.

Embed the code/link in your website

Follow the steps below to embed the code or link to your pattern coloring pages in QuiltInk:

 

  1. Copy the desired code or link by clicking on it or using the copy icon located on the right.
  2. Paste the embed code into the “text” editor of your website page. Alternatively, you can share the link to your Pattern/Color Layout wherever you want. The link can be placed in any location where people can copy and paste it into a browser. You can also add a hyperlink to the link, allowing customers to directly access your coloring page by clicking on it. For example, you can include the link in a PDF file, on your Etsy shop, or in your Instagram profile.
Embed code for Kits tab
Embed code for one kit or layout

Result

The result is that people will be able to color your pattern directly in your website or, if you share the link, in any browser window. More specifically:

  • Embed (link) Kits tab: This option will display the same window as the Kits tab on your QuiltInk profile page, but it will hide the top section with your information. When your visitors click on a kit, a new window will open, showing the same information and options as the single kit embed, described below.
  • Embed (or link) the whole kit with an exclusive Wall: This embed code/link option will show your customers a page with three sections:
    1. Top Section: This section contains the cover image of the kit, along with titles and other information about the pattern you are about to color.
    2. Central Bar: In the central bar, you will see, on the left, the number of mock-ups of this kit that have been published into the Public Wall or Community Wall, and on the right, a “NEW +” button, which allows users to start coloring this pattern and create their own mock-up. When clicking “NEW +,” they will be able to choose which color layout they want to use as a basis to color your kit.
    3. Wall Section: Below the central bar, users will find a section where all the mock-ups of this kit shared by you and other users are displayed.
  • Embed  (or link) one Colour Layout: This embed code/link directly links to the coloring page for a specific color layout. This option is suitable when you want to place all the individual designs to color in a blog post, for example.

Both options allow users to sign up to save their mock-ups, and if they don’t have an account, a button will redirect them to the QuiltInk platform to register and be able to have an account to save and share their mock-ups.

The embed allows you to offer the colouring QuiltInk service to your customers in a more direct way. They can color the kits in the fabric pages and then buy the fabrics directly, they don’t have to return to your website from QuiltInk. If customers don’t leave your website, they don’t have to come back, so there are more chances they will buy the fabrics.

 

If you have any questions or concerns related to the embedding QuitlInk or any aspect of using QuiltInk, we are here to help. You can reach out to us via email at info@quiltink.com or through the chat on our Instagram platform (@quilt_ink).