Heute zeigen wir Ihnen eine kleine Verbesserung, die Ihrem Designprozess zu mehr Effizienz verhelfen kann. Wir zeigen Ihnen wie Sie die Standardhöhe (min. und max.) und die Standardbreite (min. und max.) des Builder-Popups im Divi-Theme festlegen und die Standardposition für das Popup auf der Seite bestimmen können.
Beginnen wir mit der Breite und Höhe. Beide können nach Ihren Wünschen angepasst werden, und beide können mit einer bestimmten Breite oder Höhe oder als minimale oder maximale Breite und Höhe eingestellt werden.
Maximale Breite des Pupups festlegen
Im ersten Snippet können Sie die Breite des Popup-Fensters für die modalen Einstellungen festlegen. Diesen Wert (hier 400px) können Sie anpassen. Wir haben sie auf «max-width» eingestellt, aber vielleicht ziehen Sie es vor, sie auf «width» oder «min-width» einzustellen, je nach Ihrer Situation.
Den Code legen Sie im CSS-Stylesheet Ihrer Website – unter Design/Customizer/Zusätzliches CSS ab:
/* Popup-Breite festlegen */
.et-db #et-boc .et-l .et-fb-modal {
max-width: 400px;
}Weiter gehts:
Höhe des Divi-Popups festlegen
Als nächstes folgt ein Schnipsel für die Höhe. In diesem Beispiel haben wir sowohl eine Mindest- als auch eine Maximalhöhe angegeben. Die User können in diesem Szenario die Höhe immer noch zwischen diesen beiden Werten verändern. Auch dieser Code gehört ins CSS-Stylesheet – wie gewohnt unter unter Design/Customizer/Zusätzliches CSS:
/* Höhe des Popups festlegen */
.et-fb-modal__content {
min-height: 400px!important;
max-height: 600px!important;
}Widmen wir uns nun der Position:
Position des Divi-Popups festlegen
Mit dem folgenden Snippet können Sie die Standardposition des Popups festlegen. Sie möchten vielleicht, dass das Fenster immer oben links geöffnet wird, oder dass die rechte Seite 100px von oben und rechts entfernt ist, usw. Das lässt sich im folgenden Schnipsel einstellen.
In diesem Beispiel haben wir den oberen Rand auf 75 Pixel und 100 Pixel von links eingestellt. Sie können diese Werte jedoch ändern. Auch dieser Code kommt ins CSS-Stylesheet (unter Design/Customizer/Zusätzliches CSS):
/* Position des Divi-Popups festlegen */
.et-db #et-boc .et-l .et-fb-modal {
top: 75px!important;
left: 100px!important;
}Voilà – alles erledigt.
Werbung
Werbung
