Skip to main content

Integrating Printlane in your BigCommerce store

Learn how you can install and use Printlane in your BigCommerce store.

Install Printlane from the BigCommerce App Marketplace

  1. Install Printlane from the BigCommerce App Marketplace.

  2. Click on Get this app.

  3. Log in to your store, then confirm the installation.

  4. Printlane opens in control panel, click the button to create an account.

Complete the installation in the BigCommerce control panel

To use Printlane in BigCommerce, you need to enable it in your your online store:

Create a shared text modifier to store the design reference

When a customer creates a design, a unique reference to the design is saved to this modifier on the product, so the design is stored in the cart and the order.

  1. Log in to your BigCommerce control panel.

  2. In the navigation menu, click Products.

  3. Navigate to Options and open the Shared Modifiers tab.

  4. Click Add Shared Modifier and enter the following settings:

    • Display name: Design reference

    • Modifier name: Design reference

    • Type: Text field

    • Required: Leave this unchecked (!)

  5. Save the modifier.

Make the product SKU available on the page

Printlane uses the product SKU to identify which product a customer is personalizing, so the SKU needs to be available on your product pages.

BigCommerce shows it by default, but it's worth confirming:

  1. Log in to your BigCommerce control panel.

  2. Go to Settings › Store settings and open the Display tab.

  3. Make sure Yes, show the product's SKU in my store is checked.

  4. Click Save.

Enable the designer for a product

Once you have completed the installation, you can activate the designer for a product using one of the templates in your Printlane account.

Create a template in Printlane

The designer can only open if a template is available for the product in Printlane.

  1. Open the Printlane app in the BigCommerce control panel and click the login button. You can also navigate to Printlane Studio directly.

  2. Create a template by following the steps in Creating a product template, or simply use one of the templates already in your account.

Add the shared Design reference modifier to the product

When a customer creates a design, Printlane saves a unique reference to it in the Design reference modifier you created during installation. This modifier isn't added to your products automatically, so you'll need to add it to each product where you want to activate the designer.

  1. In the BigCommerce control panel, open the product you want to edit, or create a new one.

  2. In the left menu, click Customizations.

  3. Click Add Modifier Option, then select Add Shared Modifier Options.

  4. Select the Design reference modifier and confirm your selection.

  5. Click Save to save the product.

Link the product to its template

Printlane links a product to its template by matching the product's SKU to the template ID, so the two need to be identical.

  1. In the BigCommerce control panel, edit a product or create a new one.

  2. In the left menu, click Basic Information.

  3. In the SKU field, enter the ID of a Printlane template.

  4. Click Save to save the product.

Where can I access my personalized orders?

Finding orders with a design

All orders that contain a design are listed in the Orders section of Printlane Studio. Log in to Printlane Studio and click Orders in the main menu.

Looking up a design from BigCommerce

You can also find a design from your BigCommerce control panel. Open the order and go to its Items section. Each personalized item shows a design reference in this format: 1.abc.

The number before the dot is the design ID (in this example, 1). To open the design, go to the Designs overview in Printlane Studio and search for that ID.

Frequently asked questions

I accidentally removed the Printlane script in BigCommerce's Script Manager. How do I restore it?

Email our support team at support@printlane.com and we'll recreate the script for you.

The designer isn't showing on the product page?

First, make sure the Printlane script is still listed in BigCommerce's Script Manager, the modifier is added to the product and that the product's SKU matches its template ID in Printlane.

If both look correct, the issue is most likely related to your theme. Email us at support@printlane.com and we'll look at your specific setup.

I don't want to use the SKU as the template ID, can I use another field?

Yes. You can use any field that's always available on the product page. Email support@printlane.com and tell us which field you'd like to use. One of our support agents will check whether it meets the requirements for Printlane to work correctly.

My product has multiple variants. How can I activate the designer for just one specific variant?

By default, Printlane is enabled for all of a product's variants. To limit it to specific variants, give those variants a unique SKU. Printlane then uses the SKU to decide whether the Add to Cart button launches the designer.

For example, say you sell a t-shirt with a standard variant and a customizable variant. You could give them the SKUs tshirt and customized-tshirt, and only the customizable one would open the designer.

This option has to be enabled on our end. If you'd like to use it, contact us at support@printlane.com.

How do I prevent customers from adding customizable products to the cart without designing them first?

Printlane only replaces the Add to cart button on the product detail page. Any other Add to cart buttons in your store, such as those on collection pages, in quick-view popups or in search results, will add the standard product to the cart without a design.

Below are brief instructions for disabling the Add to cart button on product cards and in the quick view. Where Add to cart buttons appear depends on your active theme, so check other parts of your store as well.

Products cards

You can turn this off in your BigCommerce control panel:

  1. Log in to your BigCommerce control panel.

  2. Go to Settings › General and open the Display tab.

  3. Under Product Settings, uncheck Show Add to Cart Link.

  4. Click Save.

This hides the button on category, brand and search pages, and on product panels on your homepage. The Add to Cart button on product pages stays visible, so customers can still open the designer there.

If the button still appears after you save, your theme may have its own setting that overrides this one. Check your theme's settings, or email us at support@printlane.com and we'll help.

Quick view

  1. Log in to your BigCommerce control panel.

  2. Go to Storefront › Themes.

  3. Click Edit in Page Builder.

  4. Open Theme Styles › Products and scroll down to Display settings.

  5. Uncheck Show quickview button on product cards.

  6. Click Save, then click Publish to apply the change to your store.

These steps are for Cornerstone, BigCommerce's default theme.

If you use a different theme and can't find this setting, check your theme's documentation or email us at support@printlane.com.

The quick cart doesn't show the design. How can I fix this?

To implement Printlane in the quick cart (the small cart that opens from the cart icon), add an Edit design link to personalized items. Customers can then edit their design straight from the quick cart, and each item's thumbnail is replaced with an image of their design. Adding the link requires a small change to your theme files.

  1. In your BigCommerce control panel, go to Storefront › Themes.

  2. Before you change anything, make a backup with Advanced › Make a Copy, so you can go back if something goes wrong.

  3. Click Advanced › Edit Theme Files.

  4. Open the template cart-preview.html. In Cornerstone-based themes, it's in templates/components/common/.

  5. Find the loop that shows the cart items (it starts with {{#each and includes cart.items). Inside that loop, paste this code where you want the link to appear:

<div>
  {{#each options}}
    {{#if name "===" "design reference"}}
      <a href="#" target="_blank" class="printlane-open-personalisation" data-printlane="{{value}}">Edit design</a>
    {{/if}}
  {{/each}}
</div>

The link only appears on items that have a Printlane design, because the code looks for the product option named "design reference".

Example: here the link sits between the product name and the price. Lines marked ... stay unchanged.

{{#each (limit cart.items 4)}}
    <li class="previewCartItem">
        ...
        <div class="previewCartItem-content">
            ...
            <h6 class="previewCartItem-name">
                <a href="{{url}}" alt="{{name}}" title="{{name}}">{{name}}</a>
            </h6>

            <!-- Printlane: Edit design link -->
            <div>
                {{#each options}}
                    {{#if name "===" "design reference"}}
                        <a href="#" target="_blank" class="printlane-open-personalisation" data-printlane="{{value}}">Edit design</a>
                    {{/if}}
                {{/each}}
            </div>
            <!-- End Printlane -->

            <span class="previewCartItem-price">
                ...
            </span>
        </div>
    </li>
{{/each}}

Important: updating your theme to a new version overwrites changes you've made to its files. After every theme update, you'll need to add this code again.

Can customers review there design after completing an order?

You can let customers review their personalized design straight from their BigCommerce order confirmation email by adding a View design link to the Order Email template.

  1. Log in to your BigCommerce control panel.

  2. Go to Marketing › Transactional Emails.

  3. Open the Order Email template for editing.

  4. In the template code, find the block below. Search for attribute_lines (Ctrl+F / Cmd+F) to locate it quickly; the indentation in your template may differ.

{{#if attribute_lines}}
  <p class="products__attributes">{{join attribute_lines ', '}}</p>
{{/if}}

5. Replace the entire block with:

{{#if attribute_lines}}
  <p class="products__attributes">
    {{~#each attribute_lines~}}
      {{~#contains this 'design reference'~}}
        <a href="https://preview.printlane.com/app.html?storeId=YOUR_STORE_ID&designReference={{strReplace this 'Design reference: ' ''}}" target="_blank">View design</a>
      {{~else~}}
        {{this}}
      {{~/contains~}}
    {{~/each~}}
  </p>
{{/if}}

6. In the code you just pasted, replace YOUR_STORE_ID with your Printlane Store ID. You can find it at the top of the Settings page in Printlane Studio.

7. Save the template.

Related Articles
Did this answer your question?