Integracja ShopEngine z Gutenbergiem dla sklepu WooCommerce

Opublikowany: 2022-04-05

Wreszcie koniec oczekiwania! ShopEngine jest teraz kompatybilny z twoim edytorem bloków Gutenberga . Wcześniej dostęp do widżetów ShopEngine można było uzyskać tylko przez okno Elementora, prawda?

Ale teraz ShopEngine jest dostępny poza tym. Oprócz dostępu do widżetów ShopEngine za pośrednictwem Elementora, możesz korzystać z ShopEngine w sklepie Gutenberg dla sklepu WooCommerce . Jednak w Gutenbergu te widżety będą wyświetlane jako bloki.

W rzeczywistości funkcje widżetów Elementora i bloków Gutenberga są identyczne. Jaka jest więc różnica? Różnica tkwi w aplikacji. W przypadku widżetów Elementor trzeba było przeciągać i upuszczać widżety w wyznaczonych obszarach, aby wyświetlić dane wyjściowe. Ale w przypadku bloków Gutenberga wystarczy kliknąć bloki i twoja praca jest wykonana.

Ukryj zawartość
1 Przegląd Gutenberga:
2 Dlaczego warto zintegrować ShopEngine z Gutenbergiem:
3 Niektóre z godnych uwagi bloków ShopEngine w Gutenbergu:
3.1 Tytuł produktu:
3.2 Lista produktów:
3.3 Opis produktu:
3.4 Płatność przy kasie:
3.5 Produkty archiwalne:
3.6 Tabela koszyka:
3.7 Ostatnio oglądane produkty:
4 Likwidacja:

Przegląd Gutenberga:

Jako użytkownik WordPressa musisz znać termin Gutenberg . Jest to edytor treści WordPress, znany również jako edytor bloków WordPress. Obecnie Gutenberg jest najpopularniejszym edytorem WordPress wśród użytkowników WordPressa ze względu na łatwość obsługi. Wiele wtyczek WordPress Gutenberg jest również dostępnych od zewnętrznych programistów.

Wcześniej ludzie byli bardziej przyzwyczajeni do korzystania z „Edytora klasycznego”, innego edytora WordPress. Od czasu pojawienia się Gutenberga ludzie bardziej przyjęli edytor bloków niż Edytor klasyczny. Specjalnością Gutenberga jest jego zawartość oparta na blokach .

Bez względu na to, czy jest to akapit, obraz, czy przycisk, każdy z tych elementów jest blokiem. W przeciwieństwie do Edytora klasycznego, ten oparty na blokach edytor treści pozwala manipulować treścią z większą kontrolą. Najlepszą częścią tego edytora bloków jest to, że pozwala on zewnętrznym programistom osadzać niestandardowe bloki.

I to jest dokładnie to, na czym skupimy się na tym informacyjnym blogu, ponieważ od teraz mnóstwo funkcji ShopEngine będzie do Twojej dyspozycji w Gutenberg dla WooCommerce. Zanim zajmiemy się niestandardowymi blokami ShopEngine w Gutenbergu, rzucę światło na to, dlaczego zintegrowaliśmy ShopEngine z Gutenbergiem dla WooCommerce .

Dlaczego warto zintegrować ShopEngine z Gutenbergiem:

ShopEngine został początkowo zaprojektowany wyłącznie dla Elementora. Oznacza to, że możesz budować swoje strony WooCommerce tylko dla Elementora. Ale teraz, jak wspomniałem wcześniej, ShopEngine poszedł o krok do przodu po integracji z Gutenbergiem.

Integracja ShopEngine Gutenberg

Co skłoniło nas do zintegrowania ShopEngine z Gutenberg dla WooCommerce ? Aby odpowiedzieć na to pytanie, pozwól, że przedstawię Ci fragmenty danych-

Według gutenstats.blog, Gutenberg otrzymał do tej pory 76 milionów aktywnych instalacji. Do tego 264,5 miliona postów napisanych z Gutenbergiem do tej pory.

Myślę, że te dane wystarczą, aby przekonać każdego, dlaczego rozszerzyliśmy ofertę ShopEngine o Gutenberg. Miliony ludzi wdrażają Gutenberg do rozwijania swoich treści i nie chcemy, aby przegapili fascynujące funkcje oferowane przez ShopEngine.

Kilka innych powodów integracji ShopEngine z Gutenbergiem:

Chciałbym podkreślić, że Gutenberg nie jest wyłącznie edytorem treści . Projekt Gutenberg ma na celu przekształcenie edytora bloków w narzędzie do edycji całej witryny w niedalekiej przyszłości.

Chodzi o to, abyś mógł zaprojektować 100% swojej witryny WooCommerce za pomocą edytora Gutenberg. Jeśli tak się stanie, popyt na Gutenberga prawdopodobnie wzrośnie. Warto więc zintegrować ShopEngine z Gutenbergiem dla WooCommerce, prawda?

  • Dzięki Gutenberg nie musisz używać skrótów do osadzania treści. Zamiast tego możesz wdrożyć bloki, aby dodać niezbędne elementy strony.
  • Gutenberg jest wolny od problemów ze zgodnością, więc programiści mogą łatwo włączyć obsługę Gutenberga do swoich wtyczek.
  • Gutenberg generuje lekki kod, a także jest narzędziem do szybkiego ładowania.
Przejdź do pobierania ShopEngine

Niektóre z ważniejszych bloków ShopEngine w Gutenberg:

Zanim rzucę światło na bloki ShopEngine, wyjaśnię, że ShopEngine zawiera ponad 65 widżetów , ponad 13 modułów i mnóstwo szablonów dla stron sklepów WooCommerce przeznaczonych dla użytkowników Elementora. Po integracji ShopEngine z Gutenbergiem dla WooCommerce, możesz teraz uzyskać dostęp do ponad 45 bloków ShopEngine w Gutenberg .

ShopBloki silnika w Gutenberg

W zależności od typu strony, który wybierzesz do zbudowania szablonu dla swojego sklepu WooCommerce, bloki Gutenberga pojawią się odpowiednio. Ponadto uzyskasz dostęp do takich modułów, jak Szybki podgląd, Próbki odmian, Porównanie produktów i Lista życzeń .

Rzućmy okiem na niektóre bloki ShopEngine w Gutenberg dla sklepu WooCommerce-

Tytuł produktu:

Blok tytułowy produktu pojawia się na jednej stronie dla określonego produktu. Po wybraniu jednego typu strony do zbudowania szablonu wystarczy kliknąć blok tytułowy produktu na pasku bocznym.

Zaraz po tym na stronie pojawi się tytuł Twojego produktu. Z prawego paska bocznego możesz modyfikować tag tytułu, wyrównanie, kolor i typografię.

Lista produktów:

Lista produktów wyświetla wszystkie rodzaje produktów, które sprzedajesz w swoim sklepie WooCommerce. Blok listy produktów pojawia się na wszystkich typach stron, w tym na stronach pojedynczych, sklepu, kasy i koszyka. Po wybraniu typu strony kliknij listę produktów w wyskakującym okienku lub na pasku bocznym.

Upewnij się, że wybrałeś kategorię produktów, w których mają się pojawiać produkty. Z prawego paska bocznego możesz wybierać i dostosowywać różne elementy listy produktów. Możesz wybrać liczbę produktów na stronie, tagi, pokazać/ukryć odznakę sprzedaży, procent rabatu itp.

Opis produktu:

Jeśli utworzysz szablon pojedynczej strony, blok opisu produktu pojawi się na pasku bocznym. Aby opis produktu pojawił się na Twojej stronie, kliknij blok opisu produktu. Możesz dostosować opis, a także stylizować go, modyfikując typografię, kolor, wyrównanie itp.

Płatność w kasie:

Podobnie jak widżet płatności przy kasie w Elementorze, blok płatności przy kasie działa w Gutenberg. Możesz wyświetlić blok „Płatność przy kasie”, jeśli przejdziesz do szablonu kompilacji dla swojej strony kasy. Następnie możesz dodać blokadę płatności w kasie, zgodnie z potrzebami w swoim sklepie WooCommerce.

Będziesz mieć możliwość zmiany stylu treści, metod płatności, przycisku itp. Możesz dostosować pozycję pola wyboru, kolor przycisku, typografię, obramowanie itp.

Produkty archiwalne:

Strona zarchiwizowanych produktów zawiera wszystkie zamieszczone produkty w jednym miejscu. Aby utworzyć szablon strony archiwum w Gutenberg dla WooCommerce, po prostu przejdź do lewego paska bocznego i kliknij blok Archiwizuj produkty . Wszystkie produkty z ekwipunku pojawią się jeden po drugim.

Strona produktów Archiwum zawiera mnóstwo segmentów, w tym układ, treść, paginację, ocenę itp. Strona zawiera wiele elementów, takich jak tytuł produktu, zdjęcie produktu, cena produktu, opis produktu, stopka produktu i tak dalej.

Tabela koszyka:

W tabeli koszyka pojawiają się wszystkie szczegóły wybranych produktów, w tym nazwa produktu, cena, ilość, suma częściowa i łączna kwota. Dzięki blokowi tabeli koszyka ShopEngine możesz zaprezentować kupującym wszystkie informacje istotne dla Twoich produktów za pomocą tabeli koszyka na stronie koszyka WooCommerce.

Aby dostosować zawartość i stylizować różne elementy tabeli koszyka, otrzymasz parametry na prawym pasku bocznym. Możesz dostosować kolory nagłówka i stopki produktu, kolor obramowania, kolor tekstu, a także dostosować sekcje treści, w tym tytuł, cenę, ilość, sumę itp.

Ostatnio oglądane produkty:

Dzięki blokowi Ostatnio oglądane produkty ShopEngine możesz zaprezentować produkty, które Twoi użytkownicy ostatnio przeglądali lub oglądali w Twoim sklepie WooCommerce. Możesz wyświetlać ostatnio oglądane produkty na stronie sklepu, stronie produktu, stronie koszyka itp.

Podobnie jak w przypadku innych bloków, możesz zauważyć parametry związane z ostatnio przeglądanymi produktami na prawym pasku bocznym. Korzystając z parametrów, możesz określić liczbę produktów do wyświetlenia, pokazać/ukryć plakietki sprzedażowe, ustawić odstęp między kolumnami i wierszami, dostosować wysokość zdjęć produktów itp.

Likwidacja:

A więc, co myślisz o naszej integracji ShopEngine z Gutenbergiem dla WooCommerce ? Poinformuj nas o swoich doświadczeniach z wdrażaniem bloków ShopEngine w sklepie Gutenberg dla sklepu WooCommerce.

Serdecznie zapraszamy do wyrażania pozytywnych lub negatywnych opinii na temat integracji Gutenberga dla WooCommerce. Będziemy również wdzięczni za wszelkie sugestie dotyczące usprawnienia naszego procesu integracji. Jednak nasze prace nad integracją ShopEngine z Gutenbergiem wciąż trwają. Wkrótce zakończymy projekt.

Grab ShopSilnik teraz

Chcesz wiedzieć, jak zbudować witrynę e-commerce za pomocą ShopEngine? Przejdź do bloga, klikając poniższy link-

Jak zbudować witrynę e-commerce z ShopEngine?