Wie erstelle ich ein Popup-Fenster in WordPress ohne Plugins?

WordPress ist eine der besten Plattformen der Welt, das liegt an seinen Funktionen, die es seinen Benutzern ermöglichen, auf ihren Websites und Blogs alles zu bearbeiten, was sie wollen. Es hat auch eine einfache Schnittstelle. Damit Sie heute ein wenig mehr darüber erfahren, erfahren Sie, wie Sie ein Popup-Fenster in WordPress ohne Plugins erstellen.

So erstellen Sie ein Popup-Popup-Fenster in WordPress ohne Plugins

Und wenn Sie neu in dieser Welt des Arbeitens an Seiten und des Erstellens Ihrer eigenen Blogs sind, wird Hilfe nützlich sein, damit Sie alle Ihre Aufgaben erfüllen können. Denn obwohl es sehr einfach ist, WordPress zu verwenden, ist es notwendig, sich zuerst mit Codes und Plugins an das verwendete System anzupassen (nachdem Sie es gut gehandhabt haben, können Sie sogar ein mp4-Video in einen Eintrag oder eine Seite einfügen oder eine Excel-Tabelle einfügen). unter anderem).

Erstellen Sie ein Popup-Fenster in WordPress ohne Plugins

Für diejenigen, die mit der Terminologie nicht vertraut sind, ist ein POP UP im Grunde eine Ressource, die es Ihnen ermöglicht, Boxen oder Anrufe zu platzieren, die die Aufmerksamkeit des Lesers erregen, entweder wenn er eine bestimmte Taste drückt oder nach einer bestimmten Zeit. Am häufigsten erscheinen diese in der Mitte und unterhalb des PC-Bildschirms.

Um ein Popup-Fenster in WordPress ohne Plugins zu erstellen, gibt es mehrere Verfahren, einige einfacher als andere, das erste davon ist mit HTML-Code.

Diese müssen Sie entweder in die Fußzeile Ihres Blogs oder in dessen HTML-Block integrieren. Wenn Sie es in die erste einfügen, wird es auf jeder Seite angezeigt. Wenn Sie es stattdessen in den Block einfügen, wird es nur auf der Seite derselben angezeigt. Der Code lautet:

<div id=”background”><div id=”pop-up”> <button id=”close-pop-up”> <span>×</span> </button> //Formularcode einfügen hier, der Aktionsaufruf oder was auch immer Sie hinzufügen </div> </div>

CCS-Code, sodass das POP UP in der Mitte erscheint

Um ein WordPress-Popup-Popup ohne Plugins zu erstellen, können Sie auch CCS-Codes verwenden. Um sie hinzuzufügen, müssen Sie zu Ihrem Bedienfeld gehen und dann zum Abschnitt “ Darstellung “, dann zu “ Anpassen “ und schließlich zu “Zusätzliche CCS“, wenn Sie dort sind, fügen Sie Folgendes ein:

#Hintergrund {Anzeige: keine; Position:fest; oben: 0; unten: 0; links: 0; rechts: 0; Hintergrundfarbe: rgba(0,0,0,0.7); z-index: 1111111;} #pop-up {background-color: white; Breite: 800px; Position: absolut; oben: 200px; links: 50 %; Rand links:-400px; Polsterung: 30px; Randradius: 10px;} #close-pop-up {Position: absolut; oben: 0; rechts: 0; Hintergrundfarbe: transparent;

} #close-pop-up span{display: flex; Breite: 50px; Höhe: 50px; Hintergrundfarbe: grau; justify-content: center; Ausrichtungsinhalt: Mitte; Biegerichtung: Säule; Textausrichtung: Mitte; Farbe: weiß; Schriftgröße: 40px; Schriftdicke: fett; Grenzradius: 1000 %;

} @media (max-width: 800px){#pop-up {top: 0; links: 0; Breite: 100 %; Flanke: 0; unten: 0; Überlauf-y: scrollen;}}

Sobald dies erledigt ist, planen Sie das gewünschte Ereignis und speichern Sie die Änderungen. Dadurch wird Ihr POP-UP-Fenster erstellt, in dem Sie die gewünschten Nachrichten in Ihrem Blog platzieren können.

CCS in der unteren rechten Ecke

Wenn Sie den POP beiseite legen möchten, damit er für den Leser weniger invasiv ist, sollten Sie auch wie im vorherigen Abschnitt zum Abschnitt “Zusätzliches CSS“ gehen, aber dieses Mal sollten Sie den folgenden Code einfügen:

#background{Anzeige: keine; Position:fest; unten: 50px; rechts: 50px; Z-Index: 1111111; Breite: 400px; Höhe: 400px; Randradius: 10px; Polsterung: 30px; Hintergrundfarbe: weiß; Überlauf-y: scrollen;} close-pop-up {position: absolut; oben: 0; rechts: 0; Hintergrundfarbe: transparent;

} #close-pop-up span{display: flex; Breite: 50px; Höhe: 50px; Hintergrundfarbe: grau; justify-content: center; Ausrichtungsinhalt: Mitte; Biegerichtung: Säule; Textausrichtung: Mitte; Farbe: weiß; Schriftgröße: 40px; Schriftdicke: fett; Randradius: 1000 %} @media (max-width: 460px){#background {right: 0; Breite: 70 %;}}

Und das ist es, mit letzterem wissen Sie bereits, was Sie brauchen, um ein Popup-Fenster in WordPress ohne Plugins erstellen zu können. Sie müssen nur das gewünschte Ereignis konfigurieren und es wird sofort mit Hilfe von angezeigt diese Codes.

Jetzt, da Sie ein wenig vertraut sind, können Sie zu schwierigeren Dingen übergehen, wie z.