Is there an easy way to include icons in the button element?

The basic Bubble button element is good, but I don’t see how to add an icon to it.

Is there a good way to do this without creating a group and styling it as a button?

Technically you can use emojis for buttons (control + command + space on Mac, don’t remember Windows combination):
Screenshot 2023-02-14 at 19.06.24

But I think you’d better use icon element instead of button.

1 Like

I have experimented with using those emojis in design. That keyboard shortcut is a good one.

Also was looking at the icon element. It doesn’t allow for the use of text…

If you need an icon and a text - you can use both elements and group them in a container (group) to manage easier and for responsive settings.

1 Like

you can use a text element and some html code to display the icon and style it as button just the code in the text is [fa] fa iconname [/fa]

1 Like

I tested this out. This would do what I am looking to do, however ran into something strange.

Used [fa]fa fa-google-plus-ci[/fa] and it displayed in the icon format as expected.
When I included it in the text field it switched to a flag. I copy and pasted the value as well.

Thanks for taking a look at it. Unsure why it doesn’t work as expected. May try again but am going to try searching for options. I was thinking to code a default button and save it as a reusable then ungroup it when I need to modify it on the page.

Hey brother! Install heroicons plugin by @minimumstudio and use icons in you buttons. They explain how to do it perfectly on plugin page. Have a great day

2 Likes

This topic was automatically closed after 70 days. New replies are no longer allowed.