Mit einer CSS-Klasse und einer kurzen Media Query kannst du in GenerateBlocks jede zweite Feature-Sektion auf größeren Bildschirmen spiegeln – ohne die Blockstruktur doppelt aufzubauen.
So erstellst du einen animierten, mehrfarbigen Rahmen um einen GenerateBlocks-Container. Der Effekt basiert auf einem konischen Farbverlauf und einer CSS-Animation.
Wenn du schon mal genervt warst, an jedem einzelnen Breakpoint deinen Content in GeneratePress mit GenerateBlocks nachzupflegen, habe ich hier die perfekte Anleitung für dich. Du lernst, wie du Padding, Typografie, Karten-Grids und Bildgrößen automatisch responsiv gestaltest, ohne für Tablet und Mobile alles doppelt (und dreifach) zu machen. 1. Padding ohne nervige Einzelanpassungen Statt für … Weiterlesen …
Technische Demo für synchronisierte, seitlich fixierte Sektionen mit Greenshift und GenerateBlocks. Der Beitrag enthält einen umfangreichen Block-Prototyp, der vor der Wiederverwendung auf Plugin-Kompatibilität geprüft werden sollte.
Webdesign mit dem GenerateStack Als WordPress-Entwickler oder in einer Agentur brauchst du klare Richtlinien für die Verwendung verschiedener Komponenten-Typen. Besonders wenn du mit GeneratePress und GenerateBlocks arbeitest, ist die richtige Wahl zwischen Elements, Patterns und Synced Patterns entscheidend für eine effiziente Website-Entwicklung. Das Fundament: Customizer und Global Styles WordPress Customizer Der GeneratePress Customizer ist deine … Weiterlesen …
Eine kurze Orientierung zu wiederverwendbaren Inhalten, globalen Stilen und lokalen Blockmustern in WordPress mit GeneratePress und GenerateBlocks.
Mit einer CSS-Klasse am Looper-Block und einer kleinen Media Query kannst du eine Query-Loop-Ausgabe in einen horizontalen Scroller verwandeln.
Sammlung von Gestaltungsansätzen und CSS-Anpassungen für Akkordeons und Tabs mit GenerateBlocks. Prüfe die jeweilige Blockstruktur, bevor du Selektoren übernimmst.
Eine Sammlung von WordPress-Plugins für Community-Funktionen, Mitgliederbereiche, Benutzerprofile und Verzeichnisse. Prüfe vor dem Einsatz die aktuelle Pflege und Kompatibilität.
Ein Beispiel für eine scroll-gebundene Animation mit GenerateBlocks. Die Browserunterstützung ist nicht einheitlich; teste den Effekt vor dem produktiven Einsatz.
Mit einem Hintergrundbild, einem Container-Overlay und passenden Hover-Einstellungen kannst du Karten gestalten, deren Bild beim Darüberfahren abgedunkelt wird.
Mit Pseudoelementen und Flexbox ergänzt du links und rechts einer Überschrift dekorative Linien, die sich an deine globalen Farben anpassen.
Technische Notizen zur Erweiterung dynamischer Template-Tags für WordPress mit Meta Box und GeneratePress. Prüfe den Code gegen deine aktuelle Plugin-Version.
Unregelmäßige, handgezeichnet wirkende Ecken lassen sich mit unterschiedlich kombinierten border-radius-Werten simulieren.
Mit passenden Abmessungen, Border-Radius und Flexbox kannst du runde Container und kreisförmige Buttons mit GenerateBlocks gestalten.
Wann du für GenerateBlocks-Layouts besser min-height verwendest und wann Innenabstände ausreichen, um eine gewünschte Höhe zu erreichen.
So animierst du ein Hintergrundbild in einem GenerateBlocks-Container mit einem langsamen Ken-Burns-Effekt.
Eine dezente, endlos wiederholte Auf-und-ab-Bewegung lässt sich über CSS-Animationen realisieren. Nutze den Effekt zurückhaltend und berücksichtige reduzierte Bewegung.
Möglichkeiten, Formulardaten aus Fluent Forms an Calendly oder andere externe Tools zu übertragen. Berücksichtige dabei Einwilligung, Datenminimierung und die jeweilige API.
So lassen sich zeitverzögerte Aktionen in Groundhogg-Automationen einsetzen, um Kontakte nach einer definierten Wartezeit weiterzuführen.
Ein Bild- und Link-Sammelbeitrag zum WP Views Counter. Ergänze vor einem produktiven Einsatz aktuelle Angaben zu Datenschutz, Wartung und Funktionsumfang.
Ein kurzer Überblick über das Plugin Post Views Counter und die Frage, wie sich Aufrufe von WordPress-Beiträgen erfassen lassen.
Ein kurzer Überblick über Page Visits Counter Lite. Prüfe vor der Nutzung die aktuelle Kompatibilität und welche Daten das Plugin speichert.
Ein kurzer Einstieg in Independent Analytics als WordPress-integrierte Alternative zu externen Analytics-Diensten. Prüfe die aktuellen Funktionen und Datenschutzangaben.
Mit Data-Attributen kannst du Beitragskarten in einer GenerateBlocks-Query-Loop um kontextabhängige Badges erweitern.
Ein Ansatz, um globale GeneratePress-Farben zusätzlich als RGB-Komponenten bereitzustellen und sie anschließend mit Transparenz in rgba() zu verwenden.
Eine kuratierte Sammlung von Ideen und Tutorials für Scroll-Effekte, animierte Hintergründe und dezente Eintrittsanimationen.
Ausgewählte Tutorials, Inspirationen und Referenzen für Webdesign, Frontend-Entwicklung, Designsysteme und WordPress.
Mit Such- und Navigations-Plugins findest du Einstellungen und Verwaltungsbereiche im WordPress-Backend schneller, ähnlich wie mit Spotlight auf dem Mac.
Ein Werkzeug zur Berechnung flexibler Schriftgrößen. Prüfe, ob es zu deinem responsiven Typografie-System passt.
Ein Ansatz, um FAQ-Einträge als strukturierte Inhalte zu pflegen und sie über einen Custom Post Type in einer Akkordeon-Sektion auszugeben.
Ein kurzer Verweis auf eine Lösung, mit der sich der Absende-Button eines Fluent-Forms-Formulars abhängig vom gewünschten Verhalten deaktivieren lässt.
Ein Hinweis auf eine Lösung, mit der sich Feldbeschriftungen in Fluent Forms anhand eines definierten Trennzeichens verarbeiten lassen.
Ein Ansatz, um vom Nutzer eingegebene Werte zwischen Formularen zu übertragen und doppelte Eingaben zu vermeiden.
Ein Überblick über Möglichkeiten, Popups und modale Dialoge in WordPress umzusetzen – vom Plugin bis zur individuell gestalteten Lösung.
Hinweise zur Gestaltung und Konfiguration von Akkordeons mit GenerateBlocks. Prüfe die Einstellungen und CSS-Klassen anhand deiner installierten Version.
Ein Überblick über mögliche Buchungs-Workflows in WordPress – von einfachen Terminanfragen bis zu bezahlten Reservierungen.
Eine Übersicht über Replacement-Codes und Shortcodes in Groundhogg und darüber, wo du sie in E-Mails und WordPress-Inhalten einsetzen kannst.
Ein Beispiel für eine angepasste Kundenkonto-Seite, die WooCommerce und LearnDash-Funktionen in einer individuellen Oberfläche zusammenführt.
Hinweise zur gezielten Gestaltung von Groundhogg-Webformularen mit CSS, ohne Plugin-Dateien zu verändern.
Ein Verweis auf einen Regenbogen-Effekt aus einer Code-Snippet-Sammlung. Vor dem Einsatz solltest du den Originalcode und seine Abhängigkeiten prüfen.
Hinweise zum Übertragen von Beiträgen, Custom Post Types, lokalen GenerateBlocks-Mustern und Beitragsbildern zwischen WordPress-Installationen.
Eine kurze Orientierung dazu, wann du globale Stile, lokale Muster oder synchronisierte wiederverwendbare Inhalte verwenden solltest.
Ein kurzer Hinweis zur Anpassung des „Weiter einkaufen“-Buttons in WooCommerce. Prüfe, ob sich die gewünschte Änderung über Hooks, Templates oder CSS lösen lässt.
So planst du einen zusätzlichen Button im WooCommerce-Kundenkonto und entscheidest, ob ein Hook, ein Template oder CSS der passende Ansatz ist.
Ein Ansatz, um Navigationslinks links auszurichten und den letzten Menüpunkt in GeneratePress als Button rechts hervorzuheben.
Mit GeneratePress und GenerateBlocks ist es möglich, nahezu jegliche Layout-Anforderungen umzusetzen. Häufig sollen beispielsweise Landingpages erstellt werden, auf denen sich ein farbiger Hintergrund einzelner Sektionen über die gesamte Bildschirmbreite erstreckt. Der Content soll aber in den Sektionen innerhalb der global definierten Content-Width bleiben. GP & GB ermöglichen solche Layouts, indem Content-Width (per Theme & Editor) … Weiterlesen …
Mit CSS kannst du die Darstellung von WooCommerce-Buttons an das Design deiner Website anpassen, ohne Plugin-Dateien zu bearbeiten.
Demo-Beitrag für einen Kalender. Der Inhalt ist aktuell nur ein Platzhalter und sollte vor einer inhaltlichen Verwendung um die konkrete Lösung ergänzt werden.
Ein Layout-Trick für asymmetrische Abschnitte: Ein Container reicht bis zum Bildschirmrand, während der restliche Inhalt im zentrierten Seitenraster bleibt.
Die Kommentar-Funktion in WordPress ermöglicht dir, mit denen Besuchern mehr zu interagieren und sogar deine SEO-Rankings zu verbessern. Für die kommentierenden Besucher, Benutzer oder Kunden deiner Site selbst hingegen bietet WP standardmäßig keine weiteren Funktionen bereit. Dabei wäre es sinnvoll, eine automatische Anmeldung im Newsletter, oder auch eine automatische Mail-Benachrichtigung über weitere Kommentare anzubieten. Für … Weiterlesen …
Je nachdem, ob sich die Angebote deines WooCommerce-Shops überwiegend an gewerbliche oder private Kunden richtet, sollten die Preise inklusive oder exklusive der Umsatzsteuer angezeigt werden. Mit dem kostenlosen Plugin „Germanized“ kann die Mehrwertsteuer-Berechnung und -Anzeige bequem im Dashboard eingestellt werden: WooCommerce > Einstellungen > Umsatzsteuer Vor allem diese 3 Optionen sind wichtig: Mehrwertsteuer bei digitalen … Weiterlesen …
Auf 95% der WooCommerce-Sites, die ich für Kunden baue, werden ausschließlich Virtuelle, Downloads oder Dienstleistungen verkauft. Dort können also sämtliche Funktionen rund um Versand und Lieferung komplett deaktiviert werden. Hierfür es die folgenden Optionen in den WooCommerce- & Germanized-Einstellungen: Ggf. ist es sinnvoll, auch noch die folgenden Optionen zu deaktivieren:
So richtest du Buttons in gleich hohen Karten am unteren Rand aus, auch wenn die Texte der einzelnen Karten unterschiedlich lang sind.
Mit CSS kannst du einen Farbverlauf auf Text anwenden, sodass der Hintergrund des Textes transparent bleibt und der Verlauf durch die Buchstaben sichtbar wird.
WordPress erlaubt eigene Taxonomien nicht nur für Beiträge, sondern auch für Seiten und Custom Post Types. Hier erfährst du, welche Ansätze dafür infrage kommen.
Ein Überblick darüber, wie sich Layouts in WordPress über Theme-Einstellungen, Seiteneinstellungen und Container-Optionen strukturieren lassen.
Beispiel für dynamische Beitragskarten, die ein Hintergrundbild und den Beitragstitel kombinieren. Prüfe die Blockstruktur bei deiner GenerateBlocks-Version.
Mit einem CSS-Pseudoelement und einer Transition kannst du Links beim Darüberfahren mit einer animierten Unterstreichung versehen.
So markierst du einen Menüeintrag mit einer eigenen CSS-Klasse und gestaltest ihn als hervorgehobenen Button.
Mit CSS-Pseudoelementen kannst du Unterstreichungen animieren, die sich beim Darüberfahren über Links oder Menüeinträge aufbauen.
GenerateBlocks allein bietet nicht automatisch jede Lightbox- oder Modal-Funktion. Für Bildergalerien und Dialoge solltest du die benötigte Funktion gezielt ergänzen.
Mit einem gezielten Grid- und Container-Aufbau kannst du eine Spalte bis an den Viewportrand erweitern und den übrigen Inhalt im normalen Seitenraster belassen.
Ein Timeline-Layout lässt sich mit strukturierten GenerateBlocks-Containern und CSS aufbauen, ohne ein separates Timeline-Plugin einzusetzen.
Ein Beispiel für einen Umschalter, der zwischen zwei Inhaltsbereichen wechselt. Die Umsetzung kombiniert GenerateBlocks mit CSS und JavaScript.
Ein Layout-Beispiel, bei dem ein Bild als Hintergrund eines Textelements dient. Ergänze die Bild- und Blockeinstellungen passend zu deinem Design.
Ein Beispiel für einen Hero-Bereich mit WordPress-Cover-Block, Hintergrundbild und optionalem Parallax-Effekt.
Ein GenerateBlocks-Container kann als Hero-Bereich dienen; dabei muss der Abstand zum Standard-Beitragstitel berücksichtigt werden.