Place Your First Order #

Once you have finished configuring your first customizable product, the final step is to place a test order. This allows you to verify that the complete workflow—from product customization to print file generation—is working correctly before your store goes live.

A successful test order confirms that your product configuration, pricing, order integration, and production output are all functioning as expected.

Estimated time: 5–10 minutes

Before You Begin #

Before placing a test order, make sure you have completed the following:

• A Printing Type has been created.
• A Product Base has been configured.
• At least one Design Area has been added.
• A WooCommerce product is connected to the Product Base.
• The product can be opened in the Design Studio.
• Product pricing is configured correctly.

If you have not completed these steps, refer to Create Your First Product before continuing.

Step 1. Open Your Product #

Visit your storefront and open the WooCommerce product you created.

Click the Customize button to launch the Design Studio.

If the button does not appear, verify that:

• The product is linked to a Product Base.
• The Product Base is enabled.
• The product has at least one Design Area.

Step 2. Customize the Product #

Create a simple design to test the customization workflow.

For example:

• Add a text object.
• Upload an image.
• Add clipart or artwork.
• Change the product color.
• Switch between product views (if available).
• Resize and move design elements.
• Verify that objects remain inside the Design Area.

This helps ensure that the customer editing experience works as intended.

Step 3. Add the Product to the Cart #

After completing the design, click Add to Cart.

The customized product should be added to the WooCommerce cart together with its design data.

On the Cart page, verify that:

• The customized preview image is displayed.
• Product options are correct.
• Pricing is correct.
• Quantity can be changed.
• The product can proceed to checkout.

If enabled, you can also click Edit Design to reopen the Design Studio and continue editing before completing the purchase.

Step 4. Complete Checkout #

Proceed through the normal WooCommerce checkout process.

You can use any available payment method or a test payment gateway if your store is in development.

After the order is placed successfully, WooCommerce creates a standard order that also contains the customer’s design information.

Step 5. Review the Order #

Open your WordPress dashboard.

Navigate to:

WooCommerce → Orders

Open the newly created order.

Verify that the order contains:

• Customer information
• Ordered product
• Quantity
• Selected product options
• Customization details
• Design preview (if available)

Depending on your configuration, the order will also include a link to load or download the customer’s design for production.

Step 6. Open the Customer Design #

From the order details, open the customer’s saved design.

The Design Studio should load exactly what the customer created, including:

• Text
• Images
• Artwork
• Product color
• Product view
• Design position
• Product options

This allows you to review the design before sending it to production.

Step 7. Download the Print File #

Once the design has loaded, open the Print or Download menu.

Depending on your configuration, you can export production-ready files such as:

• PNG
• PDF
• SVG

The exported artwork is generated using your configured print settings and is suitable for professional production. High-resolution output (such as 300 DPI PNG) is supported for print workflows.

Verify the Print File #

Before sending the file to production, confirm that:

• The artwork is positioned correctly.
• Print dimensions are accurate.
• Resolution is correct.
• Colors match the preview.
• Transparency is preserved where required.
• No design elements are clipped unexpectedly.
• Front and back views are exported correctly (if applicable).

If any issues are found, return to the Product Base configuration and adjust the Design Area or print settings.

Order Workflow Overview #

The complete order workflow is shown below.

Customer opens product
        ↓
Customize product
        ↓
Add to Cart
        ↓
Checkout
        ↓
WooCommerce Order
        ↓
Load Customer Design
        ↓
Download Print File
        ↓
Print & Fulfillment

Common Issues #

The Design Is Missing from the Order #

Check that:

• The product was customized before adding it to the cart.
• The product is connected to a Product Base.
• The Product Base is active.
• JavaScript errors are not preventing the design from being saved.

The Print File Is Empty #

Verify that:

• The customer added content to the Design Area.
• The Design Area is enabled.
• The printable area is configured correctly.
• The design objects are located inside the printable region.

The Print Size Is Incorrect #

Review the following settings:

• Design Area dimensions
• Printing Type configuration
• Output DPI
• Physical print size
• Product image scaling

These settings determine the final dimensions of the exported file.

The Preview Looks Different from the Print File #

This usually indicates that:

• Product image layers are configured incorrectly.
• Masks or overlays are missing.
• The print area differs from the preview area.
• The output resolution does not match the product configuration.

Review your Product Base settings and test the export again.

Best Practices #

Before launching your store, we recommend that you:

• Place several test orders with different product options.
• Test every available product color and size.
• Verify pricing calculations.
• Test multiple Design Areas and product views.
• Download and inspect every print format you intend to use.
• Print a physical sample whenever possible to verify production quality.

Testing thoroughly helps prevent production errors and ensures a smooth customer experience.

What’s Next? #

Congratulations! 🎉

You have completed the entire Quick Start workflow and successfully placed your first customized order.

Next, explore the following documentation to build more advanced products:

• Product Configuration — Create multi-view products, image layers, masks, and reusable components.
• Printing Types — Configure pricing rules and production settings.
• Design Studio — Customize the editor layout and available design tools.
• Order Management — Learn how to manage customer designs, download production files, and fulfill orders efficiently.