Is there a Selz jQuery plugin for custom integration?

The Selz jQuery plugin is another option to add the Selz overlay to your website.

This option gives you greater control over the appearance of the overlay trigger, giving you the option to create a custom button or link that closely matches your websites style. You can also track events in the purchase flow.

The jQuery plugin , much like the widgets and buttons, opens an overlay and lets your customers complete their purchase without leaving your website.

Integration

Here is an example of a custom overlay integration using jQuery. For more information about the plugin, see the jQuery Selz plugin on Github

<link href="https://cdn.selz.com/jquery/1.0.13/jquery.selz.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="https://cdn.selz.com/jquery/1.0.13/jquery.selz.min.js"></script>


$(function() {
    $.selz({
        theme: {
            button: {
                bg:             "#5fa9df",
                text:           "#fff"
            },
            checkout: {
                headerBg:       "#5fa9df",
                headerText:     "#fff"
            }
        },
        getTracking: function($link) {
            return $link.data("tracking");
        },
        onDataReady: function ($link, data) {
            // Customise the link with item data
            $link.html('<img src="' + data.ImageUrlSmall + '" alt="' + data.Title + '">' + data.Title);
            // Skip to checkout
            // You can set the 'checkout' config option or set the URL yourself
            $link.data('modal-url', data.CheckoutUrl);
        },
        onModalOpen: function ($link) {
            // Track open in Google Analytics
            ga('send', 'pageview', $link.attr("href"));
        },
        onPurchase: function (data) {
            // Track purchase
        },
        onProcessing: function (data) {
            // Track processing
        },
        onClose: function ($link, data) {
            // Continue checkout flow
            if(typeof data.modal_url === "string"){
                $link.data("modal-url", data.modal_url);
            }
        }
    });
});

HTTPS/SSL

All payments on SelzĀ are made via a secure HTTPS connection. However, in order to protect yourself from certain forms of man-in-the-middle attacks, we suggest that you also serve the page containing the plugin with HTTPS as well. Using HTTPS/SSL also has SEO benefits.

For more information about the plugin, see the jQuery Selz plugin on Github

Was this helpful?

4 5