Rzadko piszę recenzje wtyczek, a ja nigdy napisz o sliderach. Ale dzisiaj robię wyjątek dla Smart Slider 3.

To nie tylko Najlepsza Dostępna wtyczka slidera, to także przykład dla wszystkich darmowych i premium twórców wtyczek, w jaki sposób wtyczka powinna być wykonana.

Rzućmy więc okiem na to, dlaczego uważam, że Smart Slider 3 jest fantastyczny.

Uwaga: nie jest to recenzja płatna. Naprawdę podobał mi się plugin tak bardzo chciałem podzielić się z Tobą dlaczego. Dostępna jest darmowa wersja Smart Slider, która oferuje więcej funkcji niż większość wtyczek premium, więc jeśli jesteś po prostu zainteresowany darmową wersją Czytaj dalej – dam Ci znać, gdy przejdę do płatnych funkcji.

Ten artykuł jest w 100% darmowy!

Nigdy nie weźmiemy pieniędzy na promowanie innych, wszystko, co czytasz, jest prawdziwe. Dowiedz się więcej.

Czym jest Smart Slider 3?

Smart Slider 3 to wtyczka, której możesz użyć do tworzenia suwaków i umieszczania ich w dowolnym miejscu na swojej stronie. Możesz złożyć wszystko, co chcesz, dzięki potężnemu interfejsowi konstruktora, dopracowanym animacjom między slajdami i-w wersji pro – tworzyć animacje elementów warstwy, aby poruszać się w suwakach.

Widziałem wtyczki, które mogą to zrobić wcześniej, ale nie w ten sposób. Smart Slider wygląda jak szkic 3. Kiedy zacząłem używać programu Sketch zamiast Photoshopa, pomyślałem: „dlaczego wcześniej tego nie robiono?!”Inteligentny suwak wprowadza interfejs i łatwość obsługi szkicu (warstwy, Inspektor właściwości, podglądy) do tworzenia suwaka.

The slide editing interface
Interfejs edycji slajdów

Trochę O Sliderach

Zanim zagłębimy się głębiej w wtyczkę, muszę położyć podwaliny: nienawidzę suwaków.

Nienawidzę ich w ten sam sposób, w jaki niektórzy ludzie nienawidzą zdjęć z dzieci, zdjęć z jedzenia lub autoportretów: nie ma nic złego w robieniu tych zdjęć, ale ciągły ich atak może być przytłaczający.

Przeprowadzono wiele badań nad suwakami i tym, jak są one szkodliwe dla konwersji i SEO. Myślę, że największym problemem jest to, że prawie wszystkie motywy premium mają suwak na pierwszej stronie. Jest to świetny eye candy, więc gdy ktoś kupuje motyw, po prostu zaczyna go używać bez zastanowienia, co jest problemem, ponieważ jest tylko jedna rzecz gorsza niż niepotrzebny suwak, a to źle wykonany suwak.

Myślę, że niskiej jakości suwaki są dużym czynnikiem przyczyniającym się do niższych konwersji. Zauważyłem w moim własnym zachowaniu przeglądania, że zostałem dłużej na stronie internetowej, aby wyświetlić zawartość wizualnie uderzającego suwaka.

W końcu muszę przyznać, że myślę, że slidery mają swoje miejsce. Jeśli używasz ich mądrze (bez kalambura), mogą być cennym zasobem dla Twojej witryny. Jeśli jednak użyjesz ich słabo, zmniejszą one twoje konwersje i zaszkodzą SEO-tak jak dowolny inny element na twojej stronie.

Ponadto inteligentny suwak pozwala tworzyć wizualizacje, które nie są slajdami można utworzyć pojedynczy suwak z animacjami, co pozwala tworzyć elementy, które wyglądają jak statyczne obrazy z małymi subtelnymi animacjami, aby przyciągnąć wzrok odwiedzającego.

Trochę O Wtyczkach Premium

Teraz, gdy już odpowiedziałem większość mojego gniewu na suwaki, pozwól mi zwolnić resztki na wtyczkach premium.

Zauważyłem, że wiele dostępnych wtyczek premium po prostu nie jest dobre – nie, jeśli wziąć pod uwagę, że ludzie zarabiają z nimi pieniądze. Jest to szczególnie prawdziwe w przypadku wtyczki, która zajmuje się niezwykle trudnymi koncepcjami interfejsu Użytkownika, takimi jak suwaki.

Autorzy wtyczek najwyraźniej nie dbają o wrażenia użytkownika, a wszystko, czego chcą, to szybka złotówka. Kupując aplikację premium, taką jak Evernote lub Sketch, oczekujesz interfejsu i dodatkowych funkcji (takich jak system pomocy, zarządzanie ustawieniami itp.) być tak dopracowany jak reszta produktu-oczekujesz jakości.

Inteligentny suwak również to zapewnia. Od początkowego filmu wprowadzającego do strony internetowej, jej ikony, szablonów, systemu pomocy i ogólnego interfejsu użytkownika, widać, że ktoś usiadł i pomyślał o tym wszystkim i zastosował ślinę i lakier potrzebne do stworzenia odpowiedniego produktu,w przeciwieństwie do czegoś, co wygląda jak twój sąsiad położył go wczoraj.

Tworzenie suwaka

Na początku powitamy was suwakami po lewej stronie i pomocnymi zasobami po prawej stronie. Ten ekran pokazuje już dbałość o szczegóły, które lubię o tej wtyczce. Możesz zamówić suwaki według nazwy lub daty utworzenia. Możesz również wybrać kilka poręcznych małych akcji po prawej stronie, ale główna akcja jest znacznie większa i bardziej zauważalna z przyjemnym designem.

Zauważ, że wszystkie przyciski akcji używane do dodania suwaka są zielone, przyciski akcji drugorzędne znaczenie są niebieskie, a pozostałe są szare. Bardzo intuicyjne.

The initial view
Widok początkowy

Dodawanie przykładowego suwaka

Jeśli masz darmową wersję, będziesz miał dostęp do czterech darmowych suwaków. Jeśli masz wersję pro, otrzymasz dostęp do biblioteki ponad 100 wstępnie zbudowanych suwaków, które mogą dać ci świetny punkt wyjścia.

Sample Sliders
Kilka przykładowych suwaków

Suwaki Od Podstaw

Jeśli chcesz rozpocząć nowy projekt, zacznij od wybrania szablonu. Darmowi użytkownicy mają dostęp do czterech, podczas gdy użytkownicy pro mają do dyspozycji 11.

Create a slider
Tworzenie suwaka

Po utworzeniu można rozpocząć, ustawiając Ogólne opcje i dodając slajdy. Prawdopodobnie będziesz chciał najpierw pobawić się ustawieniami ogólnymi, a następnie zmodyfikować je w razie potrzeby po utworzeniu suwaków.

Opcje Suwaka

Dwie sekcje z kartami dają dostęp do wielu opcji. Pierwsza sekcja ustawia rzeczywiste ustawienia, druga koncentruje się na wizualizacjach.

Pierwsza sekcja pozwala na zmianę ustawień ogólnych, rozmiaru, autoplay, animacji warstw, optymalizacji, ustawień zaawansowanych i innych.

Smart Slider General Settings
Ustawienia Ogólne Smart Slider

Druga sekcja daje Ci kontrolę nad elementami interfejsu użytkownika utworzonymi przez suwak. Strzałki, kule, sterowanie autoplay, miniatury, cienie i wiele innych.

Smart Slider Visual Settings
Inteligentne Ustawienia wizualne suwaka

Konfiguracja Slajdów

Większość czasu spędzisz w edytorze slajdów, składając slajd. Podczas gdy inteligentny suwak jest responsywny, interfejs jest najlepszy w wysokich rozdzielczościach. Twoje warstwy zostaną wyświetlone po lewej stronie.

Najedź kursorem na dowolną warstwę, aby zobaczyć ją podświetloną w obszarze podglądu. Kliknij warstwę, aby wyświetlić jej szczegóły w panelu poniżej, gdzie będziesz mógł modyfikować szczegóły elementu, animacje (dla użytkowników pro) i ustawienia warstwy.

Za pomocą edytora wizualnego można zmienić położenie warstwy, przeciągając i upuszczając. Oczywiście możesz osiągnąć ten sam wynik, korzystając z opcji pozycjonowania w zakładce warstwy. Kolejny mały szczegół: cofanie z cmd + z działa dobrze-miły akcent.

Aby dodać nowy element, po prostu kliknij przyciski u góry. Darmowi użytkownicy mogą wybierać spośród sześciu elementów: obrazu, nagłówka, tekstu, przycisku, Vimeo i Youtube. Użytkownicy Pro mają dodatkowe dziewięć elementów do wyboru: lista, ikona, podpis, Przejście, iframe, wideo, HTML i obszar.

The Slide Editor
Edytor Slajdów

Kliknięcie elementu spowoduje dodanie go do listy warstw i podglądu. Rozpocznij edycję od razu i zobacz wszystko w czasie rzeczywistym w podglądzie. Każdy element ma kilka dodatkowych opcji, które możesz dostosować do swoich potrzeb. To kolejny obszar, w którym świeci inteligentny suwak. Zapoznaj się z ustawieniami czcionki dla elementu:

Font Settings
Ustawienia Czcionek

Możesz nie tylko ustawić kolory, wysokości linii, odstępy i inne elementy, ale także wyświetlić podgląd, dodać dodatkowy CSS i wybrać ustawienia wstępne po prawej stronie. Możesz nawet zapisać swoje ustawienia jako nowe ustawienie wstępne, co zminimalizuje czas potrzebny na elementy, jeśli masz kilka podobnych.

Nad obszarem podglądu można znaleźć ustawienia samego slajdu. Oprócz tła, animacji i innych opcji można ustawić nazwę, opis i link.

Sam obszar podglądu ma kilka przydatnych elementów sterujących. Możesz włączać/wyłączać przyciąganie, wyświetlać ciemne tło, ustawiać wyrównania, ukrywać warstwy i nie tylko. Jeszcze bardziej przydatne są elementy sterujące do wyświetlania slajdu w widoku pulpitu, tabletu i telefonu komórkowego. Nawiasem mówiąc, kliknij prawym przyciskiem myszy dowolny element w podglądzie, aby usunąć/skopiować / zduplikować warstwę.

Animowanie Warstw

Wersja pro oferuje zaawansowane opcje animacji, aby przenieść warstwy. Wynik jest najlepiej wyświetlany na jednym z suwaków na stronie głównej Smart Slider.

Smart Slider Animations
Animacje Smart Slider

Podczas tworzenia animacji możesz ustawić animacje in/out / loop i obsługiwać takie zdarzenia jak kliknięcie, wejście myszą, opuszczenie myszy, odtwarzanie i inne. Możesz umieścić animacje na osi czasu, która obsługuje przeciąganie i upuszczanie.

To zasadniczo zamienia inteligentny suwak w coś podobnego do edytora wideo. Proces jest zasadniczo taki sam, umieszczasz zdarzenia na osi czasu, która mówi ci, kiedy Zdarzenie się zaczyna, jak długo trwa i kiedy się kończy.

Animowanie warstw to złożony proces, ale interfejs Smart Sliders sprawia, że jest to płynny i przyjemny proces.

Animation Timeline
Oś Czasu Animacji

Po zakończeniu każdy suwak można wstawić za pomocą krótkiego kodu, za pomocą ikony inteligentnego suwaka w edytorze postów lub za pomocą kodu PHP. Wszystko, czego potrzebujesz, aby z nich skorzystać, zobaczysz powyżej opcji ogólnych w suwaku.

Dlaczego Smart Slider Jest Tak Świetny

Inteligentny suwak jest teraz w moich trzech ulubionych wtyczek. Wielkie wezwanie, ale jest to najlepszy przykład tego, jak powinna wyglądać wtyczka premium.

Posiada interfejs użytkownika, który został oczywiście podzielony testowany i informowany przez wejście użytkownika. Elementy takie jak pola wyboru, przyciski radiowe, selektory i inne pola nie wydają się nie na miejscu; całe doświadczenie jest płynne i ujednolicone.

Proces aktywacji pro jest niezwykle prosty. Nie musisz nawet wchodzić na specjalną stronę aktywacyjną. Po raz pierwszy natknąłem się na potrzebę aktywacji, gdy chciałem zaimportować suwak testowy. Mam małe okienko, które mówi mi, co jest co z polem tekstowym. Wkleiłem kod, nacisnąłem ” OK ” i został aktywowany i zostałem przeniesiony do suwaków testowych.

Innym niesamowitym aspektem wtyczki jest szybkość jego JavaScript. Mówiąc to, tworzenie JavaScript, który pozwala obsługiwać wszystko, od tworzenia suwaka po animację, wyświetlanie go i podgląd na żywo, jest złożone, to rażące niedopowiedzenie. Zapewnienie interakcji użytkownika w panelu administracyjnym i wyświetlaczu slajdów w interfejsie to nic innego jak cud.

Wrapping Up

Inteligentny suwak jest tym, co chcę, aby wszystkie wtyczki były, i to, co myślę, że wszystkie wtyczki powinny aspirować do bycia. Czy nie przeszkadza ci, że aplikacja Airbnb lub Evernote są sub-par tylko dlatego, że była darmowa? Wiem, że nie. wydaje się, wreszcie, rozwój wtyczek WordPress osiąga Jakość, że aplikacje desktopowe i mobilne zepsuły nas.

Jeśli chcesz utworzyć suwaki lub chcesz mieć na swojej stronie pojedynczy obraz z subtelnymi animacjami, Smart Slider 3 zapewnia rozwiązanie, bez względu na to, co chcesz osiągnąć. Mogę serdecznie polecić darmową wersję. Zapewnia już więcej funkcjonalności niż jakakolwiek inna wtyczka slidera – nawet wiele premium.

Jeśli potrzebujesz mocy wersji pro lub chcesz wspierać rozwój niesamowitego oprogramowania, spójrz na wersję pro, nie będziesz rozczarowany.

The Good

  • Niesamowity interfejs
  • Darmowa wersja zawiera wiele funkcji
  • Łatwy w obsłudze
  • Płynne doświadczenie administratora

The Bad

  • Backspace może działać, aby usunąć elementy
  • Animacje warstw mają krzywą uczenia się

Werdykt WPMU DEV

  • Cena:
  • Jakość I Użyteczność:
  • Osiągi:
  • Piękno I Nowoczesność:
  • Ogólnie:
    Odwiedź Stronę
Używałeś Smart Slider 3? Zgadzasz się z moją recenzją? A może uważasz, że istnieją lepsze wtyczki suwaka? Daj mi znać, co myślisz w komentarzach poniżej.

Tagi:

You May Also Like

Jak naprawić nieprawidłowy błąd JSON w WordPress (Przewodnik dla początkujących)

W artykule: Co powoduje błąd „nieprawidłowa odpowiedź JSON” w WordPress?1. Sprawdź adresy…

Jak zmienić kolor linku w WordPress (poradnik dla początkujących)

W artykule: Dlaczego Linki Są Ważne?Jak dodawać linki w postach i stronach…

WordPress Pingbacks & Trackbacks: Ultimate A-Z Guide

W artykule: Czym są Pingbacks i Trackbacks? Plus, dlaczego są ważneCzym Są…

Jak naprawić błąd krytyczny w WordPress (krok po kroku)

W artykule: Co To jest błąd krytyczny w WordPress?Co powoduje krytyczny błąd…