Add a Ticket Center to a Shopify App

How to add a ticket center to a Shopify app. Step by step guide using Helpdesky's embeddable portal, with a quick comparison to Crisp.

If you build apps for Shopify, your merchants and their shoppers will eventually need a place to file and track support requests. A ticket center is the right answer. It gives every signed in user a portal where they can see open and closed conversations, reply to past tickets and start new ones, all without leaving your Shopify surface.

This guide walks through adding a ticket center to a Shopify app from scratch, using Helpdesky. At the end, there is a short, honest comparison with Crisp's ticket center plugin.

If you want the deep technical reference for the embed itself, the Add a Ticket Center to Your Shopify App article covers the HMAC and embed mechanics in detail. This page is the higher level "how do I plan and ship this" walkthrough.

Decide where the ticket center will live

Shopify apps live in two main surfaces. Pick where your ticket center makes most sense before you write any code.

  • Embedded admin app: a route inside the Shopify Admin like /app/support. Best when the support relationship is between you and the merchant.
  • Customer account UI extension: a block inside the storefront customer account area. Best when the support relationship is between the merchant and their shoppers.

You can do both, but most apps start with one. Pick the surface where the user already expects to find help.

Create your Helpdesky helpdesk

Sign up at helpdesky.io and create a new helpdesk. While you are in the dashboard, do three things:

  • Set your brand colour, logo and favicon so the portal matches your app
  • Pick a light or dark theme that fits the Shopify surface you are embedding into
  • Optionally connect a custom domain like help.yourapp.com

Read Branding Your Help Center for the full set of options. Spending ten minutes here is worth it. The portal should look like part of your app, not a generic third party widget.

Configure your ticket center settings

In the dashboard, open the Ticket Center page. You will see two things you need:

  • Your Helpdesk ID, used in the embed snippet
  • A button to Generate HMAC Secret

Click generate, copy the secret immediately and store it in your Shopify app's environment as HELPDESKY_HMAC_SECRET. Helpdesky never shows this secret again. The full setup is covered in the Ticket Center Setup Guide.

Embed the ticket center in your Shopify app

The embed itself is a small script plus a signed identity blob. From your server, sign the user's email with HMAC SHA256 using your secret, then pass the signature to the embed on the page.

For embedded admin apps, render the embed on a route like /app/support inside your Remix or Node app. For customer account UI extensions, render it inside a SupportPage block. The mechanics for both surfaces, including the exact HTML and the verification tool, are covered in the Add a Ticket Center to Your Shopify App reference.

The key thing to get right at this stage: never sign the email on the client. The HMAC must be computed server side, every request, with the secret kept on the server.

Set up email forwarding

Most support replies still happen over email. Each Helpdesky helpdesk gets a unique inbound address like yourslug-123456@inbox.helpdesky.io. In your Shopify app's existing support inbox (Gmail, Google Workspace, Postmark, SendGrid, whatever), set up forwarding so anything sent to your support@yourapp.com lands in Helpdesky as a threaded conversation. Step by step in Email Forwarding Setup.

This way, an email reply, a ticket reply in the portal and a widget message all show up in the same inbox for your team.

Optionally add the widget alongside the ticket center

If your app has surfaces where a quick question is more natural than opening a portal (the Shopify Admin app home, an onboarding step, a settings page), drop the Helpdesky widget on those pages. The widget includes article search, AI answers from your help center, quick questions and a messaging tab. The ticket center then becomes the place for "show me my history" while the widget handles "answer me right now". See Customising Your Widget for theming.

Test the full flow before shipping

Before you submit the app update, walk through the complete loop:

  • Open the Shopify Admin (or customer account) as a test user, hit the support route and confirm the portal loads with the right identity
  • File a new ticket from the portal, confirm it appears in the Helpdesky dashboard
  • Reply from the dashboard, confirm the user sees the reply in the portal and gets the email notification
  • Send an email to your forwarding address, confirm it threads correctly into the same conversation

If anything looks off, the dashboard's verification tool will tell you whether the HMAC matches what Helpdesky expects.

Helpdesky vs Crisp ticket center plugin

A quick, honest comparison since this is a common question.

Price

Crisp's ticket center sits on the Plus plan at $295 a month per workspace. The lower tiers (Mini at $45, Essentials at $95) do not include the dedicated ticketing portal. See Crisp pricing. Helpdesky's ticket center is included on every plan, starting at $0 on free and $9 a month on Pro. For a small Shopify app team, that is a meaningful difference.

Built in vs plugin

Crisp's ticket center is part of its plugin and add on model. You compose features by enabling the right plugins on the right plan. Helpdesky bundles the help center, the widget, the contact form, the ticket center, AI search, the email channel and the API into the base product. Nothing to install, nothing to enable.

For a Shopify app specifically

Both products will let you embed a ticketing portal into a Shopify app surface with HMAC signed identity. The Helpdesky path costs about thirty times less per month and removes the "is this on the right plan" question entirely.

Ship it

Once your portal is live, your merchants and their shoppers can file and track tickets without leaving Shopify, your team works out of one inbox, and your support pages match your brand. Create your Helpdesky and follow the steps above.

Last updated on May 12, 2026