Open your product links in an overlay to let your customers complete their purchase directly on your site.


See bundled index.html and index.options.html file for examples.

Basic Setup

For a very simple installation where you only want the overlay functionality for any Selz item, the setup is very easy.


Include jQuery (if you haven't already) and jquery.selz.js (from dist) files, just before the closing </body> tag.

<script src=""></script>
<script src="dist/jquery.selz.js"></script>

Then in your document.ready block add the following:


You can pass extra options as outlined below.


Include jquery.selz.css (from dist) into the <head> of your page.

<link href="src/jquery.selz.min.css" rel="stylesheet">


Add the short link to your products into the <body> of your page. This can be found on the share item page within your dashboard.

<a href="">Buy now</a>


To install the Selz plugin, you will have to include the following resources in your page. The JS files should be loaded in the order below. For the CSS file, you can either incorporate it with your site's stylesheet, or load it externally through the <link> element in <head>.

Type File Name Description
JavaScript jquery.min.js The latest verson of jQuery is recommended for the Selz plugin functionality but v1.9 is minimum.
JavaScript jquery.selz.js Confers the main functionality of the Selz plugin. Alternatively, you can load the minified version, jquery.selz.min.js.
CSS jquery.selz.css Offers styles that are crucial for the correct display of the Selz overlay. The appearance will break if this is not included. You can customise the styles in the source less file jquery.selz.less or write your own at your own risk. Minified version is jquery.selz.min.css.

CDN Hosting

You can use our CDN for the JavaScript and CSS files:

<link href="" rel="stylesheet">
<script src=""></script>

Licensed under the MIT

License text