The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.
 
 
Thread Tools Display Modes
  #1  
Old 08-25-2014, 01:19 AM
Shanna Cushing's Avatar
Shanna Cushing is offline
Junior Member
 
Join Date: Aug 2014
Posts: 2
Default

Continue Shopping Button to custom URL


Hello,

I'm using the Ecwid plugin for Wordpress.

I've been scouring the forums but can't find a solution that works for me. I need the "Continue Shopping" button on the Order Confirmation page to redirect to a new link, a third party site where clients book an IT technician after purchase.

I would also like to find out how to make the button bigger and change the text to say "Book your Technician" at the bottom of the Order Confirmation/Invoice page.

This is the code I'm using on my page:
<!-- Ecwid code. Please do not remove this line otherwise your Ecwid shopping cart will not work properly. -->[ecwid_minicart] [ecwid_searchbox] [ecwid_categories] [ecwid_productbrowser]

<script>
if (typeof(Ecwid) == 'object') {
Ecwid.OnAPILoaded.add(function() {
var continueShoppingRedirect = "https://www.timetrade.com/book/FGK7S";

var buttons = [
'button.ecwid-productBrowser-cart-continueShoppingButton', // Cart page
'div.ecwid-productBrowser-cart-emptyCartPanel button.gwt-Button', // Empty cart page
'button.ecwid-ContinueShoppingButton-Invoice', // Order confirmation page
'div.ecwid-productBrowser-search-ContinueShoppingButtonContainer button.gwt-Button', // Search results page
'div.ecwid-Account-ContinueShoppingButtonContainer button.gwt-Button' // 'My account' pages
];

var pages = [
'ORDER_CONFIRMATION',
'ACCOUNT_SETTINGS',
'ORDERS',

];

Ecwid.OnPageLoaded.add(function(page) {
if (jQuery.inArray(page.type, pages) >= 0) {
var buttonObject = jQuery(buttons.join()).filter(":not('.clone'):visi ble");
if (buttonObject.length) {
buttonObject.clone().addClass('clone').appendTo(bu ttonObject.parent()).click(function() {
location.href = continueShoppingRedirect;
});

// Remove the original button
buttonObject.remove();
}
}
});
});
}
</script>
<!-- Ecwid code end -->

Last edited by Shanna Cushing; 08-25-2014 at 01:46 AM. Reason: Added Code
  #2  
Old 08-26-2014, 08:52 AM
Rick G's Avatar
Rick G Rick G is offline
Ecwid Team
 
Join Date: Jun 2014
Posts: 1,271
Default

Quote:
Originally Posted by Shanna Cushing View Post
Hello,

I'm using the Ecwid plugin for Wordpress.

I've been scouring the forums but can't find a solution that works for me. I need the "Continue Shopping" button on the Order Confirmation page to redirect to a new link, a third party site where clients book an IT technician after purchase.

I would also like to find out how to make the button bigger and change the text to say "Book your Technician" at the bottom of the Order Confirmation/Invoice page.

This is the code I'm using on my page:
<!-- Ecwid code. Please do not remove this line otherwise your Ecwid shopping cart will not work properly. -->[ecwid_minicart] [ecwid_searchbox] [ecwid_categories] [ecwid_productbrowser]

<script>
if (typeof(Ecwid) == 'object') {
Ecwid.OnAPILoaded.add(function() {
var continueShoppingRedirect = "https://www.timetrade.com/book/FGK7S";

var buttons = [
'button.ecwid-productBrowser-cart-continueShoppingButton', // Cart page
'div.ecwid-productBrowser-cart-emptyCartPanel button.gwt-Button', // Empty cart page
'button.ecwid-ContinueShoppingButton-Invoice', // Order confirmation page
'div.ecwid-productBrowser-search-ContinueShoppingButtonContainer button.gwt-Button', // Search results page
'div.ecwid-Account-ContinueShoppingButtonContainer button.gwt-Button' // 'My account' pages
];

var pages = [
'ORDER_CONFIRMATION',
'ACCOUNT_SETTINGS',
'ORDERS',

];

Ecwid.OnPageLoaded.add(function(page) {
if (jQuery.inArray(page.type, pages) >= 0) {
var buttonObject = jQuery(buttons.join()).filter(":not('.clone'):visi ble");
if (buttonObject.length) {
buttonObject.clone().addClass('clone').appendTo(bu ttonObject.parent()).click(function() {
location.href = continueShoppingRedirect;
});

// Remove the original button
buttonObject.remove();
}
}
});
});
}
</script>
<!-- Ecwid code end -->
Hello Shanna.

You can change Continue Shopping Button to this URL - https://www.timetrade.com/book/FGK7S and change label from 'Continue shopping' to 'Book your Technician' by adding this code in your Wordpress Control panel > Pages > Edit Store page in Text mode > Replace your previous code that you used to change URL of this button with the following one:
Code:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script>
if (typeof(Ecwid) == 'object') {
  Ecwid.OnAPILoaded.add(function() {
    // Redirect address. Change it to the URL of page where you want to redirect your customers.
    // You can use absolute or relative addresses, e.g. 'index.html', 'http://google.com'
    var continueShoppingRedirect = 'http://google.com';
    // Delay (ms), which is necessary for the empty cart page to appear after onCartChange event firing
    var empty_cart_page_delay = 500;
    // Continue shopping buttons CSS selectors 
    // (you can remove the ones that you don't want to change behavior for)
    var buttons = [
      'button.ecwid-productBrowser-cart-continueShoppingButton', // Cart page
      'div.ecwid-productBrowser-cart-emptyCartPanel button.gwt-Button', // Empty cart page
      'button.ecwid-ContinueShoppingButton-Invoice', // Order confirmation page
      'div.ecwid-productBrowser-search-ContinueShoppingButtonContainer button.gwt-Button', // Search results page
      'div.ecwid-Account-ContinueShoppingButtonContainer button.gwt-Button' // 'My account' pages
    ];
    // Pages (Ecwid.Page.type) where buttons should be customized
    // (you can remove the pages that you don't want to change the buttons on)
    var pages = [
        'ORDER_CONFIRMATION',         
    ];
    // This function find the continue shopping button on the page and replace it with a customized one
    var replaceButton = function() {
      var buttonObject = jQuery(buttons.join()).filter(":not('.clone'):visible");        
      if (buttonObject.length) {
        buttonObject.clone().addClass('clone').appendTo(buttonObject.parent()).click(function() {
          location.href = continueShoppingRedirect;
        }); 
        // Remove the original button
        buttonObject.remove();        
      }
    }
    // Replace the button on page loading
    Ecwid.OnPageLoaded.add(function(page) {
      if (jQuery.inArray(page.type, pages) >= 0) {        
        replaceButton();
      } 
    });
    // Replace the button on the empty cart page after clearing the cart 
    // (it doesn't fire onPageLoaded event)
    Ecwid.OnCartChanged.add(function(page) {
      setTimeout(replaceButton, empty_cart_page_delay);
    });
  });
}
</script>
<script type="text/javascript">
  ecwidMessages = { 
    "OrderConfirmation.continue":"Book your technician"
  }; 
</script>
If you want to change this button to look bigger and with light grey background, please add the fellowing code in Ecwid Control Panel > System Settings > Design > Custom CSS Themes:
Code:
.ecwid-Invoice-buttons-panel button.gwt-Button {
background: lightgrey !important;
font: normal 18px helvetica, arial, verdana, sans-serif !important;
height: 30px !important;
}
As a result, this button will look like this: http://take.ms/LPpJ8
Feel free to change this design as you wish.

Also you can check out these article to help you customise continue shopping buttons: http://help.ecwid.com/customer/porta...opping-buttons

If you have any questions, please don't hesitate to ask.
__________________
Ecwid API and App Market Team
Ecwid Developer Website
 
The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.

Tags
continue shopping button, custom button, custom url, wordress

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 12:00 AM.
Powered by vBulletin® Version 3.8.11. Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.