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:
- Pobierz i zainstaluj Slider Revolution
- Jak zrozumieć Slider Revolution Home UI
- Jak skonfigurować pokaz slajdów w Slider Revolution
A teraz, gdy skonfigurowaliśmy nasz suwak, stworzymy slajdy A "A" suwak ".
Jak rozpocząć pracę z edytorem „Prezentacji”
Zasadniczo po zapisaniu konfiguracji suwaka uzyskujesz dostęp do nowego interfejsu, który zapozna Cię z edytorem „ slajdy ".
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 umożliwiają ocenianie postów na blogu
U dołu mamy nową sekcję, która pozwala nam zobaczyć warstwy globalne, różne „slajdy” oraz przycisk dodawania nowego ” ślizgać się ".
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).
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).
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.
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ą będziesz chciał najpierw zrobić, to dodać tło do naszego slajdu. Tutaj masz wybór pomiędzy: obrazem tła (z twojej biblioteki multimediów), zewnętrznym adresem URL, który wskazuje na obraz, przezroczystym tłem, które użyje koloru proponowanego przez WordPress, stały kolor, wideo z YouTube, Vimeo lub HTML5. Wybierzemy tło” obraz ".
W Internecie można znaleźć wiele bezpłatnych zdjęć. Po prostu wyszukaj w Google.
Po dodaniu obrazu ma to natychmiastowe zastosowanie w podglądzie slajdu oraz w „scenie”.
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ę ".
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.
Następnie dodaj ten obraz do sceny, a będziesz mieć coś takiego:
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
Teraz Snoopy wygląda tak, jest bardziej pasujący. Możesz także odwrócić obraz, używając wskaźnika znajdującego się w prawym górnym rogu każdego obrazu, w następujący sposób:
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.
Ta siatka ma kafelki o różnych rozmiarach, im mniejszy rozmiar, tym bardziej precyzyjnie będziesz umieszczać element.
Jak dodać animacje
Istnieją 3 rodzaje animacji w Slider Revolution: animacje wejścia, 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 ".
Na poprzednim obrazie mam animacje wejściowe na niebiesko, a animacje wyjściowe na czerwono.
Aby zmienić animację, kliknij listę rozwijaną za ikoną biegacza.
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:
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.
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 pływa:
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:
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.
Jak utworzyć niestandardowe wyzwalacze dla elementu
Akcje umożliwiają powiązanie wyzwalaczy z określonymi akcjami. Aby dodać wyzwalacz, kliknij kartę Akcje »Następnie naciśnij przycisk« + ».
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
Jak korzystać z Slider Revolution TimeLine
Slider Revolution oferuje interfejs zarządzania czasem na dole. Ten interfejs pozwala zobaczyć, gdzie zaczyna się animacja elementu, a gdzie się kończy.
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.
Do tego czasu dałem ci podstawy do stworzenia slajdu. Teraz zapisz suwak i rozpocznij podgląd.
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 WordPress wtyczki aby nadać nowoczesny wygląd i zoptymalizować obsługę Twojego bloga lub strony internetowej.
Oferujemy tutaj kilka premium wtyczek WordPress, które pomogą Ci to zrobić.
1. Dysk Audio
Dysk Audio to kolejny WordPress Plugin który pomoże Ci wyświetlić odtwarzacz audio bezpośrednio w Twojej witrynie za naciśnięciem jednego przycisku. Układ odtwarzacza audio jest całkowicie responsywny, dzięki czemu użytkownicy mobilni będą mogli cieszyć się jego funkcjami bez żadnych kłopotó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 również przeglądanie 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.
2. Rezerwacja imprez Pro
To jest kolejny WordPress Plugin W 100% responsywny, łatwy do dostosowania i dedykowany do zarządzania rezerwacjami na dowolnej stronie internetowej, która oferuje swoje usługi w zakresie eventów.
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.
3. Udostępnianie społecznościowe i Locker Pro
Rozszerzenie Social Share & Locker Pro zostało zaprojektowane, aby Twoja witryna była bardziej widoczna w sieciach społecznościowych. Za pomocą kilku kliknięć możesz ustawić położenie ikon społecznościowych lub zablokować zawartość, wymagając udostępniania w jednej z oferowanych 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ł wyświetlić pełną nazwę sieci społecznościowej lub tylko ikonę. Zależy to od Twojego projektu, dostępnej przestrzeni lub Twoich życzeń.
Polecane zasoby
Dowiedz się o innych zalecanych zasobach, które pomogą Ci zbudować witrynę i zarządzać nią.
- Jak zostać odnoszącym sukcesy blogerem i zarabiać pieniądze dzięki WordPress
- Jak zintegrować formularze Google na WordPress
- Jak stworzyć politykę prywatności na WordPress
- Wtyczki 6 WordPress w celu zapewnienia zgodności bloga z RGPD
Podsumowanie
Tutaj jest ! To wszystko w tym przewodniku. Mamy nadzieję, że ten samouczek dał ci 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.
...
Witam,
Chcę dodać obraz ar do suwaka, wchodzę do planu ar, jako źródło wybieram obraz tła/główny, ale nie mam niebieskiego przycisku „zmień obraz”, więc nie rozumiem, jak wybrać żądany obraz, aby wyświetlić go w ramce mojego suwaka… masz pomysł?
dziękuję
Walter