Przejdź do głównej treści

Slider Revolution: konfigurowanie slidera na WordPress

Divi: najłatwiejszy w użyciu motyw WordPress

Divi: Najlepszy motyw WordPress wszechczasów!

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

Chcesz skonfigurować wtyczkę WordPress Slider Revolution?

Od początku tej serii samouczków poświęconych 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: Guide & Tuto

To powiedziawszy, dowiedzmy się, czym jest suwak.

Co to jest slider w praktyce?

Suwak to składnik HTML. Tak wiem, powiedziawszy w ten sposób, nie przynosi to większych korzyści. Tak więc suwak to funkcja, która pozwala wyświetlać różne informacje w pętli (lub nie). Te informacje są pogrupowane według „ ślizgać się ”, który jest bytem„ suwaka ”i który może składać się z obrazów, tekstów wideo, linków itp.Slider Revolution - wtyczka WordPress Slider Revolution

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 stworzyłeś 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.

Stworzenie slidera: 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 konfiguracyjny suwaka może onieśmielać, ale jeśli cofniesz się, lepiej zrozumiesz jego funkcjonalność. Możesz zauważyć, że ten interfejs składa się z dwóch sekcji. Pierwsza po lewej składa się z 5 różnych obszarów, a druga po prawej składa się z 6 małych obszarów. Tuż powyżej znajduje się pasek narzędzi, który umożliwia:

  • 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 manipuluje wieloma obrazami, co może spowolnić ładowanie witryny. Odkryć Dlaczego musisz zacząć optymalizować swój blog WordPress według obrazów

w sekcji „Źródło treści”

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

Ta sekcja umożliwia skonfigurowanie źródła suwaka. Rzeczywiście, tutaj możesz zdecydować się na stworzenie:

  • 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 "Aktywny.

Sekcja Slider Title & Shortcode

Prawdopodobnie zgadłeś. Ta sekcja pozwala zdefiniować tytuł slidera i skrócony kod, który będzie mu towarzyszył (nic zbyt rakietowego).

tytuł i shortcode-du suwak

Sekcja „Wybierz typ suwaka”

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

Ta sekcja umożliwia zdefiniowanie podstawowej struktury suwaka. Rzeczywiście masz do dyspozycji 3 opcje do wyboru, z których możesz:

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

  • 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 dynamicznego i interaktywnego stylu, bez przycisku nawigacyjnego i znacznie bardziej imponującego niż poprzednia opcja. Ta opcja jest nazywana „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 dość zróżnicowanych 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.

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 slajdu”

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, buduj i wdrażaj”

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. Oto jak możesz:

Na karcie „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 przyda Ci się.

W zakładce „Usterki”

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 wizualizacja”

Układ i-wizualny

Karta „Wygląd”

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]

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.

kartę „Urządzenia przenośne”

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ładkę „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 twoim „suwaku”. Masz 6 opcji nawigacji:

  • 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 umożliwia konfigurację jego opcji. Będziesz w stanie:

  • 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)
  • Liczba elementów widocznych na „slajdzie”
  • « Element strech", Pozwala rozciągnąć element tak, aby zajmował całą szerokość" suwak »

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

Sekcja „Parallax & 3D”

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

Sekcja „Problem & Handling”

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 pozwala zarządzać pobranymi czcionkami Google Fonts i zastosować je do suwaka.

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

save-a-slider-suwak rewolucja

Jeśli wtyczka WordPress Slider Revolution nie jest twoją ulubioną, jeśli chodzi o tworzenie suwaków w witrynach WordPress, tutaj oferujemy dwie alternatywy, które mogą oferować podobną funkcjonalność.

1. LayerSlider

LayerSlider to wysokiej jakości uniwersalna wtyczka do animacji WordPress. Daje możliwość tworzenia pokazów slajdów i galerii obrazów z oszałamiającymi efektami, pięknie animowanymi stronami docelowymi i blokami stron, a nawet pełną stroną internetową.Wtyczka Layerslider wordpress tworzy suwak 1

Jest to jedna z alternatyw zdolnych do ścisłej konkurencji ze Slider Revolution. Jego wizualny edytor typu „przeciągnij i upuść” sprawia, że ​​korzystanie z niego jest bardzo intuicyjne. Nie są wymagane żadne umiejętności techniczne ani kodowanie. Stale rosnący 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.

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

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]

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 pozycjonowanieobsługa udostępniania w kilku 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

Zachęcamy również do zapoznania się z poniższymi zasobami, aby przejść dalej w zakresie kontroli nad witryną i blogiem.

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ędą one mile widziane w sekcji komentarzy. Szczególnie udostępnij ten artykuł na swój inny sieci społeczne.

Ten artykuł zawiera komentarze 29

  1. Witam, stworzyłem 2 różne modele. Chcę teraz przełączyć się z mojego obecnego kursora online. Naprawdę nie mogę tego zrobić. Czy ktoś może udzielić magicznej rady? Z góry dziękuję!

  2. Stworzyłem slider4 i umieściłem w nim 3 diaspozytywne. Ale na mojej stronie głównej slider Revolution pokazuje tylko jeden slajd i nie pokazuje reszty. Wyświetla tylko pierwszy slajd. Kiedy przykładam ostatni slajd na pierwszym miejscu, suwak obrót wyświetla ten ostatni i pozostawia pozostałe

    1. Dobry wieczór,

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

  3. Witam,

    Chciałbym zrobić dynamiczny slider, czy macie jakieś pliki dotyczące wykonania slidera z efektami najechania myszką.

    dziękuję

  4. Witam, ściągnąłem szablon slidera, mogłem modyfikować teksty i obrazy, jestem na slider revolution premium, jednak: widzimy tekst "a Slider Revolution…" + linki do ich sieci społecznościowych na slajd pff. I nie mogę znaleźć ani usunąć tego tekstu. z góry dziękuję

  5. witam mam mały problem kiedy robię slider i chcę go zmodyfikować na telefonie komórkowym teksty które już dodałem do slidera nie pojawiają się w sliderze mobilnym dlaczego (przy modyfikacji) ???

  6. Witam,
    Mam problem z Revolution Slider. 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ć jedno i drugie, tj. uruchomić suwak za pomocą myszy / przewijania, a także ustawić opóźnienie inicjalizacji, które widziałem w ogólnych parametrach, aby zająć się wszystkimi możliwymi przypadkami jednocześnie i mieć pewność 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.

    Czy możemy zrobić jedno i drugie, tj. Uruchomić suwak myszką / scrollem, a także ustawić opóźnienie inicjalizacji, które widziałem w ogólnych parametrach, aby zająć się wszystkimi możliwymi przypadkami jednocześnie i mieć pewność że odwiedzający stronę widzi ten suwak

  9. Witam, dobry wieczór, mam wątpliwości.
    Mam kilka obrazków w rewolucji Slidera i chcę je ukryć w wersji mobilnej bez pierwszego. Widziałem, że ta sama wtyczka ma możliwość ukrywania żądanych obrazów na różnych urządzeniach, ale problem polega na tym, że ukrywa tylko obraz, ponieważ ciągle wykrywa, że ​​jest wiele elementów, ponieważ pasek czas nadal się ładuje i pozostawia ekran pusty, gdy pierwszy skacze. Jak naprawdę mogę 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ę zrobić suwak zawierający 2 lub 3 obrazy, na których są zapisane cytaty. Mój problem polega na tym, że kiedy piszę, cytat jest za długi i wystaje ze zdjęcia, więc nie pojawia się w całości. Jednak na całym obrazie jest miejsce. Jak zrobić?

    Wymagany jest tytuł każdego slajdu. Domyślnie umieszczam „cytat 1” i tak dalej. Ale tytuły są wyświetlane na slajdach… Na przykład „Cytat 1” jest wyświetlany w małym prawym rogu na moim pierwszym slajdzie. Jak mogę zapobiec wyświetlaniu tytułów?

    Z góry dziękuję za odpowiedzi, pomożesz uczniom w projekcie z korepetytorem!

  12. Witam,

    Mam mały problem z tym suwakiem i mimo wielu poszukiwań nie znalazłem rozwiązania. Może mógłbyś mnie uratować? 😉
    Skonfigurowałem suwak na mojej stronie głównej, jest nienaganny, jest bardzo dobry, Z wyjątkiem tego, że gdy mysz jest na nim ustawiona, nie można przewijać. Muszę wyjąć myszkę ze slajdu, żeby móc przewijać w dół (w górę najwyraźniej działa). Trochę mi to przeszkadza, bo obawiam się, że niektórzy ludzie nie rozumieją, że aby to zrobić, trzeba zdjąć mysz ze slajdu ... (www.sarah-scaniglia.com). Przeszukałem wszystkie ustawienia, ale nie mogłem znaleźć… i nie jestem ekspertem internetowym.

    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 dotyczy motywu, czy konfliktu z inną wtyczką.

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

  13. Witam,

    Czy możesz mi wyjaśnić, jak zrobić „Slider” z tylko jednym slajdem w środku, ponieważ kiedy próbuję, wszystko znika na końcu animacji. Umieściłem „brak transmisji” w „animacji slajdów”, ale nic nie pomaga ...
    Z góry dziękuję za pomoc.

Zostaw komentarz

Twoj adres e-mail nie bedzie opublikowany. Wymagane pola są oznaczone *

Powrót do góry
Ogłoszenie: Undefined offset: 0 w /home2/voirplu/public_html/wp-content/plugins/UltimateTetutesse-master/public/partials/shared-footer.php w wierszu 17