Wir können jetzt ernsthafte Dinge beginnen. Die Erstellung von Slider auf Slider Revolution kann anfangs ziemlich langweilig sein. Sie verlieren die Orientierung, weil Sie wissen möchten, wo sich dieses oder jenes Element befindet.
Sie werden Slider Revolution los, indem Sie mit Gewohnheit üben und dieses Tutorial lesen.
In unseren vorherigen Tutorials haben wir herausgefunden, wie:
- Laden Sie Slider Revolution herunter und installieren Sie es
- Wie man Slider Revolution Home UI versteht
- So richten Sie eine Diashow für Slider Revolution ein
Und jetzt, da wir unseren Schieberegler eingerichtet haben, werden wir den erstellen Präsentation "Von" Schieber ".
Erste Schritte mit dem Editor "Folien"
Im Prinzip greifen Sie nach dem Speichern der Konfigurationen eines Schiebereglers darauf zu zu einer neuen Oberfläche, die Sie in den Editor von " Präsentation ".
Ganz oben sehen Sie dieselbe Symbolleiste, mit der Sie unter anderem zur Liste der "Schieberegler oder Folien", zu den Parametern des Schiebereglers und zur Vorschau des Schiebereglers zurückkehren können.
Entdecken Sie auch unsere 10 WordPress-Plugins, mit denen Sie Ihre Blog-Beiträge bewerten können
Unten haben wir einen neuen Abschnitt, in dem wir die globalen Ebenen, die verschiedenen "Folien" und die Schaltfläche zum Hinzufügen einer neuen Ebene sehen können. Schlitten ".
Wenn Sie mit der Maus über die Schaltfläche einer Folie fahren, werden Sie feststellen, dass neue Optionen angezeigt werden. Diese Optionen sind ziemlich klar und leicht zu verstehen (duplizieren, zur Vorlage hinzufügen, um sie später wiederzuverwenden und die Folie zu löschen).
Wenn Sie den Mauszeiger über die Schaltfläche zum Hinzufügen von Folien bewegen, werden Sie andere Optionen bemerken, mit denen Sie eine leere Folie hinzufügen, mehrere Folien hinzufügen und eine Folie aus einer Vorlage hinzufügen können (Modell).
Derzeit befinden Sie sich auf der 1-Folie, weshalb sie in der Folienliste hervorgehoben ist. Wenn Sie eine neue Folie erstellen, wird diese anstelle der ersten Folie hervorgehoben.
Slider Revolution auf diesem Level ist ein echtes Dashboard. Wenn ich Ihnen alles erkläre, werden Sie nicht viel verstehen, und ich werde es vermeiden, über Funktionen zu sprechen, die verwirrend und nicht unbedingt erforderlich sein können.
Lesen Sie unseren Artikel auf 6 WordPress-Bildkomprimierungs-Plugins für Ihr Blog
Wenn Sie eine Folie ausgewählt haben, können Sie im folgenden Abschnitt mit der Bearbeitung beginnen. Dieser Abschnitt besteht aus mehreren Registerkarten (7), über die Sie auf verschiedene Funktionen zugreifen können.
So fügen Sie einer Szene ein Hintergrundbild hinzu
Das erste, was Sie tun möchten, ist, unserer Folie einen Hintergrund hinzuzufügen. Hier haben Sie die Wahl zwischen: einem Hintergrundbild (aus Ihrer Mediathek), einer externen URL, die auf ein Bild verweist, einem transparenten Hintergrund, der die von der vorgeschlagene Farbe verwendet Wordpress-Theme, eine feste Farbe, ein Youtube-, Vimeo- oder HTML5-Video. Wir wählen einen Hintergrund " Image ".
Sie können viele freie Bilder im Web finden. Führen Sie einfach eine Suche bei Google durch.
Wenn Sie ein Bild hinzufügen, gilt dies sofort in der Folienvorschau und in der „Szene“.
So fügen Sie ein Element in eine Szene ein
Jetzt, da wir eine gut dekorierte Szene haben, werden wir ein Element hinzufügen. Jedes Element, das Sie einer Szene hinzufügen, wird als Ebene oder Ebene betrachtet. Diese Ebenenfunktion hilft Ihnen, mir zu glauben.
Bewegen Sie den Mauszeiger über ein Objekt, um es der Szene hinzuzufügen Layer hinzufügen ".
Sie werden feststellen, dass Sie verschiedene Elemente hinzufügen können, darunter Text / HTML, Bilder, Audio, Video, eine Schaltfläche, eine Form, ein Objekt und ein Element importieren.
Beginnen wir mit einem transparenten Bild von Snoopy, dem kleinen Welpen.
Fügen Sie dann dieses Bild in die Szene ein, und Sie werden so etwas haben:
Sie werden feststellen, dass in den vier Ecken des Bildes kleine Quadrate sind. Mit diesen Quadraten können wir die Größe der Bilder ändern, da Snoopy in diesem Fall viel Platz einnimmt.
Die Größenänderung erfolgt durch " ziehen “. Um die Größe zu ändern und die Proportionen beizubehalten, halten Sie die Taste " Mai Von Ihrer Tastatur aus, während Sie die Größe ändern.
Siehe auch unsere 10 WordPress-Plugins, die Sie zu einem besseren Blogger machen
Jetzt sieht Snoopy so aus, es ist passender. Sie können ein Bild auch mithilfe der Anzeige oben rechts in jedem Bild wie folgt spiegeln:
So positionieren Sie Elemente mit dem Hilfsraster
Das Hilfsgitter ist ein wertvolles Element, mit dessen Hilfe die Elemente besser positioniert werden können. Sie können das Hilferaster unten links auf der Bühne aktivieren.
Dieses Raster hat Kacheln mit unterschiedlichen Größen. Je kleiner die Größe, desto präziser wird die Platzierung des Elements.
Wie fügt Animation
Es gibt 3 Arten von Animationen auf Slider Revolution: Eingangsanimationen, Animationen während (die Existenz des Elements in der Szene) Und Ende Animationen.
Siehe auch unsere 6 WordPress-Bildkomprimierungs-Plugins für Ihr Blog
Um einem Element eine Animation hinzuzufügen, müssen Sie es zuerst auswählen, indem Sie darauf klicken (Wenn ein Element ausgewählt ist, wird es von einer gepunkteten Linie mit anpassbaren Ecken eingerahmt).
Also klicke auf Snoopy, gehe auf die Seite und klicke auf den Reiter « Animation ".
Im vorherigen Bild habe ich die Eingabeanimationen in blau und die Ausgabeanimationen in rot.
Um eine Animation zu ändern, klicken Sie auf die Dropdown-Liste nach dem Symbol des laufenden Mannes.
Sie haben dann eine Vielzahl von Animationen zur Verfügung. Ich überlasse es Ihnen, die Animation auszuwählen, die Sie für den Eintrag eines Elements definieren möchten. Ich für meinen Teil wählte " easeOutElastic », Um dieses Ergebnis zu erhalten:
Hier für Sie unser 4 WordPress-Plugins, um die Fußzeile Ihres Blogs zu verbessern
Weiter links können Sie die Dauer der Animation und den zu belassenden Animationsmodus festlegen. " Keine Spaltung Da die anderen Optionen nur für Text und nicht für Bilder gelten.
Lire aussi So blenden Sie die Titel von Artikeln und WordPress-Seiten aus
Nun möchte ich Snoopy schweben, dafür gehe ich zu " Loop Und in der Dropdown-Option wählen Sie " Wave ". Jetzt schwimmt Snoopy:
So konfigurieren Sie die Sichtbarkeit von Elementen
Mein Snoopy schwimmt, aber ich möchte nicht, dass er auf dem Handy sichtbar ist. Also klicke auf " Sichtbarkeit »Stellen Sie auf dem Smartphone-Symbol sicher, dass es deaktiviert ist:
So passen Sie das Verhalten von Elementen an
Um das Laden des Schiebereglers zu optimieren, möchten Sie möglicherweise das Laden der Bilder verzögern. Dies geschieht in der Registerkarte " Verhalten Mit der Option " Faules Laden “. Sie können sogar die Reaktionsfähigkeit von Elementen erzwingen.
So erstellen Sie benutzerdefinierte Trigger für ein Element
Mit Aktionen können Sie Trigger mit bestimmten Aktionen verknüpfen. Um einen Trigger hinzuzufügen, klicken Sie auf die Registerkarte Aktionen »Dann auf die Schaltfläche« + ».
Es gibt 3-Triggertypen:
- Der Klick ist Anklicken mit der Maus
- Die Mauseingabe über das Element
- Die Maus geht über das Element hinaus
Die Liste der Aktionen ist ziemlich lang. Sie können beispielsweise einen Benutzer, der auf Snoopy klickt, auf eine andere Seite umleiten, indem Sie die Aktion " Einfache Verbindung Welches bringt neue Optionen.
Entdecken Sie auch unsere 10 Premium WordPress Plugins von Booking and Booking
Verwendung von Slider Revolution TimeLine
Slider Revolution bietet unten eine Zeitverwaltungsoberfläche. Über diese Oberfläche können Sie sehen, wo die Animation eines Elements beginnt und wo sie endet.
Auf dem vorherigen Bild sehen Sie zwei blaue Pfeile. Die erste links kennzeichnet den Beginn der Eingabeanimation eines Elements und die zweite das Ende der Eingabeanimation. Die dunkelrote Farbe zeigt die Lebensdauer des Objekts in der Szene an.
Lire aussi Wie ein Countdown auf Ihrer Wordpress-Blog
Sie werden ein Ende finden, das auch dem anderen Ende einer Dauer ähnlich ist (Eingangsanimation, Lebensdauer und Endanimation).
Mit dem " Timeline Sie können steuern, welches Element zuvor angezeigt wird und welches Element zuerst verschwindet. Es ist ein sehr praktisches Werkzeug, das Sie beherrschen müssen, um eine gute Animation zu erstellen.
Die Zeitleiste enthält auch einen Player, den Sie aktivieren können, um eine Vorschau der Folie anzuzeigen.
Bis dahin habe ich Ihnen die Grundlagen gegeben, um eine Folie zu erstellen. Speichern Sie nun Ihren Slider und starten Sie die Vorschau.
Das ist alles für dieses Tutorial, in einem nächsten werden wir über die Anzeige eines Schiebereglers in einem Artikel und einige fortgeschrittene Operationen sprechen.
Entdecken Sie auch einige Themen und Premium-WordPress-Plugins
Sie können andere verwenden Wordpress-Plugins um ein modernes Erscheinungsbild zu geben und die Handhabung Ihres Blogs oder Ihrer Website zu optimieren.
Wir bieten Ihnen hier einige Premium-WordPress-Plugins an, die Ihnen dabei helfen werden.
1. Disk Audio
Disk Audio ist eine andere WordPress Plugin mit dem Sie mit nur einem Knopfdruck einen Audioplayer direkt auf Ihrer Website anzeigen können. Das Layout des Audioplayers reagiert vollständig, sodass mobile Benutzer seine Funktionen problemlos genießen können.
Darüber hinaus bietet es viele Anpassungsoptionen, darunter Farbschemata, Erscheinungsbilder, Hintergrundbilder und Deckkraft. Es hat mehrere Optionen, um es per Tastatur und zu steuern Außerdem können Sie Ihre Wiedergabeliste mit einer einstellbaren Bildlaufleiste anzeigen.
Lesen Sie auch: 10 Wordpress-Plugins Forschung auf Ihrem Blog zu verbessern
Sie können auch Download-Links in den Musik-Player einbetten, um Benutzern zu zeigen, wo sie den auf Ihrer Website wiedergegebenen Titel kaufen können.
Herunterladen | Demo | Web-Hosting
2. Event Booking Pro
Das ist ein anderer WordPress Plugin 100 % reaktionsschnell, einfach anpassbar und spezialisiert auf die Verwaltung von Reservierungen auf jeder Website, die ihre Dienstleistungen im Bereich Veranstaltungen anbietet.
Zu den Hauptfunktionen gehören: Anpassung von Text, Farbe, Rahmen und anderen Elementen, Unterstützung für PayPal, Verwaltung von Gutscheincodes und Gutscheinen, Unterstützung für Google Maps, die Unterstützung der Verwaltung von E-Mails, die Unterstützung der Shortcodes, intuitives Bedienfeld, einfache Ereigniserstellung, vollständige Kontrolle über das Erscheinungsbild usw.
Herunterladen | Demo | Web-Hosting
3. Social Share & Locker Pro
Das Social Share & Locker Pro-Plugin wurde entwickelt, um Ihre Website in sozialen Netzwerken besser sichtbar zu machen. Mit nur wenigen Klicks können Sie entweder die Position Ihrer sozialen Symbole festlegen oder Ihre Inhalte sperren, indem Sie die Freigabe in einem der von Ihnen angebotenen sozialen Netzwerke verlangen.
Sie haben vordefinierte 10-Themen und dies sollte die häufigsten Wünsche abdecken. Alle ihre Themen sind Retina und wirken Wunder.
30 Dinge auf Ihren Blog-Posts nach ihrer Veröffentlichung zu tun Entdecken Sie sie in diesem Artikel.
Mit Social Share & Locker Pro können Sie außerdem den vollständigen Namen der sozialen Netzwerke oder nur das Symbol anzeigen. Dies hängt von Ihrem Design, dem verfügbaren Platz oder Ihren Wünschen ab.
Herunterladen | Demo | Web-Hosting
Empfohlene Ressourcen
Informieren Sie sich über andere empfohlene Ressourcen, die Sie beim Erstellen und Verwalten Ihrer Website unterstützen.
- So werden Sie ein erfolgreicher Blogger und verdienen Geld mit WordPress
- Wie integrieren Wordpress Google Forms
- So erstellen Sie eine Datenschutzrichtlinie für WordPress
- 6 WordPress-Plugins, um die RGPD-Konformität eines Blogs sicherzustellen
Fazit
Hier ist ! Das war's für diesen Leitfaden. Wir hoffen, dass dieses Tutorial Ihnen die Grundlagen zum Erstellen einer Diashow mit Slider Revolution in einem WordPress-Blog oder einer WordPress-Website vermittelt hat. Wenn Sie Fragen, Anregungen oder Anmerkungen haben, hinterlassen Sie diese in unserer Rubrik commentaires.
Sie können jedoch auch unsere RessourcenWenn Sie mehr Elemente benötigen, um Ihre Projekte zur Erstellung von Internetseiten durchzuführen, konsultieren Sie unseren Leitfaden auf der WordPress-Blog-Erstellung.
Zögere nicht zu Teile es mit deinen Freunden in deinen bevorzugten sozialen Netzwerken.
...
Guten Tag,
Ich möchte einem Slider ein AR-Bild hinzufügen, gehe zum AR-Plan und wähle als Quelle Hintergrund/Hauptbild aus, aber ich habe nicht die blaue Schaltfläche „Bild ändern“, daher verstehe ich nicht, wie ich das gewünschte Bild auswählen soll Bild, um es im Rahmen meines Sliders anzuzeigen ... haben Sie eine Idee?
Danke
Walter