Prerequisite: You should have connected Stripe before starting. More info here

We have created personalized guides to integrate with the following apps: React/Nextjs, Framer, Webflow, Wordpress, Gumroad.

Ensure you have an experiment In Progress or else the following guide won’t function.

​
Step One: Copy Embeded Code

Insert our script tag in your website’s head tag.

The script needs to be added on your landing page, app, or any other page where you want to use 1Price. This script will add a global variable called $1Price to your window object which will categorize new users.

Replace value of YOUR_WORKSPACE_ID with your unique data_1p found on connect

​
Step Two: Dynamic Price Number

To have adaptive pricing, change the price value to correspond with the 1Price Experiment. This value will be used during pricing tables within the app and landing page.

For comprehensive tests, check out our interactive playground.

POST
fetch("https://widget.1price.co/api/v1/price_value", {
  method: "POST",
  body: JSON.stringify({
    offerId: $1Price.offer_id,
    workspaceId: $1Price.workspace_id,
    customerId: $1Price.customer_id,
    uniqueId: YOUR_UNIQUE_ID,
  }),
})
  .then((response) => response.json())
  .then((data) => {
    console.log("Products", data);
  })
  .catch((error) => {
    console.log(error);
  });

Replace value of YOUR_UNIQUE_ID with the value of your customer_id.

This endpoint returns a JSON object containing pricing details for your products, including monthly and yearly pricing options, and currency information. The response includes:

Success Status

Currency

Product Details

Use this data to dynamically populate your pricing table and ensure your visitors always see the most up-to-date pricing information.

offerId
string
required

The offer shown for experiments

workspaceId
string
required

The workspace of your account

customerId
string
required

The customer linked to the offer

​
Step Three: Track Purchases

To determine the success of a experiment, we track multiple data points on Results. Simply add a oneprice_cid to your Stripe Checkout Session

You’ll need to send the 1Price generated priceId to your backend server when creating a Stripe subscription.

Example Stripe Checkout Session
const session = await stripe.checkout.sessions.create({
  success_url: "https://example.com/success",
  cancel_url: "https://example.com/cancel",
  metadata: { oneprice_cid: YOUR_1PRICE_CID },
  line_items: [{ price: YOUR_PRICE_ID, quantity: 1 }],
  mode: "subscription",
});

Replace value of YOUR_1PRICE_CID with the value of your $1Price.customer_id and the value of YOUR_PRICE_ID with the dynamic price_id (from your response request).

Example above is with Javascript, but it is the same with every language. You just need to send the oneprice_cid from client side to your backend server either with params, query, or body and then send it to Stripe with metadata when a stripe checkout session.

Also note, we can only track Checkout Sessions at the moment. Subscription Creations is in beta. Message us for access

If the Stripe API is called on the client side, you will need to use the 1Price Global variation from either $1Price or window.$1Price

​
🧪 ​ Test Integration:

  1. Start an experiment on 1Price
  2. Make a test purchase on your website/app
  3. Ensure transaction was tracked on dashboard

BONUS: You can create a 100% off coupon on Stripe and use that code to make the test purchase, so you do not get charged.

​
Need Additional Help?

You can always contact us via live chat or email and we can set up a price experiment together!

Build: ExperimentDetermine: Results