Getting started
This page walks through the studio from nothing to a first order: an account, a published template, the keys your shop uses, the designer on your storefront, a printshop, and the path a design takes to become an order.
1. Create an account and an organization
Section titled “1. Create an account and an organization”Sign up for an account in the studio and confirm your email address with the link Pixonaut sends you. Until you do, every page of the studio shows only a screen saying your address is not verified, naming it, with Resend email, Change email (for a mistyped address; the link goes to the new one) and Sign out. Follow the link in the browser you signed up in, and the studio opens. If you joined through the link in an invitation mail, accepting it confirms the address it was sent to, and you go straight in. A link someone copied for you from the studio joins you without confirming the address.
The first time you log in, the studio asks you to Get started: either follow an invitation someone sent you, or create your own organization by giving it an Organization name. Everything you make from then on — templates, blanks, designs, keys — belongs to that workspace. You can rename it later under Settings, and invite colleagues under Members (see Team and roles).
2. Author a template and publish it
Section titled “2. Author a template and publish it”Under Templates, choose + New template, give it a name and a
Template ID (lowercase letters, digits and hyphens, such as
classic-tshirt), and open it in the builder.
In the builder you add the layers of your artwork — text, images and shapes — and decide which of their settings a customer may change. You also set the artwork’s Aspect ratio, its Ratio tolerance, and optionally a Background and a Cut shape. Group the layers: the groups are the steps of the customer’s form, in order.
When it is ready, choose Publish. Publishing creates a fixed version of the template that customers’ designs are built against. Then switch the template Live so storefronts can serve it. See Templates for what each of these means.
3. Define blanks (optional)
Section titled “3. Define blanks (optional)”A blank is the physical item a print goes on, such as a t-shirt or a tote, with its Placements: the spots where a print can go, and their print sizes. Create one under Blanks, or import one from a connected printshop’s catalogue.
Blanks are optional. A product with no physical item to model, such as a poster or a sign, needs none.
4. Create API keys
Section titled “4. Create API keys”Under API Keys, choose Create key. There are two kinds an integration uses:
- Publishable (pk) — for the browser. It goes into the designer on your
storefront, so anyone who opens the page can see it. It only works from the
Allowed origins you list, such as
https://shop.example.comor*.example.com. It can read templates, preview, upload a picture and commit a design. It cannot approve, print or order. - Secret (sk) — for your servers only. It approves designs, prints them and submits their orders. Never send it to a browser.
A key is shown once, when it is created. Copy it then. Revoking a key takes effect immediately. You can rename a key, and change a publishable key’s allowed origins, without creating a new one.
Connect a WooCommerce store
Section titled “Connect a WooCommerce store”Install the Pixonaut for WooCommerce plugin in your shop’s wp-admin. A
WooCommerce store needs no key copied into it (Sell on
WooCommerce walks through it). Choose Connect to
Pixonaut in the plugin’s settings in wp-admin and approve the connection in
the studio: the store receives an integration key named after it, a
publishable key bound to its address, and a webhook endpoint at the store,
all at once. The integration key acts for your workspace only within what a
store does — templates, blanks, designs, prints, orders and its own webhook
endpoint — and never manages keys, members or settings. The store may add
other hosts of its own domain to its publishable key itself, such as
https://www.shop.example.com or a checkout at
https://checkout.example.com; an origin on any other domain needs a
publishable key you create here. Connected stores are listed under
API Keys; disconnecting one revokes everything it was given. To build a
store that connects this way, see
Connecting a store. When you connect a store, the studio asks whether it is for
Live or Sandbox (once the workspace has one); a staging store belongs on the sandbox, whose keys
read _test_ instead of _live_. See Test with a sandbox.
Pixel in the store’s admin acts as whoever uses it: each person links their
own Pixonaut account from the store, and Pixel then has their permissions.
Whoever connects the store is linked as they connect it.
A connected store’s keys work on every plan, and so does a publishable key you create for your store’s own site: its address, or another host of its domain. A secret key, and a publishable key for any other site, need a plan that includes API access. On a plan without it, the page says so, and those keys stop working until the workspace has API access again; they are kept. The free plan connects one store; its connected stores stay listed, so they can still be disconnected.
5. Embed the designer on your storefront
Section titled “5. Embed the designer on your storefront”Mount the designer widget on your product page with your publishable key and the template’s id. Your customer fills in the template, sees a live preview, and approves a proof rendered by Pixonaut. See Embed the designer.
6. Connect a printshop
Section titled “6. Connect a printshop”Under Printshop, connect a partner printshop under Integrations by allowing Pixonaut on the partner’s own page, or choose Create custom connection to describe your own — how each order is handed over, by email, an HTTP request to the shop’s address, or an upload to its server. Choose a Default printshop for designs that name none. See Set up a printshop.
7. Receive webhooks
Section titled “7. Receive webhooks”Register an endpoint under Webhooks and verify every request with its signing secret. See Receive webhooks.
8. From design to order
Section titled “8. From design to order”With all of that in place, each sale follows the same path:
- Proof. The customer fills in the design in the designer and approves its proof.
- Commit. Your server commits the design from that proof with its secret key, or a connected store with its integration key, attaching any order details your printshop needs. See Approving and committing.
- Approve. Once the customer has paid, your server approves the design with its secret or integration key. You can also approve or reject designs under Designs in the studio.
- Print. Your server prints the approved design, and Pixonaut renders its print file and job ticket. You can also create a print file under Designs or Print files in the studio.
- Order. Your server sends the finished print to the design’s printshop as an order, and follows it until it ships. You can also place an order for a finished print under Orders in the studio.
Each step from the commit on is reported to your webhook endpoints. Nothing moves on by itself: a design is approved, printed and ordered only when your server or someone in your workspace does it, so your own flow decides when, whether that is when the customer adds the item to their cart or when the order is paid.
The design to order guide walks through every request, and the API reference describes each route.
Questions? Write to [email protected].