Problem with Buttons and shortcode

Hi,
I cant use my buttons with any of the short code need for my checkout cart. I’ve tried both in Cornerstone and using short code for buttons. This is not a new problem, I’ve been doing workarounds for a while and avoiding using buttons on my site for a long time due to this. As I’m currently updating my site I really would like to use buttons for a call to action for my business. My membership page is a prime example… no buttons :frowning:

My website uses MindBody short code, which works perfectly outside of the buttons for links to my shopping cart, however it’s useless within the buttons.
In another thread it was suggested to disable plugins and try to see if one is interfering due to javascript error, however this is not the case for me as I’ve disabled them all and tested without any change.

An example of the short I’m trying to use is:<script src="https://widgets.healcode.com/javascripts/healcode.js" type="text/javascript"></script><healcode-widget data-version="0.2" data-link-class="healcode-pricing-option-text-link" data-site-id="5620" data-mb-site-id="40352" data-type="pricing-link" data-inner-html="Buy Now" data-service-id="10465"></healcode-widget>

This is vital to my website as it is used for purchases. Website is www.mantrayogastudio.com

Thank you.

Hi There,

Please add this embed code to the raw content element instead:

<script src="https://widgets.healcode.com/javascripts/healcode.js" type="text/javascript"></script><healcode-widget data-version="0.2" data-link-class="healcode-pricing-option-text-link" data-site-id="5620" data-mb-site-id="40352" data-type="pricing-link" data-inner-html="Buy Now" data-service-id="10465"></healcode-widget>

After that add the following CSS under Customizer > Custom > Global CSS:

a.healcode-pricing-option-text-link {
    color: #fff;
    border-color: #ac1100;
    background-color: #ff2a13;
    margin-bottom: 0.25em;
    text-shadow: 0 0.075em 0.075em rgba(0,0,0,0.5);
    box-shadow: 0 0.25em 0 0 #a71000, 0 4px 9px rgba(0,0,0,0.75);
    border-radius: 0.25em;
    padding: 0.563em 1.125em 0.813em;
    font-size: 16px;
}

Hope it helps :slight_smile:

Success!!! Thank you so much!

I have Transparent Square buttons throughout my site. I looked at the short codes here http://demo.theme.co/integrity-1/shortcodes/buttons/#example but I don’t think that will work for what you’ve provided?

How do I use what you’ve provided but make buttons have a transparent background?

Thanks again for your help :slight_smile:

Hi There,

Please update the given css code to this:

healcode-widget {
	padding: 0.714em 1.286em 0.857em;
	border: 3px solid #c6b26c;
}
a.healcode-pricing-option-text-link {
	    font-family: "futura-pt",sans-serif !important;
	    font-weight: 300;
		color: #c6b26c;
}

healcode-widget:hover {border-color: #7e838b;}
healcode-widget:hover a {color: #7e838b;}

Hope it helps,
Cheers!