Accepting a Credit Card Payment on your Website

Accepting a Credit Card Payment on your Website

Accepting a payment using a card is identical to tokenizing a card but will also take payment from the tokenized card. You can also include additional details within the call to take advantage of Level 2 processing.

Add Stax.js to your site

  1. Add the following script tag to the head of your HTML file.
  2. <script src="https://staxjs.staxpayments.com/staxjs-captcha.js"></script>

Initialize Stax.js

  1. First, you must know your Web Payments Token (public key) within Stax Pay by navigating to Apps > API Keys.
  2. Initialize your Stax.js instance with the StaxJs class using your website payments token, like in the examples below.

Note: Passing the number and CVV into the instance of staxjs generates the secure iFrame around these two fields, keeping sensitive card information from touching your servers.

var staxjs = new StaxJs( "your_website_payments_token" , {
  number: {
    id: 'card-number',     // the html id of the div you want to contain the credit card number field
    placeholder: '0000 0000 0000 0000',    // the placeholder the field should contain
    style: 'height: 30px; width: 100%; font-size: 15px;',    // the style to apply to the field
    type: 'text'    // the input type (optional)
    format: 'prettyFormat'    // the formatting of the CC number (prettyFormat || plainFormat || maskedFormat)
  },
  cvv: {
    id: 'card-cvv',    // the html id of the div you want to contain the cvv field
    placeholder: 'CVV',    // the placeholder the field should contain
    style: 'height: 30px; width: 100%; font-size: 15px;',    // the style to apply to the field
    type: 'text'    // the input type (optional)
  }
});