Skip to main content
A design template is the visual layout customers will personalize. In this guide you’ll build a very small one — just a text line and a background image — so you can see every step end to end.

​
1. Open Design Templates

From the Customei sidebar, click Design Templates. You’ll see the template listing page. Click Create template. Customei asks you for:
  • Template name — something you’ll recognize later, e.g. Mug - name + photo.
  • Canvas size — the working area, in pixels. For a standard mug wrap, try 2400 × 1000. You can change this later from template settings.
Click Create. Customei opens the template editor.

​
2. Meet the editor

The editor has three areas:
  • Toolbar (top) — add layers, undo/redo, zoom, save.
  • Canvas (center) — your working area.
  • Right panel — properties of whatever is selected.
The editor runs in an isolated iframe so it never clashes with Shopify Polaris styles. You can safely resize, open DevTools, or tab away and come back without losing state.

​
3. Add a text layer

  1. Click the Text tool in the toolbar.
  2. Click anywhere on the canvas — a layer with placeholder text appears.
  3. On the right panel, change the text content to Your name.
  4. Pick a font, size, and color from the same panel.
Drag the layer to position it. Use the corner handles to resize. Hold Shift while dragging a corner to keep proportions.
Customei’s text engine supports regular, curved and warped text. For your first template, stick with regular text — you can explore the effects in Text layers later.

​
4. Add a background image

  1. Click the Image tool.
  2. Customei opens the Library picker. If you haven’t uploaded anything yet, click Upload and pick any PNG or JPG from your computer.
  3. The image drops onto the canvas as a new layer.
  4. In the layers list (left or right panel depending on your layout), drag the image below your text so the text sits on top.
  5. Resize the image to fill the canvas.

​
5. Save

Click Save in the toolbar — or use ⌘S / Ctrl+S. Customei saves a version to the server and closes the “unsaved changes” indicator. You can leave the editor and come back any time; the template stays in Design Templates.

​
What you just built

You now have a template with:
  • A text layer customers will eventually fill with their own name.
  • An image layer acting as the background.
On its own, a template isn’t personalizable yet — it’s just a layout. The next step is to build an option set that tells Customei which layers are editable and what kind of input the customer sees.

​
Next step

Build your first option set →