Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Puchar WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Jak stworzyć oszałamiającą prezentację produktu za pomocą SlideDeck 2 w WordPress

Suwaki treści są obecnie powszechne w WordPress, ale zazwyczaj są używane tylko w bardzo ograniczonym zakresie – zazwyczaj znajdują się na stronach głównych, w celu prezentacji najnowszych wpisów lub galerii obrazków. Rozwija się nowy trend, w którym witryny internetowe WordPress wykorzystują potencjał i elastyczność pokazów slajdów do opowiadania fascynujących relacji, które motywują odwiedzających do działania – czyli w formie wycieczek po produktach.

Wykorzystanie pokazu slajdów do prezentacji Twojego produktu na WordPressie może pomóc Ci lepiej sprzedawać produkty, prowadząc użytkowników przez kluczowe punkty w ich własnym tempie – jest to lepsze niż zwykłe użycie filmu, ponieważ mogą oni przeskakiwać do tyłu / do przodu do określonych, zdefiniowanych punktów, zamiast zgadywać kod czasowy. Ponadto, użycie pokazu slajdów w ten sposób wykorzystuje wszystkie rodzaje mediów internetowych – co oznacza, że możesz dołączyć interaktywne treści do slajdów, zamiast zmuszać użytkownika do biernego oglądania filmu.

Do niedawna, aby stworzyć cokolwiek poza najprostszymi pokazami slajdów z treścią, trzeba było umieć kodować, ale korzystamy z niesamowitej wtyczki do pokazów slajdów o nazwie SlideDeck 2, która to zmienia.

Ta potężna wtyczka umożliwia bardzo proste tworzenie niesamowitych pokazów slajdów w ciągu kilku minut, bez konieczności pisania ani jednej linijki kodu. W poprzednim wpisie omówiliśmy jedną z innych solidnych funkcji SlideDeck 2, ale ich najnowsza aktualizacja włącza możliwość tworzenia własnych pokazów slajdów i dostosowywania treści każdego slajdu, aby tworzyć atrakcyjne prezentacje, które motywują twoich odwiedzających do działania. Przygotowaliśmy ten krótki przewodnik, aby pokazać ci, jak stworzyć słodką prezentację produktu dla twojej witryny WordPress za pomocą SlideDeck 2.

Zakup i instalacja wtyczki

Po pierwsze: Slajdy z własnymi treściami to funkcja premium w SlideDeck 2, więc będziesz musiał ją kupić, aby używać jej na twojej witrynie. Zalecamy przejście do witryny internetowej SlideDeck i zakup wtyczki – jak na możliwości, które zawiera, jest dość tania i można ją łatwo zaktualizować, aby uzyskać lepsze funkcje i używać jej na większej liczbie witryn.

Aby odblokować funkcję konfiguratora własnych treści, należy zakupić pakiet Professional lub Developer, a następnie zainstalować wtyczkę oraz „Addon”, który odblokowuje dodatkowe funkcje.

Aby zainstalować wtyczkę, możesz skorzystać z naszego przydatnego przewodnika krok po kroku dotyczącego instalacji wtyczki WordPress.

Terminologia

Zanim zaczniemy, powinniśmy wyjaśnić kilka taksonomii:

  • Custom Content SlideDecks – Custom Content SlideDecks pozwalają budować twoje pokazy slajdów po jednym slajdzie na raz. Są bardziej odpowiednie do wizualnego opowiadania historii lub jeśli masz konkretne działanie, które chcesz, aby użytkownicy podjęli – w tej instancji jest to wycieczka po produkcie. Jeśli chcesz tworzyć pokazy slajdów przy użyciu zewnętrznych źródeł treści, takich jak Flickr lub YouTube, stworzyliśmy osobny przewodnik specjalnie dla Dynamic Source SlideDecks.
    • Rodzaj slajdu – Istnieją 4 różne rodzaje slajdów, z których każdy jest przeznaczony do obsługi określonego rodzaju treści: obrazek, film, tekst i HTML.
    • Soczewki – soczewki są jak motywy dla twojego pokazu slajdów. Kontrolują one wygląd i zachowanie twojego slidera, a także sposób prezentacji treści na stronie. Podobnie jak w przypadku motywów WordPress, zastosowanie innego obiektywu do twojej treści zajmuje tylko kilka sekund, a może przynieść znacznie inny wygląd i sposób działania twojego slidera.

    Ok, skoro żargon mamy już za sobą, włącz SlideDeck 2 i zaczynajmy!

    Tworzenie własnej treści SlideDeck

    Pokażemy ci, jak stworzyć pokaz slajdów, który łączy w sobie cztery różne rodzaje treści, korzystając z funkcji Custom Content w SlideDeck. Zacznij od kliknięcia „Zarządzaj”, aby przejść do głównego kokpitu. Ten ekran umożliwia tworzenie nowych SlideDecków i sortowanie twoich istniejących.

    SlideDeck Manage Screen for Custom SlideDeck

    W sekcji Własna treść kliknij niebieski przycisk „Utwórz SlideDeck”. Zostaniesz przeniesiony do ekranu edytora treści własnych, aby utworzyć swój pierwszy slajd. Po przejściu do Edytora treści własnych, zacznij od nadania nazwy twojemu SlideDeck. Zauważysz, że twój pierwszy slajd został utworzony i masz do wyboru trzy lub cztery różne rodzaje slajdów, w zależności od używanego pakietu SlideDeck 2 – użytkownicy pakietu Professional będą mieli dostęp do obrazów, filmów i tekstów; użytkownicy pakietu Developer będą mogli wybrać rodzaj slajdu HTML oprócz tych trzech.

    SlideDeck Custom Slide Type

    Pod tym wysuwanym menu znajduje się jedna z najbardziej unikatowych funkcji SlideDeck 2 – okno podglądu na żywo (jest to jeden z powodów, dla których SlideDeck 2 jest zalecaną wtyczką WordPress w WPBeginner’s Blueprint). Tutaj możesz zobaczyć, jak twój pokaz slajdów aktualizuje się w czasie rzeczywistym podczas jego edycji.

    Zaczynamy od slajdu z obrazkiem

    Zacznijmy od slajdu z obrazkiem – czegoś, co da naszym gościom szybki i wizualnie wciągający przegląd trasy, którą zamierzają odbyć. Kliknij na rodzaj slajdu „Image Slide”. Menu wysuwane zostanie odświeżone, aby pokazać wszystkie opcje związane z tworzeniem slajdu z obrazkiem:

    SlideDeck Image Slide

    Upload an image | Specify a URL – Wybierz, czy chcesz przesłać twój obrazek do WordPress Media Gallery, czy po prostu wklej adres URL, jeśli jest hostowany gdzie indziej.
    Caption | Body Text | None – Powiedz SlideDeck, czy chcesz, aby podpis tekstowy nakładał się na obrazek, czy też chcesz, aby towarzyszył mu krótki tekst. Alternatywnie można po prostu wyświetlić cały obrazek bez powiązanego tekstu.
    Odnośnik do slajdu – Określ adres URL, na który użytkownik ma przejść, jeśli kliknie w dowolnym miejscu slajdu.
    Tytuł – nadaj slajdowi tytuł, który będzie wyświetlany w obszarze podpisu lub tekstu podstawowego.
    Opis – wpisz opis slajdu. Możesz tu wpisz tekst sformatowany!
    Pozycja podpisu – określa pozycję nakładki tekstowej na slajdzie. Podpisy mogą znajdować się na górze/dole, a tekst główny może znajdować się po lewej/prawej stronie.

    Po skonfigurowaniu twojego slajdu tak, jak chcesz, po prostu naciśnij przycisk „Zastosuj”, a obszar podglądu na żywo zostanie odświeżony, aby wyświetlić twój pierwszy slajd. W naszym przykładzie utworzyliśmy slajd, określając adres URL, z podpisem na dole i bez odnośnika do slajdu.

    SlideDeck Image Slidetype Example

    W ten sposób utworzyliśmy pierwszy slajd z treścią własną – proste, prawda? Teraz dodamy drugi, aby dodać film pokazujący demo naszego produktu.

    Tworzenie slajdu z filmem

    SlideDeck 2 obsługuje treści wideo z trzech źródeł – YouTube, Vimeo i Dailymotion – co oznacza, że wszystko, co musimy zrobić, to przesłać film demonstracyjny naszego produktu do jednego z tych serwisów, a następnie wkleić adres URL do strony filmu i nacisnąć „Aktualizuj”.

    SlideDeck Video Slide Type

    Podobnie jak w przypadku rodzaju slajdu Imagely, możesz dodać tytuł i krótki podpis lub akapit tekstu, aby dać odwiedzającym wyobrażenie o tym, co zobaczą w twoim filmie. Domyślnie SlideDeck 2 pobierze treść podpisu, którą masz na swojej stronie YouTube/Vimeo/Dailymotion, ale możesz ją dostosować do swoich potrzeb związanych z prezentacją produktu.

    Tak jak poprzednio, naciśnij Zastosuj i szybko kliknij pokaz slajdów – teraz będziesz mógł przechodzić między twoimi obrazkami i filmami.

    Tworzenie slajdu tekstowego

    Czasami potrzebne jest miejsce na tekst – na przykład, aby wyświetlić listę funkcji lub udostępnić cytat z pochlebnej recenzji produktu. W takich przypadkach możemy użyć rodzaju slajdu Tekst.

    SlideDeck Text Slide Type

    Jest to bardzo prosty rodzaj slajdu, z kilkoma opcjami do rozważenia:

    Układ – Podstawowy układ po prostu umieszcza tytuł na górze slajdu, a tekst przepływa pod nim. Wielokolumnowy zapewnia bardziej gazetowy format, automatycznie zawijając tekst w dwie kolumny. Cytowanie blokowe pozwala wyróżnić krótki fragment kodu dużą, pogrubioną typografią. Tak jak poprzednio, naciśnij Zastosuj, aby dodać slajd do twojego SlideDeck.

    Reorganizacja slajdów

    W tym momencie możesz pomyśleć, że chciałbyś poprowadzić slajd z filmem zamiast obrazka, aby użytkownicy mogli od razu wejść w interakcję i zaangażować się w wycieczkę. SlideDeck pozwala to zrobić natychmiast – w obszarze nagłówka slajdu kliknij i przeciągnij slajd z filmem, a następnie upuść go w świecącej przestrzeni po lewej stronie slajdu z obrazkiem. Super proste!

    SlideDeck Drag and Drop Slides

    Idąc dalej – używając rodzaju slajdu HTML

    Rodzaj slajdu HTML to potężny dodatek do pakietu deweloperskiego SlideDeck 2, który pozwala wpisz twój własny kod HTML do slajdu. Jest to idealne rozwiązanie do tworzenia bardziej złożonych układów twoich treści lub dodawania bardziej zaawansowanych interakcji do pokazu slajdów. Możesz na przykład osadzać formularz zapisu, aby klienci mogli zdecydować się na otrzymywanie biuletynu e-mail pod koniec prezentacji produktu – potężne wezwanie do działania, jeśli kiedykolwiek istniało!

    Wybierz rodzaj slajdu HTML, aby wyświetlić edytor HTML w wysuwanym menu.

    SlideDeck HTML Slide

    W polu Wstaw HTML możesz wkleić swój własny kod. Zauważysz, że automatycznie kodowane są kolorami różne tagi, aby upewnić się, że są one poprawnie skonstruowane. Należy zwrócić uwagę na kilka ważnych kwestii:

    • Między tagami <style></style> można umieścić reguły stylów CSS dla treści slajdu, które zostaną zastosowane do wszystkich slajdów w SlideDeck
    • Ponieważ podgląd na żywo SlideDeck nie jest w stanie przewidzieć, w jaki sposób style twojego motywu mogą wchodzić w interakcje z pokazem slajdów treści, w przypadku złożonej stylizacji dokładniejszy podgląd uzyskasz, jeśli zobaczysz go na stronie, na której zamierzasz opublikować swój SlideDeck.

    Po wprowadzeniu kodu kliknij Zastosuj, a slajd zostanie dodany do rotacji.

    Konfiguracja obiektywu

    Stworzyłeś już swoją pierwszą własną treść SlideDeck! Poświęć kilka minut na przejrzenie slajdów w podglądzie na żywo i ciesz się dobrze wykonaną pracą.

    Teraz nadszedł czas, aby nadać Twojej witrynie spójny wygląd poprzez skonfigurowanie Obiektywu. SlideDeck zawiera ogromną liczbę opcji kontrolowania wyglądu twojej nowej prezentacji produktu poprzez dostosowanie Lens.

    Zapisywanie i publikowanie twojego SlideDeck

    Niesamowita treść? Sprawdzone. Słodki motyw wybrany i dostosowany do własnych potrzeb? Sprawdzone. Wygląda na to, że jesteś gotowy, aby opublikować swoją nową wycieczkę po produktach i przekształcić odwiedzających w klientów!

    SlideDeck oferuje trzy sposoby osadzania pokazów slajdów w witrynie WordPress – wstawienie ich do treści istniejącej strony lub wpisu, utworzenie nowej strony lub wpisu z osadzanym slajdem i wreszcie wstawienie go do szablonu strony, co jest najprawdopodobniej najlepszym rozwiązaniem, jeśli chcesz dodać wycieczkę po produktach do swojej strony głównej.

    Podsumowanie

    Chociaż pokazy slajdów treści są zwykle używane tylko w galeriach obrazków lub wpisach wyróżniających, SlideDeck 2 zapewnia mnóstwo elastyczności w odkrywaniu potencjału suwaków treści w celu tworzenia atrakcyjnych doświadczeń, które utrzymują zaangażowanie i powracanie twoich odwiedzających. W WPBeginner gorąco zachęcamy do zapoznania się z tą aplikacją! Żywy przykład tego, jak używamy własnego SlideDeck można zobaczyć na naszej stronie Free WordPress Blog Setup.

    Masz przykład SlideDeck, którym chcesz się podzielić? Daj nam o tym znać w komentarzach! Zapoznaj się również z pierwszą częścią tej serii, w której pokazujemy, jak tworzyć dynamiczne źródła SlideDecks.

    Pokaz slajdów z interfejsem dotykowym to przyszłość projektowania stron internetowych. Pobierz SlideDeck już teraz. Użyj kodu kuponu: WPB-SD2, aby uzyskać 20% zniżki.

    Ujawnienie: Nasze treści są wspierane przez czytelników. Oznacza to, że jeśli klikniesz na niektóre z naszych linków, możemy otrzymać prowizję. Zobacz jak WPBeginner jest finansowany, dlaczego to ma znaczenie i jak możesz nas wspierać. Oto nasz proces redakcyjny.

    Avatar

    Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

    Najlepszy zestaw narzędzi WordPress

    Uzyskaj BEZPŁATNY dostęp do naszego zestawu narzędzi - zbiór produktów i zasobów związanych z WordPressem, które każdy profesjonalista powinien mieć!

    Reader Interactions

    Komentarze

    1. Gratulacje, masz okazję być pierwszym komentującym ten artykuł.
      Masz pytanie lub sugestię? Zostaw komentarz, aby rozpocząć dyskusję.

    Zostaw odpowiedź

    Dziękujemy za pozostawienie komentarza. Pamiętaj, że wszystkie komentarze są moderowane zgodnie z naszymi polityka komentarzy, a Twój adres e-mail NIE zostanie opublikowany. NIE używaj słów kluczowych w polu nazwy. Przeprowadźmy osobistą i konstruktywną rozmowę.