This is an advanced tutorial and proceed only if understand the risks.
-
Create a new snippet in your theme and set name
additional-checkout-buttons.liquid
and add following code:<script type="text/template" id="additional-checkout-buttons"> {% if additional_checkout_buttons %} <div class="additional-checkout-buttons"> {{ content_for_additional_checkout_buttons }} </div> {% endif %} </script> <script type="text/javascript"> window.addEventListener('Upside::UCD::CartBuilt', function(e){ if(document.getElementById('ucd-additional-checkout-buttons') && document.getElementById('additional-checkout-buttons')) { document.getElementById('ucd-additional-checkout-buttons').innerHTML = document.getElementById('additional-checkout-buttons').innerHTML; if(window.Shopify && Shopify.StorefrontExpressButtons) { Shopify.StorefrontExpressButtons.initialize(); } } }); </script> <style type="text/css"> #ucd-additional-checkout-buttons {padding:0 20px 20px;} #ucd-additional-checkout-buttons .additional-checkout-button {display:block;width:100% !important;} #ucd-additional-checkout-buttons .additional-checkout-button + .additional-checkout-button{ margin-top: 10px !important; } </style>
-
Open
theme.liquid
file and add following code before ending</body>
tag and save the file:{% include 'additional-checkout-buttons' %}
-
Open ULTIMATE Cart Drawer app and visit Themes page.
-
Edit code
for Live Theme and EditCart Template
orDrawer Template
depending on where the submit button code is in the theme. -
Add following code before the submit button and hit Save
<div id="ucd-additional-checkout-buttons"></div>