IAP Webshops

Traditional native app stores are no longer your only option for in-game monetization. With Unity’s IAP Webshops, players can browse your game’s catalog, view exclusive promotions, and make direct purchases on the web. This direct-to-consumer approach routes transactions more closely to your studio, giving you alternative payment options and greater control over your web storefront.

In this tutorial, we will walk through setting up a webshop, testing with a mock catalog, customizing the UI via AI, and integrating the final product directly into your Unity game.

Watch the overview video for a visual walkthrough of the tutorial steps.

Setting Up the Basics

To begin, open your Unity Cloud Dashboard and navigate to the In-App Purchasing section on the left sidebar. From there, select Go to Webshop.

Select Project: Pick the project you are building the storefront for (you may want to use a dedicated test project first).

Studio Name: Enter your official studio name. Note that this name applies globally to all webshops in your organization, so keep it consistent across your brand.

Once created, you will enter the Webshop Editor panel, which features a General Panel to configure your unique Shop URL, a production environment switcher, and an interactive Preview Window on the right side to track your progress in real-time.

Before linking your live financial assets, it is highly recommended to test the layouts using Unity’s built-in Mock Catalog. Toggle the Preview Only or Mock Catalog switch to instantly populate your storefront with placeholder items like Gems, Battle Passes, and Starter Packs.

Click on preview URL to open it on a new tab on the web browser

Using the Mock Catalog allows you to experiment with various conversion-driving product promotions safely:

While you can click around and simulate selections, no live financial data is processed while using the Mock Catalog

Unity makes branding your webshop incredibly intuitive through automated theme generation.

Generating a Palette From Your Assets

Instead of manually hunting down hex codes, go to the Customize Theme panel and upload an image such as your game’s promotional key art or YouTube thumbnail. Click Generate Theme, and the system automatically extracts a color palette and applies it across the storefront.

Polishing with Refine AI

If you want to tweak specific design details, you can use the Refine with AI chat tool located at the top right of the preview box.

For instance, if you want a cleaner typographic layout, you can simply type:

“Change the font type to Inter.”

The AI engine will execute the instruction, modify the backend theme JSON, and update the font files across your item descriptions, prices, and buttons seamlessly.

Once you are satisfied with the design, it’s time to import real items and prepare for transactions.

Populating the Production Catalog

Disable the Mock Catalog and click Manage Catalog. Switch your environment drop-down from Development to Production, then click Add Catalog Listing.

For every item, you’ll need to input its metadata, base price, localized price, and an image URL. For hosting item icons, you can link your image URLs to a robust Content Delivery Network (CDN), such as Google Cloud Storage, Cloudflare, or Unity’s own Cloud Content Delivery.

Linking Payment Gateways

In the Catalog & Payment Provider card, set up your payment processor. Unity tightly integrates with platforms like Stripe and Coda Payments. Simply select your primary payment method and designate a fallback provider to ensure seamless checkout experiences worldwide.

To learn more about payment providers, view the previous tutorial in this course.

To test your end-to-end integration, hit Save Draft and use the Dev Preview URL to load your webshop in a live browser window.

1. Click Buy Now on a test item to open the live secure checkout modal (e.g., Stripe Checkout).
2. For an initial test, fill out the email and payment info using Stripe test credit card numbers
3. Provide a valid test address and hit Pay.
4. For any consecutive test purchases tied to that credential, the platform streamlines the flow by requesting a quick mock verification code (simply type in all zeros).

Once processed, a successful purchase screen confirms that your webhooks and payment gateways are speaking correctly to one another.

The final step is calling this webshop directly from your deployed game environment when a player clicks an in-game “Web Shop” button.

Unity manages this via an authorized deep-linking system. Within your project scripts, your code will talk directly to the StoreController linked to your active payment provider. The exact line of C# code you will need to utilize is:

// Open the front page
 UnityIAPServices.StoreController(PaymentProvider.Name).PaymentProvidersExtendedPurchaseService.RedirectToWebshop();

// Open a specific product page
 UnityIAPServices.StoreController(PaymentProvider.Name).PaymentProvidersExtendedPurchaseService.RedirectToWebshop(catalogListingId: "your-listing-id");

This method securely packages the player’s authenticated user session token and deep-links them straight out of the game application into their external browser to complete the transaction smoothly. You can read more about it in the documentation.

If you want an overview of all the different options to integrate your in-app purchases including webshops, check out the infographic in the Resources section.

Need additional help?

Because Webshops are a feature-rich, multi-platform system, you may run into occasional environment mismatched IDs or slug rejections. If you run into any snags, consult the official Unity Webshop Troubleshooting Guide to quickly debug common setup errors.