15+ hervorragende Beispiele für WordPress-Slider (Showcase)
Veröffentlicht: 2018-09-21Suchen Sie nach Inspiration für Ihren WordPress-Slider? Mit Schiebereglern können Websitebesitzer ihre wichtigsten Inhalte in einer ansprechenden und interaktiven Diashow präsentieren, sodass Benutzer die Highlights sehen und sofort handeln können. Es ist kein Wunder, dass so viele Websites Schieberegler mit allem, was sie tun können, verwenden!
- Stellen Sie Inhalte effizient und stilvoll bereit
- Packen Sie viele Informationen auf kleinem Raum
- Fügen Sie Interaktion zu Ihrer Website hinzu
- Leiten Sie Besucher zu Werbeaktionen und wichtigen Seiten
In diesem Artikel zeigen wir Ihnen über 15 hervorragende WordPress-Slider-Beispiele. Wir zeigen Ihnen auch, wie Sie schnell einen wunderschönen Slider für Ihre eigene Website erstellen.
Slider-Inspirationsschaufenster
Hier sind einige der besten Beispiele für Schieberegler zu Ihrer Inspiration. Die Kriterien, nach denen wir diese Schieberegler ausgewählt haben, waren 1) Kreativität und 2) Benutzerfreundlichkeit. Einige Designs haben beides, andere nur einen Aspekt.
CNBC Prime

Der Schieberegler von CNBC ist gut lesbar und einfach zu bedienen. Sie verwenden eine dicke Schriftart für die Showtitel, damit sie leicht zu lesen sind. Das Einfärben des Textes hilft ihm auch, sich vom Hintergrund abzuheben.
CBS

Der Slider von CBS verwendet überzeugende Bilder mit großer Schrift und viel Weißraum, um das Lesen und Verwenden zu erleichtern. Die großen Aufzählungszeichen machen sehr deutlich, was passiert, wenn Sie klicken.
Universelles Orlando

Der Schieberegler von Universal hat einen einfachen Zweck: Sie zum Besuch des Vergnügungsparks zu verleiten. Obwohl die CTAs einige verlockende Angebote machen, sprechen die Fotos.
Savilles Taubenschläge

Saville's verwendet eine elegante Serifenschrift, gepaart mit Fotos, die die Qualität und Handwerkskunst ihrer Taubenschläge hervorheben. Sie erklären auch ihr umfangreiches Wissen über Tauben, sodass Sie sicher sein können, dass Sie die absolut besten Häuser für Ihre gefiederten Freunde kaufen.
Magnolienbäckerei

Magnolia Bakery ist ein großartiges Beispiel für einen Nur-Bild-Slider. Wenn Sie köstliches Gebäck haben, wer braucht dann Geplauder? Diese drei Mini-Slider sehen auf dieser Webseite einfach köstlich aus.
Flammende Schlucht

Flaming Gorge ist eine beliebte Attraktion in Utah. Die Schlagzeilen auf ihrer Galerie sagen alles: Im Flaming Gorge Resort können Sie die Weite der Aussicht genießen, ohne sie zu beeinträchtigen.
Headway-Themen

Headway Themes nutzt den Schieberegler kreativ. Anstelle des typischen Top-of-Page-Schiebereglers haben sie ihren weiter unten platziert und verwenden ihn, um Websites zu präsentieren, die ihre Themen verwenden. Clever!
Smithsonian Freer Sackler Galerie

Smithsonian Freer Sackler verwendet einen einfachen Navigationsschieberegler, um Sie zu den wichtigsten Seiten der Website zu leiten. Das einfache und saubere Erscheinungsbild des Schiebereglers, umgeben von Leerraum, der Sie zu den Bildern führt, ist perfekt für eine Kunstgalerie.
Einsamer Planet

Der Schieberegler von Lonely Planet wird mit einem rotierenden Vollbild und auffälligen Animationen schick. Dies ist nicht nur ein verdammt gut aussehender Schieberegler, sondern es ist auch einfach, zu jedem Ort zu navigieren, der Ihnen gefällt.
Ostbucht

Der Slider von Converse lenkt den Fokus genau dorthin, wo er hingehört: auf das Produkt. Die Details und Texturen sind in diesem Schieberegler so klar, dass Sie fast die Hand ausstrecken und den Stoff berühren könnten.
Sheetz

Der Schieberegler von Sheetz verwendet helle, lustige Farben mit interaktiven Vorwärtsschaltflächen, die herausgleiten, wenn Sie mit der Maus darüber fahren. Slider wie dieser verlangen geradezu danach, mit ihnen gespielt zu werden.
Xbox

Der Xbox-Schieberegler setzt auf Einfachheit mit sauberen Produktbildern, wenigen Wörtern und viel Leerraum. Hier ist definitiv weniger mehr.

Tim Hortons

Der Slider von Tim Hortons ist ein klassisches Beispiel für großartige Food-Fotografie bei der Arbeit. Lassen Sie sich das Wasser im Munde zusammenlaufen, kombinieren Sie das mit tollen Angeboten und BOOM! Sie haben einen Slider, dem man nur schwer widerstehen kann.
Sony Crackle

Crackle-Sticks mit einem einfachen Farbschema in Weiß und Orange, das die Aufmerksamkeit auf den rotierenden Schieber lenkt. Die kleinen Klappentexte auf jeder Folie wecken den Drang, die Röhre einzuschalten und ein paar Fernsehsendungen anzusehen.
Smithsonian Institut

Der Slider von Smithsonian verwendet große, auffällige Pfeile, damit Sie zu einer vorherigen Folie zurückkehren können, die Sie verpasst haben. Das ist in diesem Fall wichtig, da auf jeder Folie ziemlich viel Text zu lesen ist.
Louvre

Der Schieber des Louvre ist genau das, was Sie erwarten würden: historisch und elegant. Das ist dem großzügigen Weißraum, der Serifenschrift und dem einfachen, aber dramatischen Übergang zu Schwarz in den Bildern zu verdanken. Die andere großartige Sache an diesem Schieberegler ist die Schaltfläche „Wiedergabe/Pause“ in der unteren rechten Ecke.
So erstellen Sie Ihren eigenen WordPress-Slider
Jetzt fragen Sie sich vielleicht: „ Diese Schieberegler sind großartig, aber wie kann ich einen für meine eigene Website erstellen?“
Nun, zum Glück ist es dank des Soliloquy-Plugins für WordPress eigentlich ganz einfach.
Zuerst müssen Sie das Soliloquy Slider-Plugin installieren und aktivieren. Weitere Einzelheiten finden Sie in dieser Schritt-für-Schritt-Anleitung zur Installation eines Plugins in WordPress.
Als nächstes ist es an der Zeit, Ihren ersten Slider zu erstellen. Gehen Sie zu Monolog » Neu hinzufügen, um einen Schieberegler hinzuzufügen. Sie können Dateien von Ihrem Computer auswählen, wenn Sie Bilder hochladen müssen. Wenn Sie bereits Bilder auf Ihre Website hochgeladen haben, wählen Sie Dateien aus anderen Quellen aus.

Scrollen Sie weiter nach unten. Sie sehen die Bilder, die Sie für Ihren Slider ausgewählt haben. Von hier aus können Sie auf das Stiftsymbol klicken, um Bilder zu bearbeiten, oder auf das rote X klicken, um Bilder von Ihrem Schieberegler zu entfernen.

Sie können auch andere Details zu Ihrem Slider konfigurieren, indem Sie die Registerkarte „Config “ auf der linken Seite auswählen. Sie können die Bildgröße, das Slider-Thema und die Geschwindigkeit der Folienübergänge festlegen. Auch die Position Ihrer Textbeschriftung kann hier geändert werden. Überprüfen Sie diese Einstellungen.

Wenn Sie mit Ihren Einstellungen zufrieden sind, werfen Sie einen Blick auf die Registerkarte Mobile . Auf diese Weise können Sie testen, wie Ihre Website auf einem mobilen Gerät aussieht, und Ihre mobilen Auflösungseinstellungen nach Bedarf anpassen.
(Siehe auch die Registerkarte Verschiedenes zum Importieren oder Exportieren Ihres Schiebereglers.)
Fügen Sie einer Seite oder einem Beitrag einen Slider hinzu
Sie haben die Erstellung Ihres Schiebereglers abgeschlossen! Jetzt ist es an der Zeit, es dem Beitrag oder der Seite Ihrer Wahl hinzuzufügen. Bearbeiten Sie einen Beitrag oder eine Seite, klicken Sie auf die Schaltfläche Schieberegler hinzufügen und wählen Sie Ihren Schieberegler aus. Denken Sie daran, Ihren Beitrag / Ihre Seite zu veröffentlichen oder zu aktualisieren, um die Änderungen zu speichern.

Ihr Slider wird jetzt auf Ihrer Website live sein:

Das ist es! Sie haben jetzt Ihren ganz eigenen WordPress-Slider. Wir hoffen, dass dieser Artikel Sie mit über 15 hervorragenden Beispielen für WordPress-Slider inspiriert und Ihnen geholfen hat, Ihren ersten Slider zu erstellen.
Vielleicht möchten Sie auch alle erweiterten Funktionen ausprobieren, die Sie beim Entwerfen Ihrer Schieberegler verwenden können. Die Möglichkeiten zum Anpassen Ihres Schiebereglers sind praktisch endlos, also starten Sie noch heute mit Soliliquy! Hier sind nur einige Beispiele dafür, was Sie mit einem Soliloquy-Schieberegler tun können.
- Erstellen Sie einen Bild-Slider in voller Breite in WordPress
- Ändern Sie die Slider-Zeit in WordPress
- Erstellen Sie einen Responsive Video Slider in WordPress
Wenn Ihnen dieser Artikel gefällt, folgen Sie uns bitte auf Facebook und Twitter für weitere kostenlose WordPress-Tutorials.
