Webflow Slider bei einem bestimmten Slide starten lassen

Entscheide welcher Slide beim laden der Seite zuerst angezeigt werden soll. Einfach über Attributes editierbar.

Webflow Slider bei einem bestimmten Slide starten lassen
Code-Vorlage
Demo Beispiel enthalten
Mit Text-Anleitung
Diesen Trick und 41 weitere im Bundle kaufen
Für 49 € freischalten
Was ist enthalten?
Vorschau

Passe das Verhalten deines Webflow-Sliders an! Normalerweise lädt Webflow den ersten Slide einer Slideshow standardmäßig beim Laden einer Website Unterseite. Mit diesem Code behältst du die Kontrolle: Wähle selbst, welcher Slide zuerst angezeigt wird. Ganz einfach über Attribute editierbar.

Wann könnte so eine Funktion nützlich sein?

  1. Hervorhebung wichtiger Inhalte: Wenn du eine bestimmte Nachricht, ein Angebot oder ein Produkt präsentieren möchtest, kannst du sicherstellen, dass dieser Slide zuerst angezeigt wird, um die Aufmerksamkeit der Besucher zu lenken.
  2. Im Design wird eine wichtige Botschaft des Sliders oft mittig platziert und so geht der Platz links gestalterisch nicht leer aus, sondern wird mit slide-1 gefüllt. Aktiv angezeigt wird aber der zweite Slide.
  3. Gezielte Botschaften: Für bestimmte Marketingkampagnen oder Events kannst du einen beliebigen Slide entsprechend gestalten, um eine spezifische Botschaft zu vermitteln.
  4. Visuelles Storytelling: Wenn deine Webseite eine visuelle Geschichte erzählt, kannst du einen anderen Slide als Einführung nutzen, um die Geschichte ansprechend zu beginnen.
  5. Saisonale oder aktuelle Inhalte: Du kannst den ersten Slide anpassen, um saisonale Angebote, Neuigkeiten oder Veranstaltungen zu präsentieren.
  6. Benutzerfreundlichkeit: Falls du möchtest, dass Besucher beim Betreten der Seite direkt zu einem bestimmten Abschnitt geleitet werden.
Diesen Trick und 41 weitere im Bundle kaufen
Für 49 € freischalten
Was ist enthalten?

Weitere nützliche Webflow Tricks

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
Webdesign Animations-Inspiration – Godly
Kostenlos
Freischalten
Webdesign Animations-Inspiration – Godly

Jede verlinkte Seite hat eine Video-Vorschau, um schnell zu entscheiden, ob es als Inspiration geeignet ist, oder nicht.

Inspiration
Text-Anleitung
Demo Beispiel
Video-Anleitung
Eigener Video Player komplett in Webflow gebaut
Kostenlos
Freischalten
Eigener Video Player komplett in Webflow gebaut

Bau dir ein Video Player komplett in Webflow mit eigenen Interaktionen und Icons. Das mp4 File muss selbst gehostet werden.

Cloneable
Text-Anleitung
Demo Beispiel
Video-Anleitung
Automatisch nofollow zu externen Links in Webflow hinzufügen (Rich-Text, Blog etc)
Freischalten
Automatisch nofollow zu externen Links in Webflow hinzufügen (Rich-Text, Blog etc)

Automatisiert 'rel=nofollow' Attribut bei allen Links in Richt-Text-Elementen hinzufügen. Spart Zeit und verbessert SEO.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung
Webflow Slider bei einem bestimmten Slide starten lassen
Highlight
Freischalten
Webflow Slider bei einem bestimmten Slide starten lassen

Entscheide welcher Slide beim laden der Seite zuerst angezeigt werden soll. Einfach über Attributes editierbar.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung
Einmalig ein Info-Banner (Notification Bar) auf der Website anzeigen
Highlight
Freischalten
Einmalig ein Info-Banner (Notification Bar) auf der Website anzeigen

Sobald der Seitenbesucher den Info-Banner weggeklickt, wird er beim nächsten Laden der Website nicht mehr angezeigt, da die Entscheidung mit einem Cookie gespeichert wird. Über Attribute editierbar und ohne externe JS Library.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung
JavaScript Breakpoints für Webflow
Freischalten
JavaScript Breakpoints für Webflow

Wenn du mit zusätzlichem Custom Code in Webflow arbeitest, soll dieser auch manchmal nur bei einem bestimmten Breakpoint ausgegeben werden. Dieser Code hilft dir dabei.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung
Auf ein FAQ Element von einer anderen Seite verlinken und es geöffnet anzeigen
Freischalten
Auf ein FAQ Element von einer anderen Seite verlinken und es geöffnet anzeigen

Verlinke auf ein bestimmtes FAQ-Element von einer anderen Seite aus zu verlinken und es gleichzeitig geöffnet anzuzeigen. Einfach ?faq=3 mit an die URL hängen.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung
Webflow Website Launch Checkliste
Freischalten
Webflow Website Launch Checkliste

Meine umfassende Checkliste aus meinem Webflow-Onlinekurs hilft dir bei einem reibungslosen Website-Launch um keine wichtigen Schritte zu übersehen.

Allgemein
Text-Anleitung
Demo Beispiel
Video-Anleitung
Showreels Inspiration
Kostenlos
Freischalten
Showreels Inspiration

Showreelz ist ein kreativer Feed, der inspirierende und bemerkenswerte Designvideos präsentiert.

Inspiration
Text-Anleitung
Demo Beispiel
Video-Anleitung
Copyright Jahreszahl im Footer automatisch aktualisieren
Kostenlos
Freischalten
Copyright Jahreszahl im Footer automatisch aktualisieren

Copyright Jahreszahl im Footer einer Webflow Website automatisch aktualisieren.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung
Overflow auto (horizontal scrollen) mit vor und zurück Button
Highlight
Freischalten
Overflow auto (horizontal scrollen) mit vor und zurück Button

Wenn du mit horizontal scrollbaren Sektionen arbeitest, solltest du vorwärts und rückwärts Button hinzufügen, die der User als Backup klicken kann, da nicht jede Maus horizontal scrollen kann.

Code-Vorlage
Text-Anleitung
Demo Beispiel
Video-Anleitung