[thecashbagParticipant]

I have a button (made on a Cornerstone page) that I don’t want to link anywhere.

It’s a “Buy Now” button with a tooltip that comes up when clicked saying “Sorry, sold out”. I don’t want the button to point to any URL right now. I just want the tooltip to appear when clicked and nothing else.

I have removed everything from the HREF field, but still when you click the button it reloads the page and which sends the user back to the top of the page and they never see the tooltip.

How can I remove the link all together so this doesn’t happen?

[thecashbagParticipant]

This reply has been marked as private.

[LelyModerator]

Hello There,

To disable link function, please add class disable-link to your button then add the following JAVASCRIPT code in Appearance > Customizer > Custom > Javascript.

jQuery(function($){

$('.disable-link').on('click', function(e){ 
  e.stopPropagation();
    e.preventDefault();
   });

});

Hope this helps.

[thecashbagParticipant]

Sorry for the late reply.

I cannot see an option in cornerstone to add a class to the button.

[Rue NelModerator]

Hello There,

Please turn on the advance controls and you can add a class to the button.

Let us know if this has been helpful to you.

[Tristan AParticipant]

Hi there!

I just implemented this solution. Unfortunately, it doesn’t seem to work.

I have buttons that are embedded in a thrive leads shortcode, which opens up a 2 step optin. Unfortunately, the user is then also scrolled to the bottom of the page.

So I tried the javascript here. It doesn’t work.

I tried another button, this time without the thrive leads shortcode. In that case, it also doesn’t work.

Any thoughts?

[Tristan AParticipant]

This reply has been marked as private.

[ZeshanMember]

Hi there,

You can try this code instead:

jQuery(document).ready(function($) {
  $('.disable-link').on('click', function(e){ 
    e.stopPropagation();
    e.preventDefault();
  });
});

Thank you!

[Tristan AParticipant]

OK that did work

Unfortunately, it also stops the lightbox from popping up!.

[ZeshanMember]

Hi Tristan,

Thanks for updating the thread! The provided code is just to disable the link. We cannot guarantee if it will work with 3rd party scripts or plugins. That said, we cannot provide support for third party plugins or scripts. You may wish to consult a developer to assist you with this. https://community.theme.co/custom-development/

Thank you for your understanding. Take care!

[Tristan AParticipant]

Off course, I fully understand. I had already contacted the guys from Thrive Leads to get a solution from them.

Thanks!

[LelyModerator]

Hello Tristan,

Thank you for understanding.

Always,
x

[Tristan AParticipant]

Ok guys,

I am talking to the guys over at Thrive to get this fixed. Hopefully, I can get the JS code adapted to still be able to activate the lightbox but prevent the scrolling.

Would you mind providing a bit of background as to how the standard x-theme button scroll behavior is working:

I created a simple test page with lots of text and a number of x-theme button shortcodes in there, all without an actual link. From the behavior there, my conclusion is that X-buttons that do not have a link added to them, by default link to “#”. Is that correct?

[RadModerator]

Hi Tristan,

Buttons without links will be linked to its current page, hence reloading. That’s a default behavior of all browsers. If your button has #, then it should link to top, again it’s browser’s behavior. But it shouldn’t scroll.

What you need is this,

jQuery( function($) {

$('.disable-link').on('click', function(e) { 
    e.preventDefault();
    setTimeout( function() { $('html, body').stop(); }, 90 );
} );

} );

Stop reloading and linking to top, and stop scrolling too.

Thanks.

[Tristan AParticipant]

THanks!!

[Author]

Posts