We can’t wait to hear from you.

Fremantle Chamber Of Commerce Logo

WordPress Moshtix Integration – Documentation

Purchasing the plugin

Purchase WordPress Moshtix through our secure checkout. The checkout is handled by Freemius, our payments partner, so your card details are processed through a secure payment gateway.

Once your payment is complete, you’ll receive an email containing a download link for the plugin and your license key. Keep this email handy, you’ll need the license key when you activate the plugin.

Installing the plugin

  1. Download the plugin zip file from the link in your purchase email.
  2. In your WordPress dashboard, go to Plugins > Add New Plugin.
  3. Click Upload Plugin and select the zip file you downloaded.
  4. Click Install Now, then Activate Plugin.
  5. When prompted, enter the license key from your purchase email to activate your subscription.

Once activated, a new Moshtix menu will appear in your WordPress dashboard. This is where you’ll connect your Moshtix account and configure how your events display.

Credentials

The Credentials tab connects the plugin to your Moshtix account so it can pull your events through the Moshtix API.

  1. Log in to your Moshtix account.
  2. Find your Client ID at the top left of your Moshtix dashboard. (See below)
  3. Generate a Moshtix API key by following Moshtix’s guide: How to Generate a Moshtix API Key.
  4. Enter your Client ID and API Key into the Credentials tab, then save.
Moshtix Dashboard Client Id
Moshtix Dashboard Client Id

Display

The Display tab controls how your Moshtix events appear on your site: their fallback image, button wording, and the availability badge shown on each event.

FieldDescription
Placeholder ImageThe fallback image for events that have no image of their own. If none is chosen, the plugin’s built-in placeholder is used. For best results use an image 600x600px.
Button TextThe wording on each event’s button, which links through to Moshtix to buy tickets.
Before Tickets Go On Sale TextShown on an event’s availability badge before its tickets go on sale.
Ticket Sales Closed TextShown on an event’s availability badge once all its ticket sales have ended.

On-sale ticket availability badges

While tickets are on sale, the badge on each event shows allows you to inform your customers how fast tickets are selling. The Remaining Tickets % column allows you to assign thresholds, under which the badges will display. For example, if 100% of tickets are still available, its matching label will be displayed. Once sales get to 50% or less the next threshold will be reached and the next label will be displayed.

The plugin comes preloaded with five thresholds:

LabelRemaining tickets %
Tickets available now100%
Tickets are selling fast50%
Few tickets left10%
Almost sold out3%
Sold Out0%

Custom CSS

Add your own CSS to fine-tune how Moshtix events look on your site. This CSS loads on every page, so target the plugin’s classes rather than broad selectors (see the plugin selectors).

The plugin ships with default CSS to style your event cards. If you clear this field, no CSS is applied and events will display unstyled. This design ambiguous approach gives you complete control, without competing against any built in styling. If you make a mess of your CSS, click Reset to Default to restore it.

Target these classes when writing your own CSS:

  • .wpmx-events-list
  • .wpmx-event-image
  • .wpmx-event-title
  • .wpmx-event-dates
  • .wpmx-event-teaser
  • .wpmx-event-sale-threshold
  • .wpmx-event-button

:root {
--wpmx-font-size: 16px;
--wpmx-grid-col-width: 24em;
}
.wpmx-events-list.wpmx-shortcode {
font-size: var(--wpmx-font-size);
--grid-cols: repeat(auto-fill, minmax(min(var(--wpmx-grid-col-width), 100%), 1fr));
--grid-gap: 1em;
list-style: none;
padding-inline-start: unset;
display: grid;
grid-template-columns: var(--grid-cols);
gap: var(--grid-gap);
}
.wpmx-events-list li {
position: relative;
}
.wpmx-event {
border: 1px solid oklch(87.2% 0.01 258.338);
position: relative;
border-radius: 0.5em;
overflow: hidden;
transition: box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);
}
.wpmx-event:has(:hover, :focus-visible) {
box-shadow:
0 10px 15px -3px rgb(0 0 0 / 0.1),
0 4px 6px -4px rgb(0 0 0 / 0.1);
}
.wpmx-event:has(:hover, :focus-visible) img {
transform: scale(1.05);
}
.wpmx-event-image {
display: flex;
margin-bottom: unset;
overflow: hidden;
}
.wpmx-event-image img {
width: 100%;
height: 100%;
transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
}
.wpmx-event-content-container {
--padding: 1.5em;
display: flex;
flex-direction: column;
padding: var(--padding);
}
.wpmx-event-content-container * {
margin: unset;
}
.wpmx-event-title {
font-size: 1.125em;
line-height: calc(1.75 / 1.125);
color: oklch(21% 0.034 264.665);
}
.wpmx-event-time {
margin-top: 0.5em;
font-size: 0.875em;
line-height: calc(1.25 / 0.875);
color: oklch(44.6% 0.03 256.802);
}
.wpmx-event-teaser {
margin-top: 1em;
font-size: 1em;
line-height: calc(1.5 / 1);
color: oklch(44.6% 0.03 256.802);
}
.wpmx-event-teaser:empty {
display: none;
}
.wpmx-event-button-container {
margin-top: 1.5em;
}
.wpmx-event-button a {
font-size: 0.875em;
line-height: calc(1.25 / 0.875);
padding-inline: 0.75em;
padding-block: 0.5em;
color: #fff;
border-radius: 3.4e38px;
background-color: oklch(21% 0.034 264.665);
text-decoration: none;
}
.wpmx-event-button a::after {
content: "";
position: absolute;
inset: 0;
}
.wpmx-event-sale-threshold {
--background-color: oklch(96.7% 0.003 264.542);
--text-color: oklch(44.6% 0.03 256.802);
position: absolute;
top: var(--padding);
left: var(--padding);
border-radius: 0.375em;
padding-inline: 0.5em;
padding-block: 0.25em;
font-size: 0.75em;
line-height: calc(1 / 0.75);
font-weight: 500;
background-color: var(--background-color);
color: var(--text-color);
}
.wpmx-event-sale-threshold:empty {
display: none;
}
.wpmx-event-sale-threshold.open.tickets-available-now,
.wpmx-event-sale-threshold.open.tickets-are-selling-fast {
--text-color: oklch(52.7% 0.154 150.069);
--background-color: oklch(96.2% 0.044 156.743);
}
.wpmx-event-sale-threshold.open.few-tickets-left,
.wpmx-event-sale-threshold.open.almost-sold-out {
--text-color: oklch(55.5% 0.163 48.998);
--background-color: oklch(96.2% 0.059 95.617);
}
.wpmx-event-sale-threshold.open.sold-out {
--text-color: oklch(50.5% 0.213 27.518);
--background-color: oklch(93.6% 0.032 17.717);
}

Root variables

The default CSS uses two root variables that control the overall look of your event cards:

VariableDefaultControls
–wpmx-font-size16pxThe root size of the card. All font sizes, spacing, and the View Event button scale proportionately based on this value.
–wpmx-grid-col-width24emThe width of the cards. The CSS grid automatically determines how many cards to show on any screen size based on this value.

Advanced

FieldDescription
Webhook SecretA private passcode used to verify that webhook requests genuinely come from Moshtix. Leave it as the automatically generated value unless you need to set a specific one.
Remove Data Upon UninstallIf checked, deleting the plugin also erases all of its data, including your settings, synced events, and ticket counts. Leave unchecked to keep that data in case you reinstall. Deactivating the plugin never deletes anything, only a full delete does.

Syncing Your Events

The Sync page keeps your site’s events in step with Moshtix. Run a manual sync to import or refresh everything now, then subscribe to webhooks so Moshtix keeps your site up to date automatically.

Tools

Sync posts fetches all your events from Moshtix and creates or updates the matching posts on your site. Run it for your first import, or any time you want to force a full refresh.

Webhooks

Once subscribed, webhooks let Moshtix notify your site the moment something changes, so your events stay current without a manual sync.

  • Event Saved: adds new events and updates event details whenever they change in Moshtix.
  • Order Saved: updates an event’s ticket availability as tickets sell.

A status table shows whether each webhook is subscribed, when it was last updated, and gives you the option to unsubscribe.

Events

The plugin creates your events as a custom post type in WordPress, pulled directly from Moshtix. You’ll find them listed under the Moshtix menu in your dashboard.

Event fields aren’t editable in WordPress. Moshtix is the source of truth, so make any changes to your events in Moshtix and they’ll sync through to your site.

Logs

The Logs page records the plugin’s activity, such as webhook events received from Moshtix, sync actions, and any errors. Use it to check that syncing is working correctly or to troubleshoot an issue.

Each entry shows the type of event, the time it occurred, a status code, and a message describing what happened.

Account & subscription

The Account page manages your WordPress Moshtix subscription. It’s provided by Freemius, our payments partner, and is split into three sections.

Account Details

Shows your account name, email, plan, and license key, along with your current plugin version and whether an update is available. From here you can also:

Billing

Store your business name, tax or VAT ID, and address for invoicing purposes.

  • Deactivate your license on this site, to move it to another site
  • Change your license key
  • Sync your license with Freemius
  • Cancel your subscription

Payments

A history of your past payments, each with a downloadable invoice.

Contact Support

Need a hand? Use the Contact page in your WordPress dashboard to send a support request directly to our team.