Adding a button to a text

Hello there.

I need to add a button in the middle of a text, so I cannot just drag the button element because it would go at the bottom of the column, which means at the bottom (or top) of the text.

I was thinking about creating the button I want and getting the HTML code and then insert it in the text but I don’t know where to find the code.

Can you please help? Or do you have another way to do it?

Thanks a lot

Hi @isa1978,

Thanks for reaching out.

For that, I recommend using Global Block, please check this https://theme.co/apex/forum/t/global-blocks/24723. Then please add your button and style it within the global block builder. But make sure the section has no padding or margin, and the row’s global container is turned off to make sure there are no spaces around the button. Then simply copy the shortcode of the global block and insert it in the middle of your text content.

Hope this helps.

Hello Rad

thanks for this. However I have a doubt. If I create a global block I have to make one for each button I want to use, is that correct?

Because each one has its own text and link.

Thanks

Hello Isabella,

Sorry for the confusion.

If you have a text element or content area and want to insert a button in the middle of the text, you can either use html link with a button class or just use the classic button shortcode.

For example:

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer scelerisque eros eu pulvinar dictum. Nunc egestas massa at elit bibendum, cursus fringilla nunc <a href="#" class="x-btn">faucibus.</p> 

Or just simply this:

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer scelerisque eros eu pulvinar dictum. Nunc egestas massa at elit bibendum, cursus fringilla nunc [button type="flat" shape="square" size="mini" href="#example" title="Example"]faucibus[/button].</p> 

You can check out the classic button shortcode demo here: http://demo.theme.co/integrity-1/shortcodes/buttons/

We would love to know if this has worked for you. Thank you.

@RueNel Thank you so much for the clarification,

however I don’t think I am doing it properly.

I did insert the shortcode changing the specific information for the link and the text but it doesn’t work and I am not sure where I can change the color.

thanks for your help

Where am I doing wrong?
Thanks a lot

Hi @isa1978,

May I know the sample URL that has this button?

And yes, if you’re going to use a global block shortcode with button, then yes, you’ll have to create for each button but it gives you the freedom to customize your button within the builder without CSS customization.

Thanks!

There is no url with this button because I wasn’t able to use it. I was following the instruction from the link I was given above :frowning:

Hi Isabella,

Please add it even in a draft page and then share the URL credentials inside a secure note so we can see which part is not working.

To change the color, please use the style attribute as stated on the guide. Something like this:

[button type="flat" shape="rounded" size="jumbo" style="color:red;" href="#example" title="Example"]Round Button[/button]

Hope this helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.