Webflow Lightbox Schließen-Button stylen

Dieser CSS Code überschreibt das Standard-Design von Webflow, welches jedem Lightbox-Schließen-Button mitgegeben wird. Du kannst es mit deinem eigenen Icon versehen.

Webflow Lightbox Schließen-Button stylen
Code-Vorlage
Demo Beispiel enthalten
Mit Text-Anleitung
Diesen Trick und 43 weitere im Bundle kaufen
Für 49 € freischalten
Was ist enthalten?
Vorschau

Dieser CSS Code überschreibt das Standard-Design von Webflow, welches jedem Lightbox-Schließen-Button mitgegeben wird. Du kannst es mit deinem eigenen Icon versehen. Zudem kannst du die Größe, Hintergrundfarbe und den Hover Zustand festlegen.

Diesen Trick und 43 weitere im Bundle kaufen
Für 49 € freischalten
Was ist enthalten?

Weitere nützliche Webflow Tricks

Eigenen Audio Player komplett in Webflow stylen
Kostenlos
Freischalten
Eigenen Audio Player komplett in Webflow stylen

Custom Audio-Player um auf deiner Webseite Audio-Dateien anzuziegen und zu stream. Der Player kann nach Wunsch in Webflow gestaltet werden.

Cloneable
Text-Anleitung
Demo Beispiel
Video-Anleitung
SVG Linien animieren (wenn im Viewport)
Kostenlos
Freischalten
SVG Linien animieren (wenn im Viewport)

Mit nur zwei Attributen kannst du jedes SVG mit Line Paths animieren und das Timing anpassen.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung
Lazy Loading Background Videos in Webflow
Highlight
Freischalten
Lazy Loading Background Videos in Webflow

Viele Background Videos auf einer Website führen zu einer hohen Netzwerknutzlast und schlechteren Page-Speed Score. Dieser Code hilft dir dabei, Videos erst zu laden, sobald sie im Viewport des Seitenbesuchers sind.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung
Im Browser Hintergrund von Bildern entfernen und als PNG runterladen
Freischalten
Im Browser Hintergrund von Bildern entfernen und als PNG runterladen

Nutze ich häufig wenn es bei Kundenaufträgen mal schnell gehen muss. Funktioniert natürlich am besten bei Objekten, die einen neutraleren Hintergrund haben.

Tool
Text-Anleitung
Demo Beispiel
Video-Anleitung
Vimeo Video Playlist mit Webflow CMS erstellen
Kostenlos
Freischalten
Vimeo Video Playlist mit Webflow CMS erstellen

Erstelle ansprechende Vimeo Videoplaylists mithilfe dieses Webflow Cloneables. Nutzt die Vimeo API. Ideal für Tutorials und Kurse.

Cloneable
Text-Anleitung
Demo Beispiel
Video-Anleitung
Horizontal Sektion scrolling Parallax Bilder Effekt (Webflow Interactions)
Kostenlos
Freischalten
Horizontal Sektion scrolling Parallax Bilder Effekt (Webflow Interactions)

Ein Effekt, welcher eine Sektion horizontal über den Screen scrollt und gleichzeitig Bilder hinter einem Fenster parallax bewegt. Ohne Custom Code!

Cloneable
Text-Anleitung
Demo Beispiel
Video-Anleitung
Webflow Lightbox Hack: Gruppen-Slugs per JavaScript steuern
Freischalten
Webflow Lightbox Hack: Gruppen-Slugs per JavaScript steuern

Ein Trick, der dir zeigt, wie du in Webflow mehrere unabhängige Lightbox-Galerien mit dynamischen CMS-Gruppennamen erstellst, ohne dass sie sich in einer Gruppe öffnen.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung
DSGVO konforme Alternative zu Webflow Forms
Freischalten
DSGVO konforme Alternative zu Webflow Forms

Mit einem Kostenlosen Plan von 250 Absendungen pro Monat, sehr einfacher Integration und du kannst weiterhin die Webflow Form-Komponente verwenden.

Tool
Text-Anleitung
Demo Beispiel
Video-Anleitung
Tabellen für Rich-Text Inhalte visuell erstellen
Freischalten
Tabellen für Rich-Text Inhalte visuell erstellen

Webflow bietet keine Tabellen-Funktion in Rich Text Elementen. Mit diesem Tool kannst du Tabellen und Inhalte visuell gestalten und den Code als Embed einfügen.

Tool
Text-Anleitung
Demo Beispiel
Video-Anleitung
Webflow Lightbox Schließen-Button stylen
Freischalten
Webflow Lightbox Schließen-Button stylen

Dieser CSS Code überschreibt das Standard-Design von Webflow, welches jedem Lightbox-Schließen-Button mitgegeben wird. Du kannst es mit deinem eigenen Icon versehen.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung
Horizontales Text / Bilder Karussell (ohne Webflow Interaktionen) | Infinite Marquee
Freischalten
Horizontales Text / Bilder Karussell (ohne Webflow Interaktionen) | Infinite Marquee

Lass Bilder, Logos und Texte mit nur zwei Zeilen CSS Code horizontal durch den Bildschirm wandern. Mit dieser Code-Vorlage musst du nur ein Attribut vergeben.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung
Kleine Kreise und Rechtecke willkürlich auf der Website verteilen (Effekt)
Freischalten
Kleine Kreise und Rechtecke willkürlich auf der Website verteilen (Effekt)

Ein kreativer Effekt, der auch auf der Webflow Conf Website 2022 angewendet wurde. Die Elemente verschwinden automatisch on hover und tauchen wo anders wieder auf.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung