Opening external website in a new tab

Need help
1

I want to click on an image and go to an external website. This I am able to do but I want the site to open in a new tab. How can I do this?

Thanks

2

One way to do this is to place a link element on the image and direct that link to the external website and check the option of “Open in New Tab”

Other way is to install a plugin “URL Actions Plugin | Bubble”

And add an action on the click of the image to open a URL in new tab and specify the URL of the external website.

3

thanks I have installed the URL Actions plugin but have no clue how to use it. No features appear anywhere. I want to use this in a workflow to open an external website in a new tab.

Please help.

4

I personally use “TabOpener Plugin | Bubble” which i find does the trick quite efficiently and straightforwardly.

5

Thanks. I downloaded and see Tab Element but still cannot figure out how to use it in a dataflow to open an external website in a new tab. Can you help?

6

If you have the toolbox plugin you can just use this simple JavaScript to do this (that’s all the plugins do anyway): window.open("https://www.url.com");

Or, you can use a link element instead of an image (link elements can contain images - so just set the image on the link element).

7

Please see the image. I know about the link element but I see no option to put an icon anywhere.

link
link502×817 29.8 KB

8

You have to reference the Icon by it’s name;

image
image441×760 31.9 KB

And you can find a list of Bubble’s icon’s here;

9

I know about the link element but I see no option to put an icon anywhere.

Are you talking about in icon or an image?..

If you’re talking about an icon then see @bcart0v reply.

If you’re talking about an image (as per your original question) then you just need to set the element background style to ‘image’ then set the image.

image
image752×869 81.7 KB

10

I do not see the text "Show an icon instead of text’ anywhere on the link widget. This is what is confusing me.

11

I believe that may be on pages that have been updated to the new responsive engine? Because I don’t remember seeing it before I took that screenshot.
Edit: Nope, nothing to do with responsive, as @adamhholmes said there can’t be a style set on the Link.

But, without that option you can reference it via text like in my screenshot, so say if you want the Facebook icon as a link to an external website, you would use the Link option and in the Text put “[fa]facebook-offical[/fa]” and when the page loads, it will be the Facebook icon instead of text.

1 Like
12

So you’re asking about icons (not images)?..

in that case you can click the ‘Show icon instead of text’ box at the top of the link element properties editor:

image

You won’t see it if you have a style set - so make sure there is no style applied (unless that style has the show icon option set)

13

I think it is on the new responsive engine and I am on the old one. And no, even pasting the icon text of Facebook is not working on the button style link…nothing is working. I want to use the toolbox plugin but my URL is a bit complicated because it is dynamic. This one is not working. What syntax do I write for in the toolbox for the URL in the attached image?
Java

14

It works on both the old and new repsonsive engines (it’s been there since 2016 at least). Also @bcart0v’s method works just as well (if you do it correctly) - so maybe post a screenshot of what you’ve tried so we can see what you’re doing wrong…

I want to use the toolbox plugin but my URL is a bit complicated because it is dynamic. This one is not working. What syntax do I write for in the toolbox for the below URL?

You can set the link to anything (static or dynamic) exactly the same way you would using a link element.

15

Please see my previous response about Toolbox

16

Please see my previous response about Toolbox

Just use: window.open("https://www.url.com"); where your URL is whatever URL you need i.e. the one in your screenshot (use dynamic values for your url as needed - you can probably just use the “current page’s post’s link” as the easiest method - so: https://www.facebook.com/sharer/sharer.php?u=Current Page's Post's Link).

17

Please see the image. I do not see the Facebook icon on the gray button styled link even after feeding the text. I enter the destination link and see in the preview window but nothing appears.

linktext
linktext838×511 37.7 KB

18

Watch this how to use the plugin right

Password: 12345

19

You’ve spelt the name of the icon wrong for one thing…

Plus I’m not sure what colour your text is set to (make sure it’s not the same colour as the background).

But why not just check the ‘show icon box’ at the top instead? Then select the icon from the icon list?

20

I have no idea how the Show Icon instead of text appeared. It is not appearing now again. Even earlier it was not. However I have put the text so now the button is working but I want another icon so if you can let me know how to see the Show Icon that will be great.