Przejdź do głównej treści

Slider Revolution: konfiguracja suwaka na WordPressie

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]

Od początku tej serii samouczków poświęconej wtyczce WordPress Suwak Rewolucja, nauczyliśmy się pobierz i zainstaluj wtyczkę, następnie odkryłem jego interfejs i różne funkcjonalności, Przejdźmy teraz do pokazania konfiguracji Suwak.

Jeśli jesteś początkującym i szukasz zasobów, aby zacząć; znajdziesz tu wszystko, czego potrzebujesz, aby zacząć, A jeśli odkryjesz tworzenie bloga, przeczytaj Jak łatwo utworzyć blog WordPress: Przewodnik i Tuto

To powiedziawszy, konkretnie odkryjmy, czym jest suwak.

Co to jest suwak?

Suwak jest składnikiem HTML. Tak, wiem, powiedz tak, to niewiele posuwa się naprzód. Tak więc suwak jest funkcją, która pozwala wyświetlać luźno (lub nie) różne informacje. Te informacje są pogrupowane według „ ślizgać się ”, Który jest elementem„ suwaka ”i który może składać się z obrazu, tekstu wideo, linków itp.Slider Revolution Critique premium wordpress motyw smarty elearning

" suwak „Dlatego zawiera” slajdy (Przynajmniej 1), a te slajdy zawierają elementy multimedialne (obrazy, wideo, muzyka, tekst), które mogą być animowane lub interaktywne (reagować na działania użytkownika).

Uwaga : Możesz przetłumaczyć „ suwaki W „ interaktywne i dynamiczne slajdy ".

Slider Revolution pozwala nam to zrobić, a zaczniemy bez dalszej zwłoki.

Jeśli nie masz jeszcze strony internetowej i szukasz motywu WordPress, który natywnie integruje tę potężną wtyczkę WordPress, ta lista najlepszych motywów WordPress będzie idealna.

Tworzenie suwaka: pierwsze konfiguracje

Aby rozpocząć, musisz kliknąć menu « Suwak Rewolucja Na pulpicie WordPress.

Wordpress suwak rewolucji

Teraz kliknij element nowy slider I przejdziesz do interfejsu konfiguracji suwaka.

new-slider-slider-rewolucja-tutorial

Interfejs konfiguracji suwaka może być zniechęcający, ale jeśli się cofniesz, lepiej zrozumiesz jego funkcje. Możesz zauważyć, że ten interfejs składa się z dwóch części. Pierwszy po lewej składa się z różnych obszarów 5, a drugi po prawej składa się z małych obszarów 6. Powyżej masz pasek narzędzi, który pozwala:

  • Powrót do listy suwaków « Wszystkie suwaki »
  • Dostęp do ustawień suwaka (to jest okno, w którym jesteś)
  • Interfejs edycji slajdów
  • Przycisk kopii zapasowej
  • Przycisk edycji slajdów
  • Suwak podglądu
  • Przycisk usuwania suwaka
  • Przycisk powrotu (Bis) Do listy suwaków

Pasek narzędzi-Revolution-suwak

Będę teraz wyjaśnić każdą sekcję w lewej kolumnie.

Ta wtyczka WordPress obsługuje wiele obrazów, co może spowolnić ładowanie Twojej witryny. Discover Dlaczego musisz zacząć optymalizować swój blog WordPress według obrazów

sekcja „Źródło treści”

źródło treści rewolucja-suwak

W tej sekcji możesz skonfigurować źródło suwaka. Rzeczywiście tutaj możesz zdecydować o utworzeniu:

  • Klasyczny suwak, w którym będziesz musiał samodzielnie skonfigurować wszystkie animacje
  • Suwak artykułów, w którym pole manewru jest dość ograniczone
  • Suwak określonych artykułów, które możesz wybrać
  • Suwak kanału informacyjnego Flickr
  • Suwak kanału na Instagramie
  • Suwak na produktach WooCommerce
  • Suwak na kanale Twittera
  • Suwak na Facebooku
  • Suwak w publikacjach YouTube
  • I suwak w publikacjach Vimeo

Na marginesie należy zauważyć, że: Slider Revolution to potężna wtyczka, która pozwala wyróżniać produkty w sklepie internetowym. Odkryj Motywy 10 WordPress, aby stworzyć sklep internetowy i zaprezentować swoje ubrania

To powiedziawszy, z przyjemnością przedstawimy, jak stworzyć klasyczny suwak, ponieważ jest najczęściej używany, najtrudniejszy do opanowania i najbardziej niezwykły w swoich efektach. Dzięki praktyce będziesz w stanie tworzyć własne konfiguracje na innych suwakach. W razie problemów nie wahaj się wrócić i zostawić komentarz tutaj. Więc zostaw opcję „ Domyślny suwak »Aktywne.

Sekcja Tytuł suwak i skrót

Prawdopodobnie zgadłeś. W tej sekcji możesz zdefiniować tytuł suwaka i skrót, który mu towarzyszy (nic naprawdę dobrego).

tytuł i shortcode-du suwak

Sekcja „Wybierz typ suwaka”

select-a-kind-of-suwaku-slider-rewolucja

Ta sekcja pozwala zdefiniować podstawową strukturę suwaka. Rzeczywiście masz do dyspozycji opcje 3, które pozwalają ci:

  • Dla pierwszej opcji zdefiniuj domyślny suwak o szerokościach dostosowanych do dostępnej przestrzeni i posiadających podstawowe elementy, takie jak przyciski nawigacyjne.
  • W przypadku drugiej opcji możesz zdecydować się na zastosowanie stylu dynamicznego i interaktywnego, bez przycisku nawigacyjnego i znacznie bardziej imponującego niż poprzednia opcja. Ta opcja nazywa się „sceną bohatera”, ponieważ tutaj położysz większy nacisk na animacje i interakcje.
  • Ostatnia opcja oferuje znacznie bardziej klasyczny styl z uproszczonym przewijaniem obrazów od lewej do prawej w różnych animacjach.

Uwaga : Za każdym razem, gdy wybierzesz opcję, masz sekcję „Załaduj preset z tego typu suwakaKtóry oferuje zaawansowane odmiany wybranego typu suwaka.

Ł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]

zmiany-of-rodzaju-of-suwakiem

Nie będę w stanie wyjaśnić wszystkich wariantów, ale będziesz w stanie wyciągnąć wnioski z dostępnych zdjęć. Na przykład dla typu suwaka „ Standard Masz czwartą odmianę ” Thumbs dolny auto ”, Który pozwala utworzyć suwak z miniaturami u dołu i ma animację automatycznego przewijania.

kciuki-bottom self-slider-rewolucja-tutorial

Sekcja Układ slajdów

Suwak-layout-rewolucja-suwak

Ta sekcja umożliwia ustawienie układu suwaka. Więc możesz wyjść Rewolucja Slider »Automatycznie wybierz szerokości, które zastosuje do suwaka, wybierz zastosowanie pełnej szerokości do suwaka lub użyj suwaka w trybie pełnoekranowym.

W zależności od wybranej opcji suwak będzie różny na niektórych urządzeniach. Poniżej znajduje się sekcja konfiguracji siatki według urządzeń (Mobile, komputer stacjonarny itp..). Pamiętaj, że konfiguracja siatki umożliwia zmianę wewnętrznych marginesów każdego suwaka.

Czytaj także Wskazówki 6 dotyczące optymalizacji mobilnego projektu bloga

Na samym dole tej sekcji możesz włączyć widoczność przelewu, włączyć zachowanie wyglądu radia i ustawić minimalną wysokość.

Sekcja Dostosuj, Zbuduj i Implementuj

W tej sekcji nie ma opcji wtyczki. Oferuje szybkie linki do ważnych sekcji.

dostosować-build-Wdrożenie

Teraz przejdziemy do drugiej kolumny po prawej stronie.

Sekcja Ustawienia ogólne

W tej sekcji przedstawiono niektóre ustawienia, które zostaną zastosowane do suwaka. W ten sposób będziesz w stanie:

W zakładce „Pokaz slajdów”

  • Wyłącz suwak na estakadzie
  • Zatrzymaj suwak po określonej liczbie zwojów
  • Pokazuj slajdy losowo
  • Zapętl slajd
  • Wyłącz lub zatrzymaj suwak dla określonego rozmiaru urządzenia
  • Ostatnia opcja „Czekaj na revapi.revstart ()” nie będzie przydatna.

W zakładce „Błędy”

Możesz zdefiniować:

  • Wybieralny charakter warstw
  • Zdefiniuj identyfikator suwaka (odbywa się to automatycznie)
  • Minimalny czas między slajdami
  • Limit czasu przed inicjalizacją
  • Przejście pomiędzy szkiełkami
  • Czas trwania przejścia wyrażony w mikrosekundach
  • Rozmiar obrazu
  • Pozycja CSS obrazu tła
  • Powtarzanie obrazu tła, jeśli ten obraz nie jest wystarczająco duży
  • Aktywacja opcji wideo Muette Co pozwala zdefiniować typ animacji, pozycje w XY (tak, czego się uczysz, gdy musisz rysować funkcje matematyczne) i inne elementy.

Karta paska postępu

Wszystkie opcje w tej sekcji dotyczą paska postępu, który można włączyć i dostosować.

Karta 1er suwak

Ta sekcja umożliwia aktywację pierwszego alternatywnego slajdu. Umożliwi to „ suwak Aby załadować „ ślizgać się Najpierw do wyboru. Pamiętaj, że „ slajdy Są elementami, które można zidentyfikować.

Sekcja „Układ i grafika”

Układ i-wizualny

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]

Karta „Wygląd”

W tej sekcji możesz skonfigurować wygląd suwaka. W szczególności możesz zdefiniować wyświetlanie cienia pod suwakiem (bardzo przydatny, jeśli wybierzesz domyślny suwak, ze znacznym niskim marginesem).

Możesz także wyświetlić warstwę zewnętrzną pokrytą przezroczystymi kropkami (dzięki temu suwak będzie bardzo oryginalny, ale jeśli chcesz wyświetlić informacje, które trzeba dokładnie przeczytać, będziesz musiał przejść bez).

Następnie masz tło suwaka, wewnętrzny margines i obraz w tle (musisz tutaj wiedzieć, że obraz tła na tym poziomie będzie wyświetlany na wszystkich slajdy).

zakładka „Spinner”

Ta zakładka pozwala zdefiniować animację podczas ładowania suwaka, nic więcej.

karta „Mobilna”

Ta karta pozwala zarządzać wyświetlaniem suwaka na telefonie komórkowym. Musisz wiedzieć, że ruch mobilny jest ważny i dlatego nie powinieneś go lekceważyć. Będziesz miał możliwość ukrycia suwaka, jeśli wymiary telefonu komórkowego (szerokość) są mniejsze niż liczba, którą określiłeś (w pikselach).

zakładka „Pozycja”

Umożliwia to określenie położenia suwaka względem strony. Powiem raczej w odniesieniu do lokalizacji, w której się znajduje. Ta opcja nie musi być modyfikowana, ponieważ przypuszczam, że wszyscy chcemy, aby suwak był wyśrodkowany.

Sekcja „Nawigacja”

Ta sekcja umożliwia aktywację przycisków nawigacyjnych między slajdami na „suwaku”. Masz opcje nawigacji 6:

  • Strzały
  • pchły
  • tabs
  • miniatury
  • Wpływ przyziemienia na urządzenia mobilne
  • I nawigacja za pomocą klawiszy strzałek

Każda opcja, jeśli jest włączona, umożliwia konfigurację położenia elementów nawigacyjnych lub ich zasady działania (ustawienia domyślne są zwykle wystarczające).

konfiguracja-navigation-rewolucja-suwak

Sekcja „Ustawienia karuzeli”

Parametr-du sekcja karuzela-rewolucja-suwak

Ta sekcja pojawia się tylko po wybraniu typu „ karuzela Suwak I pozwala skonfigurować jego opcje. Będziesz mógł:

  • Włącz nieskończone przewijanie
  • Określ odstęp między slajdami, jeśli nie chcesz, aby slajdy się dotykały
  • Ustaw zaokrągloną ramkę w pikselach
  • Ustaw wysoki górny margines (padding-top)
  • Ustaw niski górny margines (Wypełnienie dnie)
  • Widoczna liczba elementów według „slajdu”
  • « Element strech„Umożliwia rozciągnięcie elementu, tak aby zajmował całą szerokość” suwak »

Bezpieczeństwo jest ważnym elementem dostępności Twojej witryny, a jedną z technik, która ochroni Cię przed atakiem lub poważnymi błędami, jest regularne tworzenie kopii zapasowej bloga. Odkryj nasze Wtyczki do tworzenia kopii zapasowych 5 WordPress

Sekcja „Paralaksa i 3D”

Tutaj możesz aktywować opcję „ 3D Na suwaku.

Sekcja problemów i rozwiązywania problemów

Ta sekcja umożliwia zarządzanie zgodnością ze starymi urządzeniami. Możesz uprościć suwak na „ IOS4 i Internet Explorer 8 ".

W przeciwnym razie możesz wybrać wyświetlanie alternatywnego obrazu, gdy przeglądarka nie obsługuje suwaka.

Sekcja Czcionki Google

Ta funkcja umożliwia zarządzanie pobranymi czcionkami Google i zastosowanie ich do suwaka.

Po zdefiniowaniu parametrów suwaka. Wszystko, co musisz zrobić, to kliknąć przycisk Zapisz.

save-a-slider-suwak rewolucja

Jeśli wtyczka WordPress Slider Revolution nie jest twoją ulubioną w tworzeniu suwaków na stronach WordPress, oto dwie alternatywy, które oferują podobne funkcje.

1. LayerSlider

LayerSlider to wysokiej klasy wtyczka WordPress do wszechstronnej animacji. Oferuje możliwość tworzenia pokazów slajdów i galerii obrazów z oszałamiającymi efektami, pięknie animowanych stron docelowych i blokowanych stron, a nawet kompletnej strony internetowej.Wtyczka Layerslider wordpress tworzy suwak 1

Jest to jedna z alternatyw mogących ściśle konkurować z Slider Revolution. Edytor wizualny typu „przeciągnij i upuść” umożliwia wszystkim korzystanie z niego w bardzo intuicyjny sposób. Nie są wymagane żadne umiejętności techniczne ani kodowania. Coraz większy wybór modeli do importu jest idealnym punktem wyjścia dla nowych projektów i obejmuje wszystkie typowe przypadki użycia. Są one wykonane starannie i można je łatwo dostosować do wszystkich potrzeb.

Doskonałe wsparcie i częste aktualizacje zapewniają maksymalne wykorzystanie możliwości zakupu.

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]

Idź dalej dzięki tej potężnej wtyczce WordPress, czytając ten artykuł Layer Slider: Wtyczka WordPress do utworzenia suwaka

Pobierz | Demo | hosting

2. Suwak WP1

WP1 Slider to wszechstronna wtyczka WordPress. Jest łatwy w użyciu i ma wszystkie przydatne funkcje, których potrzebujesz, aby stworzyć piękne pokazy slajdów. Większość wtyczek do suwaków jest zbyt techniczna i wymaga dużo czasu, aby je skonfigurować, ale WP1 Slider jest przeznaczony dla nieprogramiści i oferuje niesamowite opcje.Wtyczki WP1 slide pro wordpress tworzą pokazy slajdów ze strony internetowej

Wśród nich znajdziesz:wsparcie efektów Kenburn, 6 różne modele przejść suwakowychupowszechnienie skrótów, a cpoczęcie slajdów poprzez przeciąganie i upuszczanie, cszybkie nękanie i doskonałe pozycjonowanieUdostępnianie wsparcia w wielu sieciach społecznościowych, iintegracja filmów z YouTube i Vimeo, układ elektronicznyw pełni responsywny, wsparcie WooCommerce i inne.

Pobierz | Demo | hosting

Inne zalecane zasoby

Oto kilka zasobów, które zdecydowanie zalecamy:

Wnioski

Voila! To wszystko w przypadku tej prezentacji na temat konfiguracji wtyczki WordPress Suwak Revolution. Będziemy kontynuować w przyszłym samouczku, w którym omówimy projektowanie slajdów.

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 lub ten na Divi: najlepszy motyw WordPress wszechczasów.

Ale jeśli masz jakieś uwagi lub sugestie w tej sprawie, będzie mile widziana w sekcji komentarzy. Szczególnie podziel się tym artykułem na swój temat sieci społeczne.

Ten artykuł zawiera komentarze 29

  1. Witaj, stworzyłem 2 różne modele. Chcę teraz przejść od bieżącego kursora online. Naprawdę nie mogę tego zrobić. Czy ktoś może udzielić magicznej porady? Z góry dzięki!

  2. Stworzyłem slider4 i umieściłem 3 diaspozytywnie w tym suwaku. Ale na mojej stronie głównej rewolucja suwaka pokazuje tylko jeden slajd i nie wyświetla pozostałych. Wyświetla tylko pierwszy slajd. Na przykład, kiedy cofam ostatni slajd na pierwsze miejsce, rewolucja suwaka wyświetla go i pozostawia pozostałe

    1. Dobry wieczór,

      Czy możesz udostępnić zrzut ekranu swoich ustawień? Lub wyeksportuj slajd i przywróć ustawienia suwaka rewolucji.

  3. Witam,

    Chciałbym zrealizować dynamiczny suwak, czy miałbyś karty dotyczące realizacji suwaka z efektami przy przelocie myszy.

    dziękuję

  4. Witaj, pobrałem szablon suwaka, mogłem edytować teksty i obrazy, ale jestem na premii suwak rewolucji, jednak: możemy zobaczyć tekst „Rewolucja suwaka ...” + linki do ich sieci społecznościowych na slajd pff. I nie mogę znaleźć ani usunąć tego tekstu. Z góry dziękuję

  5. cześć Mam mały problem, kiedy zdaję sobie sprawę z suwaka i chcę go zmienić w tekstach mobilnych, które już dodałem na suwaku, nie pokazuje w suwaku mobilnym, dlaczego (w czasie modyfikacji) ???

  6. Witam,
    Mam problem z suwakiem Revolution. Nie mogę znaleźć rozwiązania, aby moje zdjęcia nie były przycinane w pionie.
    Czy musi mieć pole wyboru?
    Dziękuję za twój powrót
    Norbert

    1. Witam,

      Spróbuj wyłączyć wszystkie wtyczki, a jeśli problem będzie występować z powodu motywu, zmień go lub skontaktuj się ze sprzedawcą.

  7. Witam,
    w rewolucji slidera Chciałbym, aby mój slajd zaczął się tylko wtedy, gdy uruchomi go mysz lub scroll. Czy to możliwe?
    Który parametr w suwaku aktywuje się?
    Merci beaucoup.

    czy możemy zrobić oba, tj. uruchomić suwak z przejściem myszy / przewijania, a także wprowadzić opóźnienie inicjalizacji, które widziałem w ogólnych parametrach, aby uniknąć wszystkich możliwych przypadków jednocześnie i być pewnym odwiedzający witrynę widzi ten suwak

    merci beaucoup

  8. bonjour,

    w rewolucji slidera Chciałbym, aby mój slajd zaczął się tylko wtedy, gdy uruchomi go mysz lub scroll. Czy to możliwe?
    Który parametr w suwaku aktywuje się?
    Merci beaucoup.

    możemy zrobić oba, tj. uruchomić suwak z przejściem myszy / zwoju, a także wprowadzić opóźnienie inicjalizacji, które widziałem w ogólnych parametrach, aby chronić wszystkie możliwe przypadki jednocześnie i być na że odwiedzający stronę widzi ten suwak

  9. Witaj, dobry wieczór, mam wątpliwości.
    Mam kilka zdjęć w Slider Revolution i chcę je ukryć w wersji mobilnej minus pierwsza. Widziałem, że ta sama wtyczka ma możliwość ukrywania obrazów w różnych urządzeniach, ale problem polega tylko na tym, że ukrywa obraz, ponieważ nadal wykrywa, że ​​jest kilka elementów, ponieważ pasek czasu ładuje się i opuszcza biały ekran, gdy pierwsze skacze. Jak mogę naprawdę ukryć obrazy?

    Dziękuję bardzo

  10. Cześć, chciałem zapytać, jak umieścić kursor pod paskiem menu poziomego paska nawigacyjnego, tak jak to się dzieje w witrynie Apple.com, gdzie znajduje się menu nad i pod kursorem (menu wydaje się przezroczyste
    dziękuję
    Andrea

  11. Witam,

    Chcę utworzyć suwak zawierający obrazy 2 lub 3, na których są napisane cytaty. Moim problemem jest to, że kiedy piszę, cytat jest zbyt długi i przekracza zdjęcie, wynik nie pojawia się w całości. Jednak na całym obrazie jest miejsce. Jak to zrobić?

    Tytuł każdego slajdu jest obowiązkowy. Domyślnie wstawiam "cytat 1" i tak dalej. Ale tytuły są wyświetlane na slajdach ... Na przykład: "Cytuj 1" jest wyświetlany w małej prawej na moim pierwszym slajdzie. Jak uniknąć pojawiania się tytułów?

    Z góry dziękuję za odpowiedzi, pomógłbyś uczniom na wystawiony projekt!

  12. Witam,

    Mam problem z tym suwakiem i pomimo wielu badań nie znalazłem rozwiązania. Czy możesz mnie uratować?
    Skonfigurowałem suwak na mojej stronie głównej, to jest bezbłędne, to jest w porządku, Z WYJĄTKIEM tego, kiedy mysz jest na niej ustawiona, niemożliwe do przewinięcia. Muszę wyjąć mysz ze szkiełka, aby móc przewijać w dół (najwyraźniej działa). Martwi mnie to trochę, ponieważ obawiam się, że niektórzy ludzie nie rozumieją, że musisz zdjąć mysz ze slajdu, aby to zrobić .. (www.sarah-scaniglia.com). Przeszukałem wszystkie ustawienia, ale nie znalazłem ... i nie jestem ekspertem od internetu.

    Jeśli znajdziesz rozwiązanie, jesteś świetny

    1. Witam,

      czy próbowałeś tego?

      1. Wyłącz inne wtyczki oprócz Revolution Slider i sprawdź ponownie.

      2. Aktywuj domyślny motyw WordPress, a następnie przetestuj

      Dzięki temu dowiesz się, czy problem pochodzi z tematu, czy z powodu konfliktu z inną wtyczką.

      Sprawdź także, czy masz najnowszą wersję wtyczki.

  13. Witam,

    Czy możesz mi wytłumaczyć, jak zrobić "suwak" z pojedynczym slajdem w środku, ponieważ kiedy próbuję, wszystko znika na końcu animacji. Wprowadzam "brak transmisji" w "animacji slajdów", ale nic nie sprawia, że ​​...
    Z góry dziękuję za pomoc.

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
10 akcji
udział2
ćwierkanie1
Enregistrer7