Creating a button in HTML

[jamie2364]

Hi

All my buttons are ‘disappearing’ at the bottom when I create them in html. They are successfully being created in Cornerstone, but when I’m creating posts/pages etc. outside of cornerstone, the bottom of the button is not showing. i’ve attached a screenshot to demonstrate what I mean. The button still works so it’s not major, but it looks quite ugly from a design standpoint.

This is the code I’ve used for the buttons, but I’ve also tried some code that I’ve found from your support in other forum topics and I am getting the same result:

My Code:

Download Video

The code I found from your support:

[button type=“real” class=“custom-color” shape=“rounded” size=“large” href="#example" block=“true” title=“Example”]Block Buttons Take Up The Entire Width Of Their Container[/button]

[christopher]

Hi @jamie2364,

Please kindly avoid using the old shortcodes like the one that you shared. Those shortcodes are deprecated and it is better that you do not use them.

Instead, please use the Global Block feature. You can use the global block feature to add whatever you want including buttons and then there will be a shortcode generated for you representing the global block and you can use it wherever you want.

For more information please read this article.

Thank you.

[jamie2364]

Global block make no sense for this task because I have hundreds of pages that each use different buttons, and each has a different URL that they go to. Does this mean that I’ve to create hundreds of Global Blocks, one for each button, and then have a separate shortcode for each button? Or is there some way to create one Global Block and change the URL the button is pointing to based on the page it is on?

[jamie2364]

Also, even after doing this, my buttons are still getting cut off at the bottom…

I have attached a screenshot to demonstrate this. The centered button is the global block!

Screenshot 2020-03-29 at 16.17.27|690x333

[nabeel]

Hey Jamie,

I checked your pages and the issue is caused by a third party plugin which is overriding the theme styling thus making the bottom of the buttons border-less. You can test it by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

Let us know how it goes!