Untitled

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo design button</title>
</head>
<body>
<script>
    window.DBSDK_Cfg = {
        export_mode : ['publish','download'],
        export_file_type : 'png',
    };
</script>
<script>
    (function (d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "https://sdk.designbold.com/button.js#app_id=08b68956d3";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'db-js-sdk'));
    window.DBSDK = {
        API: {
            host: 'alpha.designbold.com'
        }
    };
</script>

<a data-db-doctype="blog-graphic" data-db-layout="" data-db-title="Design It" data-db-width="0" data-db-height="0" data-db-unit="px" data-db-image="" data-db-preview-target=".demo-image-5" data-db-action="create" data-db-docid="" class="db-btn-designit" href="javascript:" data-id="button_custom_id" id="button_custom_id" data-href="">Design It</a>


<br/>
<br/>
<br/>
<br/>
<a href="javascript:changeDesignItToImage('https://cdn.designbold.com/web/developers/bigmom/main/images/db-button/5.jpg')">Change to image a</a>
<a href="javascript:changeDesignItToImage('https://cdn.designbold.com/web/developers/bigmom/main/images/db-button/4.jpg')">Change to image b</a>
<script>
    function changeDesignItToImage(src){
        var selector = '#button_custom_id';
        var dom_btn = document.getElementById('button_custom_id');
        dom_btn.setAttribute('data-db-image',src);
        DBSDK.initCustomButton(selector);
    }
    window.onload = function(){
        changeDesignItToImage('https://cdn.designbold.com/web/developers/bigmom/main/images/db-button/5.jpg');
    }
</script>
</body>
</html>