Automatische generieren eines Modal Popup Fenster

Allgemeine Fragen
Benutzeravatar
Volker
Moderator
Moderator
Beiträge: 828
Registriert: Sa 12. Dez 2020, 22:35
Wohnort: Wildberg
Kontaktdaten:

Automatische generieren eines Modal Popup Fenster

Ungelesener Beitrag von Volker »

Hallo zusammen,

ich schreibe hier, weil mir sonst kein Board eingefallen ist :D

Besteht theoretisch und natürlich auch praktisch eine Möglichkeit eines automatisierten Einbaus eines Modal Popup
in eine Webseite ?

Ich stelle mir folgendes vor :

Der Kunde hat auf seiner Seite mehrere Unterseiten mit seinen Fahrzeugangeboten.
Nun soll er eine Art Formularfeld haben, wo er eine URL eingeben kann. Diese soll dann
in einem Popup mit Iframe eingebunden sein und das Popup soll dann mittels Button auf dieser Unterseite aufrufbar sein.

Versteht Ihr was ich meine ?

Nehmt das Beispiel mobile.de - da kann der Kunde ja seine Fahrzeuge eingeben, Bilder hoch laden usw.
Nun noch da ein Feld : URL eingeben und dann wird ein Button generiert an vorher definierter Position und der ruft das Popup mit der URL auf.
Genial oder ? :D
Gruß Volker
Benutzeravatar
Tommy Herrmann
Site Admin
Site Admin
Beiträge: 5743
Registriert: So 6. Dez 2020, 07:37
Wohnort: Berlin
Kontaktdaten:

Re: Automatische generieren eines Modal Popup Fenster

Ungelesener Beitrag von Tommy Herrmann »

Moin,

da Du grundsätzlich mit "Mobirise" arbeitest, verschiebe ich das Thema mal in das allgemeine Mobirise-Board.

Grundsätzlich kannst Du so ein Popup entweder über Link/Button oder auch automatisch beim Seitenaufruf öffnen lassen.

Wie Du allerdings mit einer neuen noch unbekannten URL eine Seite aufrufen willst, die es noch gar nicht gibt, weiß ich nicht. Da müsste es ja dann so eine Arte Seiten-Generator geben, der eine HTML-Seite vollkommen automatisch generiert - keine Ahnung wie so etwas realisierbar sein sollte :confused:

Entscheidend ist ja dann wohl weniger das Popup-Fenster als der Inhalt, der dann automatisch generiert werden soll. Ich habe nicht die geringste Ahnung wie man so etwas machen könnte.

Man könnte vielleicht so eine Art Standard-Popup gestalten und dann nur bestimmte Inhalte aus der Mail mittels POST oder GET via PHP-SESSION übernehmen.

Ich hatte so etwas mal mit NOF gemacht:

http://www.tommyherrmanndesign.com/nof/Formular-MLR/

Vielleicht hat ja unser Werner das genau verstanden und Lust so etwas zu erstellen :D


Unten mal einige Möglichkeiten für Popup-Fenster, denn ich weiß nicht ob Dir diese bereits alle bekannt sind.


Mobirise Popup-Fenster als Erweiterung "Popup-Builder":

https://mobirise-tutorials.com/Business ... ilder.html


Gucke Dir auch diese CSS-Variante vom Werner an, bei Bedarf mit Cookie zum einmaligen Öffnen:

https://mobirise-tutorials.com/LawyerM4 ... Modal.html


... oder auch diese Bootstrap-Variante:

https://mobirise-tutorials.com/PortfolioM4/Modal.html


Natürlich kann man auch die alte JavaScript-Methode anwenden:

https://wiki.selfhtml.org/wiki/JavaScript/Window
Benutzeravatar
Werner-Zenk.de
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 755
Registriert: Di 8. Dez 2020, 19:42
Wohnort: Bamberg
Kontaktdaten:

Re: Automatische generieren eines Modal Popup Fenster

Ungelesener Beitrag von Werner-Zenk.de »

Vielleicht etwa so: ...
Wenn ein Eintrag in der Auswahlliste ausgewählt wird, öffnet sich ein Popup in dem sich ein iFrame befindet. Es wird dann im iFrame das ausgewählte Angebot (Seite) angezeigt.
Benutzeravatar
Volker
Moderator
Moderator
Beiträge: 828
Registriert: Sa 12. Dez 2020, 22:35
Wohnort: Wildberg
Kontaktdaten:

Re: Automatische generieren eines Modal Popup Fenster

Ungelesener Beitrag von Volker »

Sehr gut Werner !!!!

Das kommt dem schon verdammt Nahe.

Ist das Script schon auf Deiner Seite verfügbar ?
Gruß Volker
Benutzeravatar
Werner-Zenk.de
Mitglied (Level 10)
Mitglied (Level 10)
Beiträge: 755
Registriert: Di 8. Dez 2020, 19:42
Wohnort: Bamberg
Kontaktdaten:

Re: Automatische generieren eines Modal Popup Fenster

Ungelesener Beitrag von Werner-Zenk.de »

Ja, hier:

Code: Alles auswählen

<!DOCTYPE html>
<html lang="de">
 <head>
  <meta charset="UTF-8">
  <title>Fahrzeuge</title>

<style>
div#overlay {
 background-color: rgba(0, 0, 0, 0.15);
 visibility: Hidden;
 position: Fixed;
 left: 0px;
 top: 0px;
 width: 100%;
 height: 100%;
 z-index: 1000;
}

figure#figure {
 position: Absolute;
 left: 50%;
 top: 50%;
 transform: translate(-50%, -50%);
}

span#close {
background: red;
 cursor: pointer;
 padding: 3px;
}

iframe#fenster {
 width: 500px;
 height: 500px;
 border: Dotted 10px #FFD700;
}
</style>


<script>
function anzeigen(seite) {
 document.getElementById("overlay").style.visibility = "visible";
 document.getElementById("fenster").src = seite;
}

function closeWindow() {
 document.getElementById("overlay").style.visibility = "hidden";
}
</script>

 </head>
<body>

<select onChange="anzeigen(this.value)">
 <option>Bitte auswählen</option>
 <option value="kunde/angebot1.htm">Fahrzeugangebot 1</option>
 <option value="kunde/angebot2.htm">Fahrzeugangebot 2</option>
 <option value="kunde/angebot3.htm">Fahrzeugangebot 3</option>
</select>

<div id="overlay">

<figure id="figure">
 <p><span id="close" onClick="closeWindow()">Schließen</span></p>
 <iframe id="fenster"></iframe>
</figure>

</div>

</body>
</html>
Antworten

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 21 Gäste