Popup Builder Extension

Eine Erweiterung, mit der man eine modale Bootstrap Lightbox mit verschiedenen Inhalten und Optionen bequem erstellen kann.


Diesen Popup-Builder kann man unter den Erweiterungen käuflich erwerben und man kann mit diesem komfortabel modale Boxen erstellen, so wie man diese auch mit der Bootstrap-Class kostenlos erstellen könnte.

Guckt Euch die Möglichkeiten auf der Mobirise Beispielseite an.

Man kann ganz unterschiedliche Popups mit ganz normalen Verlinkungen erstellen, wie z.B. hier mit Bild oder auch im extra großen Format oder auch mit anderen Inhalten, wie z.B. einem Formular.

Auch Videos oder externe Skripte, wie diesen Countdown, kann man einbauen.

Die Links zu den Popups können auf jeder beliebigen Seite eines Projektes gesetzt werden, also nicht nur auf der Seite, auf der die Erweiterung eingebaut wurde.

Es gibt die Optionen über einen Timer, beim Verlassen der Seite oder das Popup-Fensters erst beim Scrollen der Seite öffnen zu lassen.

Für jedes Popup kann man einen zusätzlichen Block aufziehen und dann die entsprechenden Attribute im Werkzeuge-Fenster zuordnen. Im Linkfenster wählt man dann den von Mobirise generierten Namen des ausgewählten Popup.

Die Popup-Fenster können am x oder mittels Klick auf eine beliebige Stelle außerhalb des Fensters geschlossen werden.


Um das Popup an einem Button zu schließen (hier "Beenden"), wie bei diesem Popup, habe ich die Bootstrap-Anweisung:

data-dismiss="modal"

hinzugefügt.

Bemerkung: ab "Bootstrap 5" heißt diese Anweisung:

data-bs-dismiss="modal"


<div class="mbr-section-btn" mbr-if="showButtons" data-toolbar="-mbrBtnMove" mbr-buttons mbr-theme-style="display-4"><a class="btn btn-md btn-primary" data-dismiss="modal" data-app-placeholder="Type Text">Beenden</a></div>


Um das Popup daran zu hindern mittels Klick auf den Hintergrund zu schließen, wie bei diesem Popup, habe ich die Bootstrap-Anweisung:

data-backdrop="static"

hinzugefügt.


<div class="modal mbr-popup" tabindex="-1" role="dialog" data-backdrop="static">

Übersicht meiner Beispiel Popups

Klickt auf das jeweilige Icon unten um diese Popups zu testen

Text und Bild

Text und Button

Formular

Video

Werkzeuge Optionen

Countdown Fenster

Link Fenster

Popup groß mit Bild

Ansicht eines Popup Blocks auf der Arbeitsseite

Popup
Adresse

Schöne Strasse 1, Berlin

Deutschland