In Bubble Links in neuem Tab öffnen

Schritt-für-Schritt Anleitung wie man in Bubble Links in neuem Tab öffnen kann, insbesondere für Button, Groups und andere Elemente.

Chris Strobl
Chris Strobl

In diesem Video lernst du die verschiedenen Wege Links in Bubble io in einem neuen Fenster öffnen zu lassen. Dies ist vor allem relevant, wenn du für deine Nutzer schnell wieder zurück möchtest, aber trotzdem auf statische Seiten, Hinweisen zu AGBs oder auf externe Quellen verlinken möchtest.

Video-Tutorial: In Bubble Links in neuem Tab öffnen

Das Link Element in Bubble.io differenziert zwischen internen Links (also Seiten, die du selbst in Bubble.io) angelegt hast und externe Seiten (jede Seite im Internet, wie zum Beispiel https://).

Dort wählst du Open in new tab aus und somit wird dein Link jederzeit in einem neuen Fenster angezeigt.

Das Link Element funktioniert nur über einen Umweg auch bei anderen Elementen wie Text, Bild, Gruppen oder Buttons. Du legst nämlich das Element direkt über den Button und entfernst den Text des Elements. Die Border-Styles können dir helfen die Elemente anzupassen. Achte darauf, dass das Link Element über dem anderen Elemnt liegt (Arrange - Bring to front). Problematisch ist dieser Trick jedoch bei komplexen Seiten, insbesondere Responsive Seiten. Ein anderer Weg erfolgt über das kostenlose Plugin Open URL in new tab von Thimo (https://bubble.io/plugin/open-url-in-new-tab-1583324666271x739637822593433600). Du nimmst ein normales Element und legst den Workflow unter Plugins, Open URL in new Tab an. Dort kannst du einerseits die URL eingeben und anderererseits benötigst du eine Element ID (wir nehmen zum Beispiel button_extern).

Um eine Element ID anzuzeigen, müssen wir in Settings, General, General Appearance die Checkbox "Expose the Option to add an ID Attribute to HTML elements" anklicken. Dann gehen wir in das Button Element und können unten in IT Attribute button_extern ebenfalls angegeben.

Schließlich können wir über das Plugin von Thimo auch interne Bubble URLs auswählen, indem wir dynamic data bei der URL angeben und dort website home url, gefolgt vom Namen der Page eingeben.

PluginsFeatures