Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Tebex offers many different ways to integrate with your existing infrastructure.
The SDKs below include support for Headless API, Checkout API, and Webhooks, complete with examples, making implementation of these APIs into your project as easy as possible.
Tebex APIs are documented using OpenAPI. These are used to generate our Endpoints documentation. Our schemas are available at the GitHub repositories below. The OpenAPI Generator can be used to generate an SDK in the language of your choice if we do not have your language available.
Below are additional resources and projects that can help you implement Tebex into your project. If you've developed an SDK, please reach out to us at tebex-integrations@overwolf.com.
PHP
Composer / Packagist
NodeJS
NPM
Headless API
Checkout API
Nuxt.js
Official
Typescript
Third Party
PHP
Third Party
The best way to understand the functionality of the Tebex templating engine is to create a copy of our default template, named Exo.
You can do this by navigating to Webstore -> Appearance in your control panel and creating a custom template based on Exo.
For a live demonstration of Exo in action, visit example.tebex.io.
Learn how to integrate Tebex and leave the complexities of monetization to us.
Welcome to the Tebex developer documentation. If you're new, start with our quick start guide or explore one of our products below. If you need assistance during the integration process, donโt hesitate to reach out - weโre here to help.
Customise your store to match your games brand using our Webstore Builder.
The Webstore Builder enables you to fully customise the design of your store using templates & themes, providing your customers with a seamless transition from your existing website when they're making a purchase.
If you haven't already done so, we recommend having a read of our quick start guide before continuing.
With the webstore builder, you can:
Use templates to change the HTML structure of each page and implement conditional logic via the TWIG templating engine.
Upload custom CSS, Javascript and images via Assets.
If you're a template designer, you can offer your customers the ability to customise their templates via Config Schema, and you're also eligible for free Plus via our Developer Plan.
Browse examples of other Tebex stores for some inspiration.
If you're a designer who creates templates for others, either for free or to sell, let us know! We'll add you to the certified Tebex designers club. You'll gain access to insider help guides, a private community of other designers, feedback sessions with the Tebex product team, and also BETA features that are not yet available to others.
If there are any functions, tags, filters or variables that you need to use in your template, but they're not available or documented, please let us know.
To create your first template, head over to the Appearance section within your creator panel.
Discover the power of the Twig templating engine used by Tebex.
Templates on the Tebex platform are written in the Twig Templating Engine. Twig allows you to customise your store with control structures, similar to any other language, while maintaining a sandboxed and safe environment for the Tebex infrastructure.
You're able to learn more information about the syntax of Twig by viewing the official documentation.
A common Twig file may look like the following:
If you're interested in becoming a pro at the Twig syntax, you can complete the official Twig certification programme.
Accessing global variables to help populate your template with live data.
Global variables are variables which are available across all pages of your store.
If you'd like access to a variable that is not currently available, please let us know.
Get started integrating Tebex into your website or game
Welcome to your journey of launching your first project with Tebex! This guide will walk you through the essential steps to create, set up, and launch your store, ensuring a seamless experience for your customers. From building your first project in the creator panel to implementing automatic product delivery, we'll cover everything you need to know to get started.
Head over to the creator panel and kick things off by creating your first project.
Check out the docs for the integration method youโre going with. If needed, build the APIs into your website or game.
If your integration method requires it, create the packages your customers can buy.
Make sure your customers get their packages right away after theyโve made a purchase. For game studios, webhooks or license keys (like Steam keys) are the way to go. If youโre monetizing a game server, donโt forget to check out our official plugins for that.
Once youโre approved, youโre all set to go live and start making money from your game! Plus, with us as your Merchant of Record, youโll get access to worldwide payment methods, tax handling, and fraud protection. Nice!
Learn which integration method is best for you
Tebex offers multiple integration options tailored to meet different business needs, each equipped with unique features for specific use cases.
There are three integration methods available, as highlighted below. Each method varies in complexity, with the Webstore Builder being the easiest to get started with.
Checkout: Maximize revenue by utilizing Tebexโs global Merchant of Record platform. With over 100 payment methods, Tebex handles the entire checkout process, offering chargeback protection, fraud monitoring, 14-day payouts, and international sales tax coverage.
Package Management: Effortlessly set up and manage packages for sale on your project through the creator panel. You can organize packages into categories and easily define details such as names, descriptions, pricing, and images. You're also able to invite other team members to manage these too.
Hosted Webstore: Tebex provides a customizable webstore that allows you to start selling in minutes. This enables you to focus on your business, while we handle the hosting infrastructure & technical requirements for you.
Take a look at the example scenarios below to get a better understanding of which integration method is best for you. Whatever you choose, all of our integration methods come with access to over 100 payment methods, international sales tax coverage, fraud protection, webhooks, and seamless inline checkout through Tebex.js.
Now that you've chosen your integration method, you can begin by exploring the relevant documentation:
Learn how to design your own store using the Webstore Builder.
Sell packages directly from your website or in-game with the Headless API.
For more complex integrations, get started with the Checkout API.
Webstore Builder Easiest
Headless API Complex
Checkout API Advanced
If you'd like access to a TWIG tag that is not available below,
if
for
block
extends
include
set
The global store object contains all information associated with the project itself, such as store name.
name
string
The name of the project.
currency
string
The base currency of the project.
css
string
The custom theme currently active on the project.
logo
string
The full url of the custom logo of the project.
favicon
string
The full url of the custom favicon of the project.
noLogin
Boolean
If the project requires no login (e.g. if no username system is being used).
categories
array[category]
An array of package categories of the project.
If you'd like access to a variable that is not currently available, please let us know.
View the available functions within your Twig template.
Functions generate content for you to use within your templates.
If you'd like access to a TWIG function that is not available below, please let us know.
__
_p
config
asset
path
query
range
__
Returns the equivalent translation from within your translations settings.
_p
Returns the plural translation from within your translation settings.
config
Returns a config value from your template config schema.
asset
Returns the full url path of an asset from within your template.
path
Returns the full url path of the current page.
query
Returns a GET parameter from the current url.
The global page object contains variables associated with the current http request.
title
string
The title of the current page.
message.type
string
The type of toast notification to display to the customer.
message.text
string
The contents of a toast notificaton to display to the customer
message.display
boolean
If a toast notification needs to be shown to the customer (eg. a validation error has occured).
If you'd like access to a variable that is not currently available, please let us know.
The entry point for each page on your store.
Pages represent different landing points of your customers on your Tebex store. For example, when customers visit a category on your store, the category.html page will be rendered. For this reason, pages must be implemented in your templates and cannot be deleted (unlike Assets).
If you'd like access to a variable that is not currently available, please let us know.
The only pages that are not accessible to the public are the following:
layout.html
This is the global layout of your store that all pages extend from. You are able to create multiple layouts if you wish via creating an .
module.*
These pages are used to build the Sidebar modules of your store, and you can view more information within the section.
The index.html page is the homepage of your store.
description
string
The homepage content of the store.
If you'd like access to a variable that is not currently available, please let us know.
The username.html page is responsible for allowing your customers login to your store.
external
Boolean
provider
String
The name of the login provider, such as FiveM, Discord or Steam.
url
String
The URL that the customer should be directed to so they can perform their login with the external provider.
If the external variable is true
, let the user click a link to proceed to login via the external login provider:
If the external variable is false
, provide a form submitting to the current url, including an ign
form parameter. The ign
parameter should be a text field allowing the customer to enter their username freehand.
An example can be seen below:
An example of a flow supporting both external and non-external login providers is shown below:
If you'd like access to a variable that is not currently available, please let us know.
If the login provider of the store requires the user to be sent to an external url which is available in the url
variable. See for what to do in the event external is false
.
The global basket object contains all information relevant to the customers basket, such as price & packages.
If you'd like access to a variable that is not currently available, please let us know.
id
string
Internal ID of the basket.
ident
string
The identifier that can be passed to
ign
string
The username of the customer.
uuid
string
The UUID of the customer.
currency
string
The 3 digit currency code of the basket.
price
string
The current price of the basket.
packages
array[package]
An array of packages in the customers basket.
coupons
array[coupon]
An array of coupons in the customers basket.
The options.html page is shown to the customer when adding a package that requires customisation, such as when you are using variables.
options.package
An object containing information about the current package.
options.variables
name
string
The name of the package.
chooseServer
boolean
customPrice
boolean
If the package requires the customer to enter how much they want to pay for the package.
category
string
The category ID of the package.
price
string
The price of the package.
description
string
A summary of the description of the variable.
type
string
Either dropdown
, discord_id
, or show an input field for freehand input by the customer.
id
string
The ID of the variable.
options
If the type is dropdown
, we include an array of options the customer should select from.
value
string
The current value of the variable.
discord_tag
string
If the variable is type is discord_id
and the value
is not empty, this will include their discord tag once they have logged in.
default
boolean
If this variable option should be selected by default.
name
string
The name of the dropdown option.
price
string
The additional price the customer would pay by selecting this variable option.
If you'd like access to a variable that is not currently available, please let us know.
array[]
An array containing the the customer needs to select.
If the package requires the customer to select a .
array[]
The community goal module displays the current progress of a community goal which you have configured within your creator panel on the community goals section.
module.header
string
The header of the module.
module.communitygoal.image
string
The URL of the image of the community goal hosted on our public CDN.
module.communitygoal.repeatable
boolean
If the community goal is repeatable.
module.communitygoal.times_achieved
string
The number of times the community goal has been reached.
module.communitygoal.description
string
The description of the community goal.
module.bar.style
string
The style of the goal, either striped or animated.
module.displayAmount
boolean
If the amount of the community goal should be displayed on your store.
module.total
string
The total the community goal has currently earned.
module.target
string
The target amount of the community goal.
module.percentage
string
The percentage equivalent of the current total against the target.
If you'd like access to a variable that is not currently available, please let us know.
There is no specific variables for checkout.html. All checkout functionality is handled via opening a new Tebex.js session. To start a new Checkout session, you should do the following:
GET
/checkout/ident
This endpoint will return an ident for the current basket, which is required by Tebex.js when launching a checkout modal.
Response
To learn how to add Tebex.js to your store, please view the associated documentation or view the demo over at https://js.tebex.io.
If you'd like access to a variable that is not currently available,
module.header
string
The header of the module.
module.package
The package to feature.
Dynamic modules to display useful information on your store.
Modules allow you to add dynamic modules on your store, which you can configure from within your creator panel on the sidebar section.
Each modules HTML is configurable in their associated module.*.html
page (documented onwards).
You can display the modules on your store by printing the modules variable, as seen below:
Please ensure to use the raw
filter, as the modules
variable contains HTML that will be escaped automatically by TWIG if this filter is not used.
Modify variable values with Twig filters.
Filters enable you to modify the content of variables within your template.
If you'd like access to a TWIG filter that is not available below, please let us know.
escape
length
raw
money
slice
number_format
date
nl2br
replace
split
upper
lower
money
The money filter transforms a variable into a monetary format.
The cms/page.html page displays any custom pages that you have created on your store.
id
string
The ID of the page.
category
string
The category of the page.
title
string
The title of the page.
metaData.content
string
The actual content of the page.
If you'd like access to a variable that is not currently available, please let us know.
The category.html page lists the that are available to purchase in the current category being viewed on your store.
If you'd like access to a variable that is not currently available,
The package.html page displays details about a specific on your store.
If you'd like access to a variable that is not currently available,
If you'd like access to a variable that is not currently available,
id
string
The ID of the category.
name
string
The name of the category.
displayType
string
The display type (either grid or list)
description
string
The description of the category.
packages
array
An array of Package Objects.
slug
string
The url slug of the category.
id
string
The ID of the package.
identifier
string
The slug of the package. Defaults to the numeric ID if no slug is defined.
name
string
The name of the package.
description
string
The description of the package.
customPrice
boolean
If the package can have a custom price.
price
string
The price of the package.
purchasable
boolean
If the currently logged in customer is allowed to purchase this package on your store.
quantity
integer
The quantity of this package in the customers basket.
image.url
string
The public url of the packages image hosted on the Tebex CDN.
image.uploaded
boolean
If this package has an image uploaded.
category
string
The ID of the category which this package belongs to.
has_options
boolean
If this package requires options to be entered/selected before adding to the basket.
discount.applied
boolean
If the package has a discount applied.
discount.original
string
The original price of the package before the discount was applied.
discount.percentage
string
The percentage equivalent of the discount applied to the package.
module.header
string
The header of the module.
module.bar.style
string
The style of the module.
module.bar.animated
string
If the goal bar should be animated.
module.displayAmount
boolean
If to display the amount instead of just a percentage.
module.total
string
The total amount earned so far towards the goal.
module.target
string
The target of the goal.
module.percentage
string
The percentage towards completion of the goal.
The server status module allows creators who operate Game Servers to display the status of their game server (e.g. player count or online status) on their store.
module.header
string
The header of the module.
module.online
boolean
If the game server is online.
module.ip
string
The IP address of the game server.
module.port
string
The port of the game server.
module.players.online
string
The total players on the game server.
module.players.max
string
The maximum players that can be online at one point on the game server.
If you'd like access to a variable that is not currently available, please let us know.
The gift card balance module lets your customers enter a gift card and determine the amount of value that remains on the specified gift card.
module.header
string
The header of the module.
search
boolean
If the customer has attempted to search for a giftcard.
giftcard
object
If a giftcard was found from their search, it will be populated in this object.
giftcard.card_number
string
The gift card number the customer has searched for.
giftcard.void
boolean
If the giftcard that has been searched for has been voided by the store owner.
giftcard.remaining_balance
string
The remaining balance of the giftcard which has been searched for.
If you'd like access to a variable that is not currently available, please let us know.
Please ensure to use the raw
on the module.text
variable as it contains HTML and will be automatically escaped by TWIG if not used.
If you'd like access to a variable that is not currently available,
module.header
string
The header of the module.
module.text
string
The content of the textbox module.
Package slugs allow you to customize your package's URL slug for better readability.
If you are using a custom template, you may need to update it to ensure the package slugs feature functions correctly on your webstore.
In your Twig templates, any instance of package.id
should be updated to package.identifier
. This property will use the packageโs slug if available and default to the numeric ID if not.
Let us support you develop custom templates for Tebex creators.
If you're a template developer, you're entitled to receive free Tebex Plus to enable you to freely develop templates for your clients. Stores that receive our developer plan won't be able to transact real payments on their store.
You're also eligible to gain access to the certified Tebex designers club. You'll get insider help guides, access to a private community of other elite designers, feedback sessions with the Tebex product team, and also BETA features that are not yet available to others.
If you'd like to apply to become a Tebex Certified Designer, please apply here.
The top donator module allows you to display the highest spending customer on your store.
module.header
string
The header of the module.
module.donor
boolean
If there is actually a top customer to show yet.
module.skin
string
The URL of the customers profile image to display.
module.ign
string
The username of the customer.
module.displayAmount
boolean
If to display the amount the customer has spent on your store.
module.total
string
The total amount the customer has spent on your store.
module.period
string
The period which calculates the above total. Can be either hourly, daily, weekly, monthly or yearly.
If you'd like access to a variable that is not currently available, please let us know.
Guides to help keep your custom template up-to-date.
In order to support certain features of Tebex, your custom template must be kept up-to-date. Please see the following guides:
Upon creating your store you may notice the footer at the bottom of your store stating that it is powered by Tebex and that we are the reseller & merchant of record.
Hiding the footer on your webstore will void our terms and conditions and will result in us having to disable your store from the public.
As a merchant of record platform we are under strict requirements by the card networks, such as Visa & Mastercard, to ensure customers understand which company they are purchasing from. You are authorising Tebex to operate a webstore on your behalf and sell content that we license from you, thus we need to let customers know about this as clearly as possible.
We don't place the footer for our own marketing/branding benefit - we simply have to do it to be able to provide you with all the benefits you receive as us being the Merchant Of Record, such as:
100 payment method integrations
Sales tax collection and remittance worldwide
Fraud protection & our chargeback guarantee
Easy to integrate product delivery for your game studio & server
The colour scheme of the footer by default matches your Tebex Checkout theme. You're able to select between Dark or Light mode by viewing your Checkout settings within the creator panel.
The footer also listens to the following CSS variables which you can define in your template/theme, providing you with further customisation ability:
An example of setting the CSS variables can be seen below, which you could place in your templates CSS file:
Tebex Headless API allows integration of your store directly into your own frontend or in-game.
The Headless API works with your existing packages, coupons, sales & creator codes.
You can query the Headless API to retrieve your packages/categories, build a basket for a user, and direct them to checkout - all from within your own frontend implementation (be that a website or in-game).
You can retrieve your store's listings in JSON format and display them however you wish:
In order to purchase items, a basket must be created for the customer. Create a basket and allow the customer to login with their username or other OAuth login mechanism (e.g Steam or FiveM).
You can add or remove packages programmatically to the created basket via the API as needed when the user interacts with your application.
Once all packages and quantities are selected, apply any relevant coupons, gift cards, or creator codes with these endpoints.
When the user is ready to checkout, fetch the basket and direct the user to the links.checkout
URL.
The following websites are built using the Headless API - hosted via our customers own infrastructure, using frontend frameworks such as Vue or React.
If you haven't already done so, we recommend having a read of our before beginning integration.
The Headless API can be used with for a fully embedded checkout experience without the user ever leaving your own website.
Below is the expected flow your application should follow when utilizing the Headless API. For a list of all endpoints, please see the page.
To get started with your own integration of the Headless API you're able to use our example integration built upon Nuxt.js, Vue & Typescript. Take a look at the GitHub repo to begin.
--tebex-legal-footer-background-color
--tebex-legal-footer-text-color
--tebex-legal-footer-border-color
--tebex-legal-footer-max-width
--tebex-legal-footer-logo-color
When adding packages, there may be certain Variables associated with them. These can be filled by providing a variable_data
object.
Packages that deliver a gift card to the user should include giftcard_to
mapped to the e-mail address that will receive the gift card:
Packages that deliver Discord actions should include the user's discord_id:
Packages that deliver game server commands should include the username_id
of the user, dependent on your store type.
You can get the username_id after creating the basket if you provide the player's username at the time of creation. See Creating a Basket for specific details on Game Servers.
You can also provide custom data when adding packages which can be referenced by the seller as part of the transaction.
If a package with a Game Server Command has the configuration option:
Allow customers to select the game server they want to receive this package on.
You can specify the target game server in the request by including server_id
in your package's variable_data
:
A list of your server_ids
can be found in your Tebex Control Panel by clicking Edit beside your relevant game server. The server ID is the number at the end of the URL when editing the game server.
Upload custom CSS, Javascript, Images or Twig files to your store for public access.
Assets allow you to upload your own CSS, Javascript, Images or Twig files to your template, which you can later reference in your files.
To create an asset, first upload it from within the template editor. Once you have uploaded the asset, you can retrieve the public URL of the asset by using theasset()
function. This function will return the full URL of the asset hosted on our global CDN.
For example, you could upload scripts.js
as an asset, and then include it in your template:
You're also able to create TWIG files that you can later reference in your template. For example, you could create an asset called navigation.twig
, and then include it using the Twig include tag:
This allows you to create code that is easily reusable across multiple locations in your template.
The payments module allows you to display a selection of recent payments received from customers on your store.
ign
string
The username of the customer.
name
string
The name of the package the customer has purchased.
time
string
The time the purchase was received on the store.
price
string
The amount of the purchase.
currency
string
The currency of the purchase.
If you'd like access to a variable that is not currently available, please let us know.
Depending on the type of Tebex store you are integrating, additional parameters may be necessary before the basket can be successfully created.
For most stores, the user must authorize their account before checkout is completed. This is done via the /auth endpoint where we will return the authentication options available for your store.
Provide a returnUrl
, and after successful authentication the user will be directed back to your site.
You must provide the username
parameter as part of the basket creation request so that the basket is attributed to the correct user:
If you are creating a basket on your backend server, you will need to provide us the ip_address
of the customer.
Currently we are unable to support IPv6 addresses being provided in the ip_address
property. While we work on enabling IPv6 support, please provide an IPv4 address for the customer.
If you are creating a basket from the user's browser, we will automatically determine the IP from the requesting device.
The Basket
which is returned will include the username_id
which may be required for certain endpoints.
You should save the username_id as part of the user's session for use later.
No-code customisation for your template directly from within the creator panel.
A template schema allows other team members or consumers of your template to change its appearance, for example providing colour pickers to change the colours of your template without the need to edit the CSS or HTML manually. This is especially useful if you are a template designer and you're selling access to your custom template for many different stores to use.
To edit the schema of a template, first open the template editor and select the Change Schema page from the navigation on the left. Any config options you add within the schema will appear within the Appearance section of the creator panel when you click edit on the template.
You're able to implement several different types of config options within your template schema, from colour pickers to text boxes.
You can allow players to gift packages to other players. Include target_username_id
, or target_username
when adding the package to the basket and the package will be delivered to that player rather than the buyer.
The target_username_id should be a unique identifier for the player instead of their name (such as a Minecraft UUID or Steam ID):
Bedrock and Geyser stores must provide target_username instead of the UUID due to differences in player IDs between Minecraft: Java Edition and Minecraft: Bedrock Edition.
If offered by your store, you can apply coupons, gift cards, and creator codes via Headless API once a basket has been created and the user's desired packages have been added.
Depending on the store's configuration, multiple gift cards or coupons may be applied. To remove a gift card or coupon, use the relevant /remove endpoint.
module.header
string
The header of the module.
module.payments
array[]
An array of payments.
module.displayPackage
boolean
If to display the package names against each payment.
module.displayPrice
boolean
If to display the price of each payment.
No username
is required, but depending on your package Deliverables you may need to provide variable_data
so that the package is attributed to the correct user. See .
A great example of Schema in action would be to look at the configuration options available with our default template, Exo, which you can view in the .
To dynamically access the config option from within your template you can use the
Twig function. This will output the entered option value, allowing you to use it however you wish within your template, such as outputting a text area into a specific location or altering CSS via a colour picker.
All errors returned by the Tebex Checkout APIs follow the RFC 7807 standard (https://datatracker.ietf.org/doc/html/rfc7807#section-3.1).
We also use standardised HTTP response codes to describe each error:
400 Bad Request - User data validation error
401 / 403 - Authentication / Authorization (depending on if it's pre- or post- authentication
404 - Requested resource doesn't exist
5xx - Server side transitory errors.
When you are ready to redirect the customer to checkout, there are two ways of beginning the checkout experience:
If you'd like the customer to remain on your website to complete their purchase, you're able to integrate Tebex.js, which is our embeddable checkout experience.
Head over to the Tebex.js documentation to get started.
You may also redirect the customer to an external checkout window using the following URL:
https://pay.tebex.io/{ident}
This is the same as the links.checkout
value in a Basket API response. Where {ident}
is the ident value returned when creating the basket.
When a customer starts their payment (is redirected to PayPal, provides their card details etc), a copy of the basket at that point in time is converted to a pending payment.
Any changes made to the basket after this point will not be reflected unless the checkout process is re-started.
Your server can receive Webhooks from Tebex after events occur on our platform (successful payment, refunds, etc.)
Please see our Webhooks Overview for a guide on working with Webhooks.
Any webhooks sent to the server will contain the details of the actual items purchased (the basket at the point of payment).
If your app manages its own basket, it is important to verify that webhook contents always match the items and amount you are expecting.
Develop advanced custom checkout experiences.
The Checkout API is designed to allow creators to use Tebex's Merchant of Record platform without the need to use a Tebex-powered webstore.
If you haven't already done so, we recommend having a read of our quick start guide before beginning integration.
This means creators can create baskets with custom products (as opposed to pre-created products on our webstore platform), and send customers directly to the checkout flow to proceed with payment.
The Checkout API can be used with Tebex.js for a fully embedded checkout experience without the user ever leaving your own website.
Using the Checkout API requires prior approval from our compliance teams. Please note that the Checkout API is not available to some UGC creators, such as those on FiveM or RedM.
Basket
To start a transaction, a basket must be created. The basket, similar to a standard eCommerce basket will contain the items that the customer is purchasing
Ident
A string identifier representing the basket
Below is the expected flow your application should follow when implementing the Checkout API. This should be considered a general guideline. For a full list of endpoints available, see the Endpoints page.
You have two options for implementing Checkout API. We include a Checkout request where all data about the customer and their desired packages can be provided in one request.
If your app has existing basket functionality, we recommend using a Checkout request. You can send the details of your customer, basket, and sale information all in one request:
If you do not have existing basket functionality in your app, you can use the Checkout API to fully manage the customer's basket on Tebex:
Create a basket for the customer.
Your app should save the ident
value for reference later, as this is the identifier for this customer's basket.
Add or remove packages from the customer's basket as desired.
Add any desired sales / discounts to the basket
Direct the user to the basket's links.checkout
URL in order to complete payment.
After payment is complete, you may verify payment if you wish by checking the links.payment
URL associated with the customer's basket.
Tebex Checkout supports recurring payments in addition to single, one-time payments. Below are the endpoints you can use for managing a customer's recurring payments.
Tebex Checkout is documented with OpenAPI. To view the schema and available SDKs, see our releases on GitHub.
An importable Postman collection can always be downloaded from Tebex Checkout's repository on GitHub.
The following websites are integrated using the Checkout API.
Beautiful checkout experiences directly within your own site.
Tebex.js is our solution to enable developers to integrate the checkout experience directly within your own website. Customers do not have to be redirected to an external website, improving conversions and providing a seamless checkout experience.
You can experience a live demo of Tebex.js by heading over to https://js.tebex.io or taking a look at the gallery below.
As a creator using Checkout API, you must authenticate directly with the API as opposed to individual customers authenticating.
We use HTTP BASIC for authorization, and all requests are made over HTTPS so that your credentials are protected.
Username (Project ID)
Password (Private Key)
Your store's Private Key should never be shared publicly. If your key is ever compromised, it can be reset in your Webstore panel.
All requests use application/json
as the Content-Type
. Ensure this is set with all requests to our Checkout API.
When the user is ready to checkout, you can fetch the current basket and direct the user to its links.checkout
URL. Here, the user will enter their payment information and complete checkout.
If you'd like the user to stay on your site during checkout, use Tebex.js alongside the Headless API.
For most stores, authorizing the user against the basket is required before checkout. You can do this by directing the user to the appropriate link provided by the /baskets/auth endpoint. Read more here.
Your Project ID (you can get this from )
Your Private Key (you can get this from )
Lunarclient
Events are fired by Tebex.js upon specific actions to alert your frontend and enable you to take action when required. These events should not be used to confirm actual receipt of payment - you should use Webhooks instead.
To add an event callback, use Tebex.checkout.on()
. The first argument to this function should be the name of the event to listen to, and the second argument should be a function to call when that function is fired:
Available events are as follows:
"open"
The checkout popup opening.
"close"
The checkout popup closing.
"payment:complete"
The customer has successfully completed their payment.
"payment:error"
The customer experienced an error, such as incorrect card details or insufficient funds, when making a payment.
All events that can be listened to with Tebex.checkout.on()
are exposed on the element as custom DOM events, which means you can use addEventListener to subscribe to them:
Receive real time notifications of payments, subscriptions, and much more.
Webhooks enable you to receive notifications upon certain webstore events, for example when a new payment is made. We will send a HTTP request containing a JSON object to any configured endpoints that are subscribing to the respective event. Webhooks are a great way to integrate Tebex with your own website, forum or internal database.
Go to Developers > Webhooks > Endpoints.
Click Add Endpoint.
Enter the URL of your webhook endpoint.
Select the types of webhooks that you'd like to subscribe to.
Click Add.
After adding your endpoint, you will receive a warning to inform you that we haven't been able to validate endpoint. Please see the section below for further information about handling validation webhooks.
Webhooks will not be sent to an endpoint unless it has been validated first. This is to ensure we are not sending HTTP requests to URLs that are not expecting our webhooks.
The validation webhook that we send will look similar to the example below. To identify a validation webhook you can check the type
property in the JSON body.
Upon receiving a validation webhook you must respond with a 200 OK response containing a JSON object that has an id
property representing the validation webhook's ID, please see the example response below.
Once your endpoint is setup to successfully handle validation webhooks, please visit Developers > Webhooks > Endpoints and click the Validate button next to the endpoint to re-send the validation webhook.
Webhooks from Tebex will only ever be sent from the two IP addresses listed below.
18.209.80.3 54.87.231.232
When building your webhook endpoint, we suggest that you check the IP address of the sender and throw a 404 Not Found error if the IP address isn't in the above list.
In addition to checking the IP address, we strongly advise that you verify the X-Signature header that we send with all requests.
The signature is generated by SHA256 hashing the JSON body and then building a SHA256 HMAC with the body hash as the data/content and your webhook secret as the key.
Your webhook secret is displayed on the Developers > Webhooks > Endpoints page. Please see our example code snippets below of how to generate the signature.