Stackable: wtyczka, która odblokowuje Twoje bloki

Pamiętasz lata 80-te? Nadejście nowej fali, pojawienie się fryzur z barweny, sukces Cyndi Lauper, Michaela Jacksona, Madonny, Prince'a, Whitney Houston, Duran Duran i tak dalej. W latach 80. nastąpiła także eksplozja gry wideo i wydanie gry, w której wielu nas było blisko: Tetris.

Ta gra, ze swoją prostą zasadą, polegała na układaniu klocków o różnych kształtach przy jednoczesnej optymalizacji dostępnej przestrzeni.

Koncepcję można podsumować jednym wersem: „Tetris idealnie pasuje do definicji najlepszej gry: jedna minuta, aby się jej nauczyć, całe życie, aby ją opanować” , jak powiedział dziennikarz Bill Kunkel (aka The Game Doctor).

Stwierdzenie, które można zastosować do wielu programów, takich jak WordPress.

Mówiąc o WordPressie, jeśli wspomnę o Tetris, to dlatego, że wtyczka, którą zamierzam dzisiaj przeanalizować, nazywa się Stackable. I nie bez powodu ta wtyczka dodaje nowe bloki Gutenberga do zagnieżdżenia w witrynie WordPress .

Gotowy na ten nowy test? Na swój znak, przygotuj się, idź!

Artykuł, pierwotnie napisany w lipcu 2021 r., został zaktualizowany w listopadzie 2021 r. o bezpłatne i premium wersje 3.0.5 Stackable.

Twoje najlepsze projekty WordPress potrzebują najlepszego hosta!

WPMarmite poleca Bluehost: świetna wydajność, świetne wsparcie. Wszystko, czego potrzebujesz na dobry początek.

Wypróbuj Bluehost

Co można układać w stos?

„Zasilamy nową generację projektowania stron internetowych”. Taka jest misja Stackable na swojej oficjalnej stronie internetowej, gdzie wtyczka określa się jako „nowe środowisko budowania stron dla Gutenberga”. Nie mniej!

Trzeba powiedzieć, że w katalogu WordPress wtyczka blokowa ma ponad 40 000 aktywnych instalacji i ładną ocenę 4,9 na 5 gwiazdek, której towarzyszy ciąg entuzjastycznych recenzji.

Jeśli już szukasz nowych bloków Gutenberg , być może natknąłeś się już na wtyczki, takie jak Ultimate Addons dla Gutenberg, Qubely, Getwid lub Coblocks.

Mówiliśmy o nich w naszym artykule o dodatkach zwiększających moc Gutenberga. Ich misja jest prosta: urozmaicić gamę klocków Gutenberga dostępnych w edytorze treści.

Stackable to także wtyczka zaprojektowana dla Gutenberga, do której przenosi mnóstwo bloków, od świetnych klasyków (nagłówek, galeria, wezwanie do działania) po bardziej egzotyczne (wyceny, tabele cen, zegar, referencje itp.).
Te bloki są gotowe do użycia i można je dostosować.

Możesz więc pomyśleć, jaki jest sens instalowania Stackable? Są tylko blokami wśród innych bloków. Cóż, Gutenberg zapewnia wiele przydatnych bloków, ale dzięki Stackable możliwości są zwielokrotnione.

Co więcej, masz dostęp do bardziej zaawansowanych funkcji dostosowywania niż te oferowane natywnie w Gutenbergu, takich jak: dostosowywanie układu elementów wewnątrz bloków, odstępów, zmiana tła, dodawanie efektów najechania itp.

Istnieją dwie wersje Stackable:

• Darmowa wersja jest dostępna w katalogu WordPress.

• Płatna wersja jest dostępna na oficjalnej stronie wtyczki, zaczynając od 49 USD do użytku w jednej witrynie.

Jak możesz sobie wyobrazić, drugi daje dostęp do większej liczby bloków i pozwala na bardziej precyzyjne ich dostosowywanie.

W tym teście skupiliśmy się na wersji Premium.

Ustawienia do układania w stos

Aby rozpocząć konfigurację Stackable, zainstaluj i aktywuj wtyczkę. Następnie przejdź do Ustawienia > Możliwość układania w stos.

W jego interfejsie będziesz mieć dostęp do następujących ustawień:

• Ikony Font Awesome Pro (premium): aby zintegrować zestaw Font Awesome Pro z Stackable.
• Ustawienia edytora: pozwala kontrolować niektóre funkcje edytora Stackable. Możesz na przykład wyłączyć Bibliotekę projektu, ustawić szerokość niektórych bloków, zamknąć nieużywane okienka edytora i połączyć kolumny, aby podlegały tym samym zmianom.
• Menedżer ról (premium): przyznanie lub zablokowanie dostępu do edytora bloków niektórym rolom użytkowników i umożliwienie im tylko edytowania treści. Uwaga: to zarządzanie działa na wszystkich blokach , nie tylko tych zawartych w Stackable.
• Pola niestandardowe (premium): ta funkcja umożliwia tworzenie pól niestandardowych, które można dynamicznie dodawać do treści z edytora. Aby to zrobić, przejdź do sekcji Pola w swojej administracji WordPress, kliknij „Dodaj nowe”, zdefiniuj typ pola (Tekst, Numer, Data, Godzina lub URL) i nazwę.

Następnie kliknij „Zapisz pole”, wprowadź wartość dla swojego pola i kliknij „Zapisz zmiany”, aby je zapisać.

Aby zintegrować go z treścią, umieść kursor w miejscu, w którym chcesz, aby pojawiła się wartość pola i kliknij ikonę bazy danych (odpowiada ona polam dynamicznym).

Wybierz „Witryna” jako „Źródło dynamiczne”, a następnie nowo utworzone pole (pojawia się pod „Niestandardowe pola do układania w stos”), a na koniec kliknij „Zastosuj”. Otóż ​​to!

Wszystko dobrze i dobrze, ale dlaczego to wszystko zrobiliśmy? Dzięki magii dynamicznej treści, jak tylko ją zaktualizuję, mój adres e-mail zostanie automatycznie zaktualizowany w każdym miejscu na mojej stronie, w którym zintegrowane jest niestandardowe pole.

• Responsywne punkty przerwania: można zmienić szerokość ekranu, z którego będzie wyświetlana Twoja witryna w trybie tabletu lub telefonu komórkowego, a tym samym wyświetlić ustawienia, które zdefiniowałeś dla tych urządzeń.
• Ustawienia globalne: dostępne są dwie funkcje, które pozwalają przezwyciężyć ewentualne niezgodności z motywem w witrynie. Możesz przejść do selektora obszaru zawartości motywu i wymusić użycie czcionek Stackable, aby przejęły one te z motywu.

Podobnie jak Elementor, Stackable ma ustawienia globalne: kolory i typografię , które mają zastosowanie do stron utworzonych za pomocą Elementora. Ale dzięki Stackable masz możliwość zdefiniowania tych ustawień dla wszystkich bloków, z których składa się Twoja witryna .

• Włącz i wyłącz blokowanie: jeśli nie potrzebujesz niektórych bloków, możesz je wyłączyć , aby nie pojawiały się na liście dostępnych bloków.
• Ustawienia optymalizacji (premium): umożliwiają ładowanie plików JavaScript i CSS tylko w postach zawierających bloki Stackable, a nie w całej witrynie. Celem tej funkcji jest poprawa wydajności Twojej witryny. Ta funkcja dotyczy tylko bloków w wersji 2, ponieważ dotyczy już najnowszych bloków wtyczki (od wersji 3).

Jak używać Stackable?

Zestawy i klocki

Stackable jest używany bezpośrednio z edytora WordPress. Aby to zrobić, utwórz lub otwórz stronę lub post, a następnie wybierz opcję Biblioteka projektu u góry posta.

Biblioteka projektu zawiera zestawy interfejsu użytkownika i kategorie . Co to jest?

W rzeczywistości te dwie sekcje zawierają te same elementy, ale są inaczej skategoryzowane. Zestawy UI zbierają bloki dostępne w przewodniku stylu, a kategorie grupują je według typu bloku: nagłówek, referencja, wezwanie do działania itp., które można znaleźć we wszystkich dostępnych przewodnikach stylu.

Kategorie i zestawy interfejsu użytkownika to dwa różne sposoby na znalezienie odpowiedniego bloku.

Każdy blok ma gotowy do użycia i konfigurowalny projekt. W następnej części zobaczymy, jak je dostosować.

Aby znaleźć potrzebny blok, możesz również skorzystać z paska wyszukiwania do Twojej dyspozycji. Cztery ikony w prawym górnym rogu okna pozwalają odświeżyć wyniki wyszukiwania i zmienić rozmiar miniatur, aby uzyskać dokładniejszy lub większy widok różnych bloków.

Jak zintegrować blok do układania w stos w słupku

Możesz także po prostu kliknąć ikonę „+”, tak jak chcesz dodać dowolny blok, a łatwo rozpoznasz bloki wtyczek Stackable, ponieważ są ozdobione fioletowo-pomarańczowym gradientem.

Klikając przycisk „Przeglądaj wszystko”, możesz uzyskać dostęp do wszystkich bloków Gutenberga, które masz do dyspozycji. Bloki do układania w stos znajdują się w sekcjach „Tekst” i „Wygląd” i są zgrupowane w tytułowej sekcji „Układanie w stos”, która zapewnia również dostęp do Biblioteki projektu.

Wszystkie te ścieżki prowadzą do Rzymu do bloków Stackable, tak, ale to przede wszystkim ścieżka Biblioteki projektów, która daje dostęp do gotowych projektów.

Weźmy na przykład ten blok referencji, który ma minimalne formatowanie, tekst wypełniający i brak przykładowego obrazu:

I zobacz kolejny blok Testimonial, dodany z Biblioteki projektu (blok Prime Testimonial 2 ):

Po znalezieniu idealnego dopasowania kliknij żądany element, aby umieścić go bezpośrednio w poście. Następnie możesz zmienić kolejność elementu na stronie, tak jak każdy blok Gutenberga, i dostosować go.

Dostosowywanie do układania w stos

Aby dostosować blok do układania w stos, przejdź do sekcji „blok” po prawej stronie posta, w której znajdziesz kilka opcji podzielonych na trzy kategorie: Blok , Styl i Zaawansowane .

Znalezienie tego, który Cię interesuje, może być żmudne, ponieważ jest tak wiele do wyboru, ale możesz go również znaleźć, klikając dwukrotnie element bloku, który chcesz zmienić. Następnie jednym kliknięciem przeniesiesz się do ustawień tego bloku.

Różne opcje dostosowywania są pogrupowane w trzy zakładki:

• Blok : tutaj możesz dostosować układ różnych elementów tworzących blok, dodać obramowania i cienie oraz oddziaływać na tło, odstępy i wyrównanie tekstu.

Możesz także dostosować odstępy między elementami w swoich blokach, najeżdżając na nie, a następnie używając uchwytów na dole elementu. Możesz nawet zobaczyć liczbę pikseli oddzielających go od sąsiada. Bardzo przydatne!

• Styl : pozwala zarządzać kolumnami i działać na typografii, kolorach, przyciskach i separatorach. Jest to bardziej nieoczekiwane, ale możesz również dodać tytuł i opis do swojego bloku.
• Zaawansowane : tutaj masz dostęp do zaawansowanych funkcji, takich jak tag HTML powiązany z blokiem oraz zarządzanie responsywnym (możliwość ukrycia blokady na komputerze, tablecie lub telefonie komórkowym). Możesz dostosować marginesy bloku i wyrównanie treści, ale także dobrze się bawić, dodając animacje lub efekty przejścia do swoich elementów (choć łatwo).
  Wisienką na torcie dla miłośników CSS jest możliwość modyfikacji CSS bloku bezpośrednio w tym interfejsie, obok bloku i z podglądem zmian w czasie rzeczywistym.
  Na koniec, wyświetlanie warunkowe pozwala wyświetlić element tylko wtedy, gdy spełniony jest wcześniej zdefiniowany warunek.

Dołącz do subskrybentów WPMarmite

Pobierz ostatnie posty WPMarmite (a także ekskluzywne zasoby).

ZAPISZ SIĘ TERAZ

Jeśli nie jesteś w pełni zadowolony z projektu bryły, masz możliwość modyfikacji wielu parametrów, aby dostosować go do swoich upodobań.

Na przykład podobało mi się, że mogę łatwo dodawać efekty do najechania na elementy lub element nadrzędny (zastosuj tło do bloku nadrzędnego, aby skorzystać z tej ostatniej funkcji) lub łatwo modyfikować marginesy każdego elementu bloku .

Co więcej: możesz wybrać różne marże na telefonie komórkowym i tablecie! Dzięki temu możesz łatwo zmienić responsywny aspekt swojej witryny. Aby to zrobić, najpierw kliknij ikonę na pulpicie (komputer), aby wyświetlić ikony innych urządzeń.

Inną fajną opcją jest dodanie separatorów na górze lub na dole elementu, tak jak w przypadku Elementora. Możesz oczywiście dostosować wygląd tych przekładek, a nawet dodać jedną lub dwie jaśniejsze warstwy w wersji Premium.

Tak wygląda na dole tego apetycznego burgera:

Gdy najedziesz na ich nazwę, niektóre ustawienia zmienią kolor na fioletowy, a kursor zmieni się w znak zapytania. Jeśli nie wiesz, do czego służą, kliknij, aby zobaczyć animację, która pomoże Ci zrozumieć, do czego służą. Całkiem przydatne, aby znaleźć sposób na obejście wszystkich tych opcji.

Jakie dostosowanie do motywów i wtyczek?

Dostosowanie do tematów

Zgodnie z oficjalną dokumentacją „Stackable powinien działać z dowolnym motywem”, o ile motyw, który masz na swojej stronie, jest zoptymalizowany pod kątem Gutenberga.

Mówiąc o motywach, wspomniałem o tym na początku tego postu: istnieje motyw wewnętrzny , zaprojektowany do pracy z edytorem Gutenberg i wtyczką Stackable. Jest bezpłatny i dostępny w oficjalnym katalogu WordPress. Dzięki niemu kompatybilność jest w skrócie gwarantowana.

Jest w kolorach wtyczki o tej samej nazwie, więc mam nadzieję, że nie przeszkadza ci cukierkowy róż.

Pobierz motyw Stackable:

Dostosowanie do wtyczek

Dokumentacja Stackable zapewnia, że ​​jest ona kompatybilna z kreatorem stron elementor (link aff). Ale uważaj, nie będziesz mógł używać bloków Stackable w edytorze kreatora stron.

Właściwie to tak samo, jak w przypadku bloków Gutenberga, nie możesz ich używać w edytorze Elementor, musisz dokonać wyboru: zbuduj swoją stronę za pomocą Elementora lub edytora WordPress.

Oficjalna strona Stackable twierdzi również, że jej bloki są kompatybilne z dowolną wtyczką , więc możesz bez problemu używać ich z innymi bibliotekami bloków.

Zbuduj swoją witrynę z Elementor

Zaprojektuj łatwo wygląd swojej witryny WordPress za pomocą słynnego kreatora stron. Wypróbuj Elementora

Wypróbuj Elementora

Dokumentacja i wsparcie

Jeśli masz jakiekolwiek problemy z używaniem Stackable, możesz w każdej chwili skorzystać z oficjalnej dokumentacji.

Znajdziesz tam:

• Sekcja poświęcona rozpoczęciu pracy z wtyczką.
• Sekcja rozwiązywania problemów.
• Ceny i szczegóły licencji.
• Ukierunkowane przewodniki.
• FAQ.
• I inne zasoby.

Tę dokumentację można również znaleźć w Ustawienia > Możliwość układania w stos, karta Dokumentacja .

W przypadku usterek technicznych zespół odpowiedzialny za wtyczkę udostępnia użytkownikom listę często napotykanych problemów, a także rozwiązania ich napraw.

Jeśli nadal utkniesz, możesz zadzwonić do pomocy technicznej Stackable lub dołączyć do ich grupy na Facebooku, aby uzyskać odpowiedzi na swoje pytania.

Jeśli chodzi o wsparcie, zespół Stackable może Ci pomóc, jeśli wyślesz im swoją prośbę za pośrednictwem formularza kontaktowego na karcie Kontakt w Ustawienia > Stackable lub na adres e-mail [email protected] .

Jaki jest stosunek jakości do ceny?

Wersja premium jest oczywiście bardziej hojna pod względem różnorodności oferowanych bloków. Opcje dostosowywania są również liczniejsze.

Na przykład w przypadku bloku funkcji dostępne są 2 opcje układu w wersji bezpłatnej (podstawowa i zwykła ), w porównaniu do 13 w wersji Premium.

W wersji Premium dostępne są również mniej lub bardziej interesujące parametry, w zależności od tego, jak korzystasz z Stackable, takie jak integracja z Font Awesome Pro i Role Managerem oraz możliwość modyfikacji dowolnego bloku w CSS.

Aby skorzystać z tej ostatniej funkcji, przejdź do sekcji Zaawansowane , a następnie Niestandardowy CSS . Wygodne: Twoje zmiany są wyświetlane w czasie rzeczywistym.

Wersja Premium zapewnia również dostęp do rocznego wsparcia i aktualizacji .

Używanie Stackable lub kreatora stron: oto jest pytanie

To wszystko, wspólnie omówiliśmy funkcje i ustawienia Stackable. Teraz masz jaśniejsze pojęcie o tym, co ma w zanadrzu wtyczka blokowa.

Jeśli jesteś fanem programów do tworzenia stron lub już im się przyjrzałeś, możesz się zastanawiać: po co używać Stackable zamiast programu do tworzenia stron?

Ponieważ opcje oferowane na przykład przez Stackable i bezpłatną wersję Elementora są porównywalne. I nie bez powodu Stackable podchodzi do projektowania za pomocą narzędzia do tworzenia stron , jak twierdzi na swojej oficjalnej stronie internetowej: „Miej pewność, że łatwo zbudujesz najszybsze witryny internetowe, korzystając z nowego środowiska tworzenia stron dla Gutenberga” .

A wraz z pojawieniem się Full Site Editing, który pozwoli działać na wszystkich elementach interfejsu witryny (a nie tylko na treści postów), Stackable może być jeszcze bliższe. To powiedziawszy, Stackable ma tę zaletę, że jest używane bezpośrednio w edytorze treści WordPress , co upraszcza projektowanie w porównaniu z obecnymi kreatorami stron.

Z drugiej strony wersja pro Elementora oferuje znacznie bardziej zaawansowane widżety i funkcje. Ponieważ obie wtyczki kosztują tyle samo w przypadku korzystania z jednej witryny (49 USD), sugerujemy zamiast tego zwrócić się do giganta kreatorów stron.

Nasza ostateczna opinia na temat Stackable

Podsumowując, można powiedzieć, że Stackable to dość intuicyjna wtyczka oferująca nowoczesne i estetyczne projekty.

Stackable jest dla każdego twórcy witryny, który chce mieć bardziej zaawansowane bloki, aby dostosować projekt swojej witryny , bez konieczności dotykania jakiejkolwiek linii kodu (ale mając możliwość, jeśli opanuje CSS, ułożyć bloki według własnych upodobań).

Czy jednak powinieneś go użyć, czy przejść bezpośrednio do bardziej zaawansowanego narzędzia do tworzenia stron, takiego jak Elementor?

Rzeczywiście, dzięki Stackable zbliżamy się do doświadczenia projektowania kreatora stron bezpośrednio w edytorze WordPress. Można powiedzieć, że to początek ostatecznego celu Projektu Gutenberg, jakim jest zostanie prawdziwym „site builderem”.

Jednak jeszcze nas tam nie ma. Na razie Stackable pomoże Ci tworzyć posty w taki sam sposób, jak darmowa wersja Elementora, bez żadnego zarządzania szablonami (Stackable umożliwia ładowanie gotowych projektów, ale nie zapisywanie własnych).

Jeśli lubisz pracować z edytorem WordPress, a bloki dostarczone przez Stackable są wystarczające dla twojego projektu, idź do niego! Korzystanie z Elementora nie będzie konieczne.

Jeśli jednak potrzebujesz bardziej zaawansowanych funkcji lub potrzebujesz zaprojektować stronę od podstaw (przez co mam na myśli dostosowanie wszystkich szablonów stron), Elementor (link aff) lub jeden z jego konkurentów będzie niezbędny.

A jeśli jesteś jednym z użytkowników, których uwiódł już Elementor, Stackable może nie być wielkim hitem. W końcu masz własne nawyki, więc nie ma powodu, aby je zmieniać.

Jeśli interesuje Cię wersja Pro Stackable, nie wahaj się zobaczyć dostępnej wersji demonstracyjnej i darmowej wersji, aby upewnić się, że bloki i opcje są zgodne z Twoimi upodobaniami.

Pobierz wtyczkę Stackable:

A ty, czy już go używałeś? Czy ten artykuł sprawił, że chciałeś z niego skorzystać? Podziel się swoimi przemyśleniami w komentarzach.