Link Element Checked to Display as Icon Does Not Appear in Editor

Hi there, here’s a strange one. When I’m trying to insert a link and make it display as an icon instead of text, for some reason it is not showing up in the editor, but it displays in my version-test preview.

08%20PM

Here it is in the preview of the app, shows up colored and all.
25%20PM

Has anyone encountered this issue?

1 Like

Check the sizing of the link on the page. It may be that the drawn link is too small to render properly in the editor, but shows up correctly in preview.

I had the same issue and reported it to bubble. They said that it wasn’t a bug because you can see it in live mode. Wish they would actually fix the issue though.

2 Likes

Hi Dan, sizing didn’t seem to matter. I made the element size 4-5x larger and it still didn’t show up in the editor.

Thanks @J805, good to know I’m not the only one.

I too wish they would fix it, or allow icon elements when clicked to run a workflow that opens an external URL in a new tab.

1 Like

Yes! Me too. I always have to put a blank link over an icon to achieve this. Just a little hack.

1 Like

@marktuff, instead of making it text and displaying it as an Icon. Try using a normal Icon instead. Then link it to a workflow so “when clicked”=true. It would go to an external URL. Like shown below:

@whitetigerwolfthe1st you cant open in a new tab like that.

1 Like

Hmm. That is true. But I have a plugin idea that would allow it to. I will get to work on that and possibly have it out later today. I will reply here once it is done.

@marktuff,
I was not able to develop a plugin that does this. But I have developed a plugin that allows javascript to be ran on the page. That plugin can be found here.

First, on the icon that you want to open an external website, edit the workflow to “Run Java” with my plugin then do the following;
–Input this javascript: window.open(‘http://yoururl.com’, ‘_blank’); | into the javascript input and replace ['http://yoururl.com'] with the URL that you would like the button/page to direct to (Keeping the " ’ ").

Hopefully this works out for you. If you have any issues, let me know!
-Whitigol

This may be because the font is not actually loaded in the editor. Dropping an icon element on the page should force the font to load in edit mode. (Haven’t tested but this is likely the issue.)

2 Likes

That’s a great hack J805, totally didn’t think of that but nice little workaround!

I was able to just use the link icon fine by blindly putting where I thought I needed it until I got it in the right spot, but figured I would at least bring this issue to light.

Thanks for your efforts and response @whitetigerwolfthe1st. I think I’ll roll with what I have right now, but if any other issues persist I’ll give the plugin a go, but I’m sure it’ll help many folks around here. Thanks for your contribution!

@marktuff, I was browsing through the bubble plugins today and found a plugin that could come in use for this topic. This plugin will allow you to open URL’s in new tabs through workflow. Here is a link if you would like to check it out: bubble.is/go/plugin/tabopener

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