Przejdź do głównej treści

Jak stworzyć pokaz slajdów za pomocą Slider Revolution w WordPress

Divi: najłatwiejszy w użyciu motyw WordPress

Divi: Najlepszy motyw WordPress wszechczasów!

więcej Pobieranie 600.000, Divi jest najpopularniejszym motywem WordPress na świecie. Jest kompletny, łatwy w użyciu i zawiera więcej niż darmowe szablony 62. [Zalecane]

Teraz możemy zacząć poważne rzeczy. Tworzenie suwaka na Suwak Revolution na początku może być dość nudna. Stracisz orientację, ponieważ będziesz chciał wiedzieć, gdzie jest ten lub inny element.

Poznasz Slider Revolution, ćwicząc z przyzwyczajeniem, a także czytając ten samouczek.

Podczas naszych poprzednich samouczków odkryliśmy, jak:

A teraz, gdy skonfigurowaliśmy nasz suwak, stworzymy slajdy A "A" suwak ".

Jak przejąć kontrolę nad edytorem „Prezentacji”

Zasadniczo po zapisaniu konfiguracji suwaka uzyskujesz dostęp do nowego interfejsu, który zapozna Cię z edytorem „ slajdy ".

redaktor slide-rewolucja-suwak

Na samej górze zauważysz ten sam pasek narzędzi, który pozwala powrócić do listy „suwaków lub slajdów”, między innymi do parametrów suwaka i podglądu suwaka.

Odkryj także nasze Wtyczki 10 WordPress, które pozwalają oceniać artykuły na blogu

Revolution-suwak doutil-edycji-of-slide

Na dole mamy nową sekcję, która pozwala nam zobaczyć, globalne warstwy, różne „slajdy” i przycisk, aby dodać nowy „ ślizgać się ".

tworzenie-of-slide-button-slider-rewolucja

Po najechaniu myszką na przycisk slajdu zauważysz, że wyświetlane są nowe opcje. Te opcje są dość jasne i łatwe do zrozumienia (zduplikuj, dodaj do szablonu, aby użyć go później i usuń slajd).

Suwak Opcje-tworzenie-slide-rewolucja

Po najechaniu myszką na przycisk dodawania slajdu zobaczysz inne opcje, które pozwalają dodać pusty slajd, dodać wiele slajdów, dodać slajd z szablonu (model).

tworzenie-of-slide-opcja-rewolucja-suwak

Obecnie jesteś na slajdzie 1, dlatego jest on podświetlony na liście slajdów. Jeśli utworzysz nowy slajd, zostanie on podświetlony w miejsce pierwszego slajdu.

Drugi-slide-tworzenie-dun-slider-slider-rewolucja

Slider Revolution na tym poziomie to prawdziwy pulpit nawigacyjny. Jeśli wszystko ci wyjaśnię, nie zrozumiesz wiele, więc unikam mówienia o funkcjach, które mogą być mylące i nieistotne.

Przeczytaj nasz artykuł na temat 6 WordPress wtyczki do kompresji obrazu na swoim blogu

Po wybraniu slajdu możesz rozpocząć edycję w następnej sekcji. Ta sekcja składa się z kilku kart (7), które dają dostęp do różnych funkcji.

Jak dodać obraz tła do sceny

Pierwszą rzeczą, którą chcesz zrobić najpierw, jest dodanie tła do naszego slajdu. Tutaj masz do wyboru: obraz tła (z biblioteki multimediów), zewnętrzny adres URL wskazujący na obraz, przezroczyste tło, które będzie korzystało z koloru zaproponowanego przez motyw WordPress, stały kolor, film z YouTube, Vimeo lub HTML5. Wybierzemy tło ” obraz ".

TŁO obrazu Przykład

W Internecie można znaleźć wiele bezpłatnych zdjęć. Po prostu wyszukaj w Google.

Obraz-back Plan-rewolucja-suwak

Po dodaniu obrazu ma to zastosowanie natychmiast w podglądzie slajdu i w „scenie”.

szene-rewolucja-suwak

Jak dodać element do sceny

Teraz, gdy mamy dobrze udekorowaną scenę, dodamy element. Każdy element dodany do sceny jest uważany za warstwę lub warstwę. Ta funkcja warstwy pomoże mi uwierzyć.

Aby dodać element do sceny, najedź wskaźnikiem myszy Dodaj warstwę ".

fly-add-layer-suwak rewolucja

Zauważysz, że możesz dodać kilka różnych elementów, w tym: tekst / HTML, obrazy, audio, wideo, przycisk, kształt, obiekt i zaimportować element.

Zaczniemy od dodania przezroczystego obrazu małego szczeniaczka Snoopy.

funny-snoopy-png

Łatwo stwórz swoją stronę internetową dzięki Elementor

Elementor pozwala łatwo stworzyć dowolny projekt strony internetowej o profesjonalnym wyglądzie. Przestań płacić drogo za to, co możesz zrobić sam. [Bezpłatny]

Następnie dodaj ten obraz do sceny, a będziesz mieć coś takiego:

Przykładem-slider-slider-rewolucja

Zauważysz, że w czterech rogach obrazu są małe kwadraty. Kwadraty te pozwalają nam zmieniać rozmiar obrazów, ponieważ w tym przypadku Snoopy zajmuje dużo miejsca.

Zmiana rozmiaru odbywa się poprzez „ włóka ”. Aby zmienić rozmiar, zachowując proporcje, przytrzymaj przycisk „ Maj Z klawiatury podczas zmiany rozmiaru.

Zobacz także nasze Wtyczki 10 WordPress, które uczynią Cię lepszym Bloggerem

new-reprezentacja-snoopy-rewolucja-suwak

Teraz Snoopy wygląda tak, jest bardziej odpowiednie. Możesz także odwrócić obraz, używając światła w prawym górnym rogu każdego obrazu, tak jak to:

Obrót-DIMAGE-rewolucja-suwak

Jak pozycjonować elementy za pomocą siatki pomocy

Siatka pomocy jest cennym elementem, który pomaga lepiej ustawić elementy. Możesz aktywować siatkę pomocy w lewym dolnym rogu sceny.

Siatka daide-rewolucja-suwak

Ta siatka ma kafelki o różnych rozmiarach, im mniejszy rozmiar, tym bardziej precyzyjnie będziesz umieszczać element.

Inwestycyjno-of-obrazów

Jak dodać animacje

W Slider Revolution istnieją typy animacji 3: animacje wejściowe, animacje podczas (istnienie elementu w scenie) i animacje końcowe.

Zobacz także nasze 6 WordPress wtyczki do kompresji obrazu na swoim blogu

Aby dodać animację do elementu, musisz go najpierw wybrać, klikając go (po wybraniu elementu jest on obramowany linią przerywaną z narożnikami o zmiennym rozmiarze).

Kliknij Snoopy, przejdź na stronę i kliknij kartę « Animacja ".

Animowane-slider-rewolucja

Na poprzednim obrazie mam animacje wejściowe na niebiesko, a animacje wyjściowe na czerwono.

Aby zmienić animację, kliknij listę rozwijaną za ikoną biegacza.

icon-animowane-slider-rewolucja

Następnie masz do dyspozycji szeroki wybór animacji. Pozostawiam ci wybór animacji, którą chcesz zdefiniować dla wprowadzenia elementu. Ze swojej strony wybrałem „ easeOutElastic Aby uzyskać ten wynik:

Animacja-przystawką-snoopy

Tutaj dla ciebie nasz Wtyczki 4 WordPress, aby zwiększyć stopkę swojego bloga

Dalej po lewej stronie możesz określić czas trwania animacji i tryb animacji, który musisz pozostawić włączony „ Bez podziału Ponieważ inne opcje dotyczą tylko tekstu, a nie obrazów.

konfiguracja-wydma-animowane-slider-rewolucja

Lire aussi Jak ukryć tytuły artykułów i stron WordPress

Teraz chciałbym przenieść Snoopy, w tym celu przejdź do „ Pętla W rozwijanej opcji wybierz „ fala ”. Teraz Snoopy unosi się:

Szukasz najlepszych motywów i wtyczek WordPress?

Pobierz najlepsze wtyczki i motywy WordPress na Envato i łatwo stwórz swoją stronę. Już więcej niż pobrań 49.720.000. [EXCLUSIVE]

snoppy-floating

Jak skonfigurować widoczność elementów

Mój Snoopy unosi się, ale nie chcę, aby był widoczny na urządzeniach mobilnych. Więc kliknij „ widoczność A na ikonie smartfona upewnij się, że jest wyłączona:

Widoczność-elementy-rewolucja-suwak

Jak dostosować zachowanie elementów

Aby zoptymalizować ładowanie suwaka, możesz opóźnić ładowanie obrazów. Odbywa się to na karcie „ zachowanie Z opcją „ Lazy Loading ”. Możesz nawet wymusić reakcję elementów.

Zachowanie-element-rewolucja-suwak

Jak utworzyć niestandardowe wyzwalacze dla elementu

Akcje umożliwiają powiązanie wyzwalaczy z określonymi akcjami. Aby dodać wyzwalacz, kliknij kartę Akcje Następnie przycisk „+”.

add-a-przycisk migawki

Istnieją typy wyzwalaczy 3:

  • Kliknij, klikając myszką
  • Wprowadzanie myszy nad elementem
  • Wyjście myszy nad elementem

Lista działań jest dość długa. Na przykład możesz przekierować użytkownika, który kliknie Snoopy, na inną stronę, wybierając akcję „ Prosty link Które przyniosą nowe opcje.

Odkryj także nasze Wtyczki 10 premium WordPress z Booking and Booking

Management-of-wyzwalaczy-rewolucja-suwak

Jak korzystać z Slider Revolution TimeLine

Slider Revolution oferuje u dołu interfejs zarządzania czasem. Ten interfejs pozwala zobaczyć, gdzie zaczyna się animacja elementu, a gdzie kończy.

począwszy-i-end-wydma-film na suwak rewolucji

Na poprzednim zdjęciu widać dwie niebieskie strzałki. Pierwszy po lewej wskazuje początek animacji wejściowej elementu, a drugi koniec animacji wejściowej. Ciemnoczerwony kolor wskazuje żywotność przedmiotu na scenie.

Lire aussi Jak dodać odliczanie na swoim blogu WordPress

Znajdziesz koniec podobny do drugiego końca trwania (animacja wejściowa, czas życia i animacja końcowa).

Z „ Oś czasu Będziesz mógł kontrolować, który element jest wyświetlany wcześniej, a który znika jako pierwszy. Jest to bardzo praktyczne narzędzie, które musisz opanować, aby uzyskać dobrą animację.

Oś czasu ma również odtwarzacz, który można aktywować, aby wyświetlić podgląd slajdu.

Animacja-timeline-rewolucja-suwak

Do tego czasu dałem ci podstawy do stworzenia slajdu. Teraz zapisz suwak i rozpocznij podgląd.

Backup-and-previsulisation

To wszystko w tym samouczku, w następnym omówimy wyświetlanie suwaka w artykule i kilka zaawansowanych operacji.

Odkryj także niektóre motywy i wtyczki premium WordPress

Możesz użyć innych wtyczek WordPress, aby nadać nowoczesny wygląd i zoptymalizować chwyt swojego bloga lub strony internetowej.

Oferujemy tutaj kilka premium wtyczek WordPress, które pomogą Ci to zrobić.

1. Dysk Audio

Disk Audio to kolejna wtyczka WordPress, która pomoże Ci wyświetlić odtwarzacz audio bezpośrednio na twojej stronie internetowej, naciskając tylko przycisk. Układ odtwarzacza audio jest całkowicie responsywny, więc użytkownicy mobilni będą mogli cieszyć się jego funkcjami bez żadnych problemów.

Ponadto oferuje wiele opcji dostosowywania, w tym schematy kolorów, wygląd, obrazy tła i krycie. Ma kilka opcji sterowania za pomocą klawiatury i go umożliwia także wyświetlanie listy odtwarzania za pomocą regulowanego paska przewijania.

Czytaj także: Wtyczki 10 WordPress poprawiają wyszukiwanie w Twoim blogu

Będziesz także mógł osadzić linki do pobierania w odtwarzaczu muzyki, aby pokazać użytkownikom, gdzie mogą udać się, aby kupić utwór odtwarzany w Twojej witrynie.

Pobierz | Demo | hosting

2. Rezerwacja imprez Pro

To kolejna responsywna wtyczka WordPress 100%, łatwa do dostosowania i dedykowana do zarządzania rezerwacjami na dowolnej stronie internetowej, która oferuje swoje usługi w zakresie wydarzeń.

Jego główne funkcje obejmują: dostosowywanie tekstu, koloru, obramowań i innych, wsparcie dla PayPal, zarządzanie kodami kuponów i kuponami, wsparcie dla Mapy Google, wsparcie zarządzania wiadomościami e-mail, obsługa skrótów, intuicyjny panel sterowania, łatwe tworzenie zdarzeń, całkowita kontrola nad wyglądem itp.

Pobierz | Demo | Hosting

Z łatwością stwórz swój sklep internetowy

Uzyskaj woocommerce, najlepsze wtyczki e-commerce do sprzedaży produktów swoich fizycznych i cyfrowych na WordPressie. [Zalecane]

3. Social Share & Locker Pro

Rozszerzenie Social Share & Locker Pro zostało zaprojektowane, aby Twoja witryna była lepiej widoczna w sieciach społecznościowych. Wystarczy kilka kliknięć, aby ustawić pozycję ikon społecznościowych lub zablokować zawartość, wymagając udostępniania w jednej z proponowanych przez Ciebie sieci społecznościowych.

Masz predefiniowane motywy 10, które powinny obejmować najczęstsze życzenia. Wszystkie jej tematy to Retina i cuda.

30 rzeczy do zrobienia w swoich blogach po ich opublikowaniu Odkryj je, sprawdzając ten artykuł.

Ponadto, dzięki Social Share & Locker Pro, będziesz mógł zobaczyć pełną nazwę sieci społecznościowych lub tylko ikonę. Będzie to zależeć od twojego projektu, dostępnej przestrzeni lub twoich życzeń.

Pobierz | Demo | hosting

Polecane zasoby

Odkryj inne zalecane zasoby, które będą Ci towarzyszyć w tworzeniu witryny i zarządzaniu nią.

Wnioski

Voila! To tyle w tym przewodniku. Mamy nadzieję, że ten samouczek przedstawił podstawy tworzenia pokazu slajdów za pomocą Slider Revolution na blogu lub stronie WordPress. Jeśli masz jakieś pytania, sugestie lub uwagi, zostaw je w naszej sekcji commentaires.

Będziesz jednak mógł również skonsultować się z nami Zasoby, jeśli potrzebujesz więcej elementów do realizacji projektów tworzenia stron internetowych, zapoznaj się z naszym przewodnikiem na stronie Tworzenie bloga WordPress.

Nie wahaj się udostępnij znajomym w swoich ulubionych sieciach społecznościowych.

...

Ten artykuł zawiera komentarze 0

Zostaw komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *

Ta strona używa Akismet, aby zmniejszyć niechciane. Dowiedz się więcej o sposobie wykorzystania danych komentarzy.

Powrót do góry
4 akcji
udział1
ćwierkanie
Enregistrer3