Placeholder Elements

Overview
Placeholder Elements are Splitit graphic assets without plan information, designed to be quickly integrated into your site. They are rendered via img, fieldset or Splitit specific tags.
Logos
The Splitit logo is available in black, white, purple and informative, and is set in an img with data-splitit-placeholder="logo" and data-splitit-color tags. You can adjust the height and width.
<img data-splitit-placeholder="logo" height="80" width="auto" data-splitit-color="white" />
​
​
Banners
Call a Splitit banner with an img that uses a data-splitit-placeholder="banner" tag, as well as a data-splitit-banner tag, in which you can specify options from the table below. Note that for each banner, either width or height should be set to one of the available dimensions.
<img data-splitit-placeholder="banner" data-splitit-banner="white:use-cc-pay-over-time" width="728" />
​
​
Strips
Strips show Splitit in a small, unobtrusive line across the top of your page. Add them with data-splitit-placeholder="strip"and data-splitit-strip-type tags as follows:
<div 
    data-splitit="true"
    data-splitit-strip-type="black"
    data-splitit-placeholder="strip"
    data-splitit-strip-offset="0"> 
</div>
Strip types are black, light, light-black-logo, and purple. The data-splitit-strip-offset tag can be used if you need to display Splitit alongside another merchant. 
​
​
Payment Option Images
Show the cards you accept by adding a fieldset with a data-splitit-placeholder="cards" tag and the desired comma-separated values for logos in a data-splitit-cards tag:
<fieldset data-splitit-placeholder="cards" data-splitit-cards="visa,mastercard,unionpay"></fieldset> 
Supported values are amex, dinersclub, discover, jcb, maestro, mastercard, unionpay, visa, and visaelectron (cards are rendered in the order they are listed). Note that the data-splitit-cards attribute is optional, and if it is omitted just Mastercard and Visa images will be shown. 
​
​
Placeholder Banner Classes
Name (data-splitit-banner)
Width
Height
color:shop-splitit-pay-your-terms
160
600
white:shop-splitit-pay-your-terms
160
600
color:shop-splitit-pay-your-terms
336
280
white:shop-splitit-pay-your-terms
336
280
color-img:shop-splitit-pay-your-terms
336
280
white-img:shop-splitit-pay-your-terms
336
280
color:shop-splitit-pay-your-terms
728
90
white:shop-splitit-pay-your-terms
728
90
color:use-cc-pay-over-time
160
600
white:use-cc-pay-over-time
160
600
color:use-cc-pay-over-time
336
280
white:use-cc-pay-over-time
336
280
color-img:use-cc-pay-over-time
336
280
white-img:use-cc-pay-over-time
336
280
color:use-cc-pay-over-time
728
90
white:use-cc-pay-over-time
728
90

Name (data-splitit-banner)	Width	Height
color:shop-splitit-pay-your-terms	160	600
white:shop-splitit-pay-your-terms	160	600
color:shop-splitit-pay-your-terms	336	280
white:shop-splitit-pay-your-terms	336	280
color-img:shop-splitit-pay-your-terms	336	280
white-img:shop-splitit-pay-your-terms	336	280
color:shop-splitit-pay-your-terms	728	90
white:shop-splitit-pay-your-terms	728	90
color:use-cc-pay-over-time	160	600
white:use-cc-pay-over-time	160	600
color:use-cc-pay-over-time	336	280
white:use-cc-pay-over-time	336	280
color-img:use-cc-pay-over-time	336	280
white-img:use-cc-pay-over-time	336	280
color:use-cc-pay-over-time	728	90
white:use-cc-pay-over-time	728	90

Last modified 6mo ago