Skip to main content

Iframe Customization

Custom CSS

Capstone provides the option to provide a custom CSS file so that you can match your site's style.

To do so, follow steps below:

Host Your CSS File
Host your CSS file, available publicly.
Request a One-time-use Token
Send a POST request to the E-commerce One-time-use Token. Include the URL of your CSS file as a UI Option in the body of your request. See the example below.

{{ var bodyParams = { uiOptions: { css: 'https://tester.Capstonesandbox.com/static/ecom-example1.css' } }; }}

Example Request

curl -X POST https://api.Capstonesandbox.com/pay/v3/token \
  -H 'Content-Type: application/json' \
  -H 'Accept: application/json' \
  -H 'Authorization: Basic <Your Basic Auth>'
  -d '{
  "uiOptions": {
    "css": "https://tester.Capstonesandbox.com/static/ecom-example1.css"
  }
}'

Example 200 Response

{
  "expiration": "2018-09-18T15:43:05.664Z",
  "fraudUrl": "https://api.Capstonesandbox.com/pay/v3/fingerprint?token=01080f80-76b8-4363-845d-67e8623bf170",
  "token": "830d36f6-a5e3-4455-9600-3a55b63e2fc2"
}

Load the Iframe
You may wish to customize a:
For example, the following request will return the HTML for a checkout page, with the style from the CSS file you specified in step 2.

Example Request

curl -X GET https://api.Capstonesandbox.com/pay/v3?token=830d36f6-a5e3-4455-9600-3a55b63e2fc2 \
  -H 'Accept: application/json' \
  -H 'One-time-use Token: API_KEY'

Custom CSS