Jump to content


Replying to Shortcode For Exchange?


Post Options

  or Cancel


Topic Summary

jryven

Posted 25 November 2014 - 05:58 AM

Thanks for pointing out the name-change element, Ronald.  ( I should've looked harder! )

Here's my findings on changing the color of clicked buttons.

First - the closest CSS solution would be to use the :focus state to apply a style. Unfortunately, as soon as the user clicks elsewhere, the color returns to normal. This may be confusing, leading the user to believe that their product had been de-selected.

input.add-to-cart-button:focus {
background: green;
}

Second - a solution with better UX - is to deploy a bit of jquery to add a class to the clicked buttons : http://stackoverflow.com/questions/16240892/jquery-change-button-color-onclick

Unfortunately, we have to rely on jQuery for this solution.

<script>
jQuery(document).ready(function($) {
  $('input[type="submit"]').click(function(){
  if(!$(this).hasClass('clicked-button'))
  $(this).addClass('clicked-button');
});
});
</script>


There's no reason not to use both, though. And that's what I've done. Now, I have purple buttons, they turn green on click ( focus CSS ) and stay green until the user clicks elsewhere, at which point they turn grey ( jQuery class ).

And in this case, if user is not allowing jQuery, there is still a semi-persistent change in style while they shop.

Ronald

Posted 10 November 2014 - 02:36 PM

Hi James,

in the code provided earlier in this topic, you can edit the parameters for the 'get-purchase-options' and override the standard label using the 'add-to-cart-label' parameter, e.g. "Add to Cart" is changed to "Get this" using the following code:

it_exchange( 'product', 'get-purchase-options', array( 'add-to-cart-label' => 'Get this', 'add-to-cart-edit-quantity' => false, 'buy-now-edit-quantity' =>true ) );

That might be a clue,

As for changing the color, that may be done using css, but I am not sure if there is a class for the "clicked" state, you should inspect your site, FIrebug is recommended.

Also, please (always) add a link to your site so we can look into this if need be,

thanks,
Ronald

jryven

Posted 08 November 2014 - 03:43 AM

Thanks for this snippet! It's working really well for me to be able to setup a custom purchases-page for customers to "build their own product" a la carte.

Is there a hook or filter that I can use to change the "Add to Cart" button text? Ideally I'd like to use a function that I can use conditional tags to apply:



add_filter ( 'FILTER HERE', 'change_button_text_sometimes' );
function change_button_text_sometimes() {
if ( is_page( 'id') ) {

*Function Here*

}
}


Also - is there any way to change the color of the button after it's been clicked? Right now, my superwidget is at the footer, and the button is over the fold, so people may click and see no change and become confused about whether they've successfully purchased or not. If I have to do so, I am comfortable doing some jQuery to make it happen. (Although that's obviously not desirable.)


Best,
James

wheerani

Posted 31 October 2014 - 01:37 PM

Hi Ronald...  I'm still trying to troubleshoot this if possible because I really need to make it work...  

I notice the difference between when this button functions and when the regular product page button functions is that the button on it's own tries to reload the page and add to the url...  It has added things like...  '/?ite-sw-state=checkout' or '/?ite-sw-state=login'.  When the regular product page button functions it just updates the content in the little window without reloading the page, etc.

Does that bit of information help in troubleshooting this at all?

wheerani

Posted 30 October 2014 - 04:37 PM

No sweat Ronald...  Thank you for doing what you did.

I guess we will leave it as a mystery why the button is reloading the page (with '/?ite-sw-state=checkout') when clicked but nothing seems to change - like a purchase button or screen showing...

Thanks any way.

Ronald

Posted 30 October 2014 - 04:03 PM

Hi,

unfortunately, currently, this is "the best" I can do given the way Exchange works. I know that the dev's are working on/planning to work on an integrated solution in Exchange, I have no ETA on when this will be implemented though,

Ronald

wheerani

Posted 30 October 2014 - 12:04 PM

Thanks Roland for this shortcode.  Once implemented into exchange fully it will be very handy.

Unfortunately, after adding the code as mentioned to a button on our front page, when clicked the page reloads adding '/?ite-sw-state=checkout' to the url but nothing else changes on the page/buy button...  Any thoughts?

Please note this is a membership item, if that makes any difference.  Also, if possible to just have the stripe window popup when the buy button is clicked that is the desired outcome - instead of having to again press the Purchase button.

Thank you!

Elise Alley

Posted 26 September 2014 - 04:32 PM

Hi Craig,

Can you please start a new post for this.  We'd be happy to help you out, but it's unrelated to the original post and it helps to keep the threads to one topic.

When you create your new post, please be sure to include a link to your site.

Thanks,

Elise

craigbrissell

Posted 26 September 2014 - 04:28 PM

Hi Again... @Ronald or anyone else who may have time to help. Can you please help me with the code to turn Buy now button to Green with white font, sign me up button to Orange with Black Font and "add to cart" button changed to Amazon Yellow with black font... Please? I will really really appreciate it. Thanks in Advance.

craigbrissell

Posted 21 September 2014 - 07:52 PM

Thanks Guys very much for your help. I really appreciate it.

Review the complete topic (launches new window)