- \n
- Szybsze \u0142adowanie i szybka wydajno\u015b\u0107<\/li>\n
- W pe\u0142ni konfigurowalny ekran g\u0142\u00f3wny z edytorem DIY<\/li>\n
- Obs\u0142uga wszystkich metod wysy\u0142ki i p\u0142atno\u015bci w witrynie<\/li>\n
- Nieograniczone powiadomienia push (zar\u00f3wno automatyczne, jak i niestandardowe powiadomienia)<\/li>\n
- Powiadomienie push o porzuconym koszyku<\/li>\n
- Obs\u0142uga czatu Zopim i WhatsApp<\/li>\n
- Anga\u017cuj\u0105cy, przyjazny dla u\u017cytkownika interfejs<\/li>\n
- Brak zale\u017cno\u015bci od sklep\u00f3w z aplikacjami<\/li>\n
- W pe\u0142ni brandowane do Twojego sklepu (bia\u0142a etykieta)<\/li>\n
- E-mail i logowanie spo\u0142eczno\u015bciowe (Google i Facebook)<\/li>\n
- Obs\u0142uga wielu j\u0119zyk\u00f3w i RTL<\/li>\n
- Tryb offline dzia\u0142a<\/li>\n
- Wbudowana funkcjonalno\u015b\u0107 listy \u017cycze\u0144<\/li>\n
- Synchronizacja na \u017cywo czarno-bia\u0142a strona internetowa i aplikacja<\/li>\n
- Automatyczna aktualizacja zapas\u00f3w<\/li>\n
- Kompatybilno\u015b\u0107 z wieloma urz\u0105dzeniami<\/li>\n
- Jednokartkowa realizacja zam\u00f3wienia<\/li>\n
- Lekka aplikacja<\/li>\n
- Zarz\u0105dzanie stronami CMS<\/li>\n
- Powi\u0105zane produkty w progresywnej aplikacji internetowej<\/li>\n
- Opinie u\u017cytkownik\u00f3w o produktach na\ufffdPWA<\/li>\n
- Obs\u0142uga wielu walut<\/li>\n
- Wsparcie kupon\u00f3w \/ kupon\u00f3w<\/li>\n<\/ul>\n
[IMP] Uwagi dotycz\u0105ce aplikacji PWA na iOS:<\/h3>\n
\ufffd> Urz\u0105dzenia z systemem iOS (iPhone, iPad itp.) nie oferuj\u0105 wbudowanego monitu \u201eDodaj do ekranu g\u0142\u00f3wnego\u201d. Dlatego u\u017cytkownicy aplikacji mobilnej PWA musz\u0105 r\u0119cznie doda\u0107 aplikacj\u0119 mobiln\u0105 OpenCart PWA do ekranu g\u0142\u00f3wnego iPhone’a lub iPada. \ufffd> iOS nie obs\u0142uguje powiadomie\u0144 web push. Dlatego administrator sklepu mo\u017ce wysy\u0142a\u0107 powiadomienia push tylko na urz\u0105dzenie z Androidem, a nie na iOS.<\/p>\n
[NOWA AKTUALIZACJA].OpenCart PWA obs\u0142uguje j\u0119zyki RTL (arabski, hebrajski itp.):<\/h3>\n
Kreator aplikacji mobilnych OpenCart PWA obs\u0142uguje teraz wiele j\u0119zyk\u00f3w, w tym skrypty RTL (od prawej do lewej), takie jak arabski, hebrajski, perski itp. Wszystkie j\u0119zyki sklepu OpenCart b\u0119d\u0105 dost\u0119pne w progresywnej aplikacji internetowej, a inne wymagane j\u0119zyki mog\u0105 by\u0107 r\u00f3wnie\u017c dodane. U\u017cytkownicy mog\u0105 wybra\u0107 j\u0119zyk w progresywnej aplikacji internetowej, a ca\u0142a zawarto\u015b\u0107 aplikacji zostanie odpowiednio przet\u0142umaczona.<\/p>\n
W pe\u0142ni kompatybilny z rynkiem wielu dostawc\u00f3w KnowBand:<\/h2>\n
Nasza aplikacja mobilna OpenCart PWA jest kompatybilna z Rynek wielu dostawc\u00f3w OpenCart<\/a>. Przekszta\u0142\u0107 sw\u00f3j sklep OpenCart eCommerce w pe\u0142noprawny rynek i uruchom aplikacj\u0119 mobiln\u0105 PWA w tym samym celu. Sprzedawcy na rynku b\u0119d\u0105 dost\u0119pni w Twojej progresywnej aplikacji internetowej, a u\u017cytkownicy r\u00f3wnie\u017c b\u0119d\u0105 mogli je po prostu przegl\u0105da\u0107.<\/p>\n
Uwaga:<\/strong> Aplikacje mobilne OpenCart PWA s\u0105 zorientowane wy\u0142\u0105cznie na klienta, tzn. u\u017cytkownicy mog\u0105 odwiedza\u0107 aplikacj\u0119 przegl\u0105dania PWA wraz ze sprzedawcami. Nie b\u0119dzie pulpitu sprzedawcy ani zarz\u0105dzania za po\u015brednictwem aplikacji OpenCart Progressive Web App. Administrator mo\u017ce zarz\u0105dza\u0107 sprzedawcami z sieci marketplace, a to samo b\u0119dzie automatycznie aktualizowane w aplikacji mobilnej PWA.<\/p>\n
1.3 Zobacz demo OpenCart PWA:<\/h3>\n
<\/p>\n
![\"home-screen\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Category-Of-Home-screen.png\")
<\/a><\/p>\nPoznaj funkcje modu\u0142u i aplikacji PWA z poni\u017cszych link\u00f3w demonstracyjnych:<\/p>\n
Panel administracyjny modu\u0142u:\ufffd<\/strong>https:\/\/opencartdemo.knowband.com\/3.0\/pwa\/admin\/<\/a>
\nAplikacja demonstracyjna PWA:<\/strong> https:\/\/opencartdemo.knowband.com\/3.0\/pwa\/pwa-app\/<\/a><\/p>\n(Skopiuj i wklej adres URL w przegl\u0105darce mobilnej i \u201eDodaj do ekranu g\u0142\u00f3wnego\u201d)<\/p>\n
Ekrany panelu administracyjnego 2.0:<\/h2>\n
Poznaj wszystkie ustawienia panelu administracyjnego rozszerzenia OpenCart PWA Mobile App wraz z funkcjonalno\u015bci\u0105 i pracuj z udost\u0119pnionymi poni\u017cej migawkami:<\/p>\n
2.1 Ustawienia og\u00f3lne:<\/h3>\n
![\"Og\u00f3lne-settings\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/General-Settings.png\")
<\/p>\na) Poka\u017c\/ukryj podgl\u0105d:<\/strong> Dotknij przycisku oka, aby wy\u015bwietli\u0107\/ukry\u0107 podgl\u0105d telefonu w panelu administracyjnym.
\nb) Status:<\/strong> W\u0142\u0105cz modu\u0142 do pracy PWA na urz\u0105dzeniach mobilnych.
\nc) W\u0142\u0105cz raportowanie dziennika \u017c\u0105da\u0144:<\/strong> W\u0142\u0105cz dziennik b\u0142\u0119d\u00f3w na urz\u0105dzeniu mobilnym.
\nd) Nazwa aplikacji PWA:<\/strong> Wpisz nazw\u0119 aplikacji OpenCart PWA.
\ne) Wybierz uk\u0142ad strony g\u0142\u00f3wnej:<\/strong> Wybierz spo\u015br\u00f3d wst\u0119pnie dodanego uk\u0142adu ekranu g\u0142\u00f3wnego dla aplikacji OpenCart Progressive Web App.<\/p>\n![\"ustawienia-og\u00f3lne-2\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/General-Settings-2.png\")
<\/p>\nf) W\u0142\u0105cz pasek kart:<\/strong> W\u0142\u0105cz pasek kart na dole aplikacji OpenCart PWA, aby zapewni\u0107 bezproblemow\u0105 nawigacj\u0119.
\ng) Czcionka dla aplikacji PWA:<\/strong> Wybierz czcionk\u0119 dla aplikacji OpenCart Progressive Web App (PWA).
\nh) Kolor przycisku aplikacji:<\/strong> Wybierz kolor przycisku dla aplikacji mobilnej PWA.
\ni) Kolor motywu aplikacji:<\/strong> Wybierz kolor motywu dla aplikacji PWA.
\nj) Kolor t\u0142a aplikacji:<\/strong> Wybierz kolor t\u0142a dla aplikacji PWA.
\nk) Kolor ekranu powitalnego aplikacji:<\/strong> Wybierz ekran powitalny dla aplikacji mobilnej PWA.
\nl) W\u0142\u0105cz logo:<\/strong> Dodaj logo swojej marki w nag\u0142\u00f3wku aplikacji mobilnej OpenCart PWA.<\/p>\n![\"ustawienia-og\u00f3lne-3\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/General-settings-3.png\")
<\/p>\nm) Obraz ikony aplikacji:<\/strong> Dodaj obraz ikony aplikacji w panelu administracyjnym rozszerzenia OpenCart PWA.
\nn) Przekieruj na stron\u0119 koszyka po dodaniu do koszyka:<\/strong> Kontroluj przekierowywanie przycisku Dodaj do koszyka za ka\u017cdym razem, gdy dowolny u\u017cytkownik kliknie przycisk Dodaj do koszyka.<\/p>\n2.2 Ustawienia powiadomie\u0144 push<\/h3>\n
![\"ustawienia-push-powiadomie\u0144\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/3-2.jpg\")
<\/a><\/p>\nPowiadomienia push to najlepsze narz\u0119dzie marketingowe dla Progressive Web App (PWA) dla OpenCart. Administrator sklepu mo\u017ce po prostu promowa\u0107 produkty i oferty sklepu dla u\u017cytkownik\u00f3w aplikacji oraz zwi\u0119ksza\u0107 sprzeda\u017c i przychody. Wprowad\u017a wszystkie szczeg\u00f3\u0142y w ustawieniach powiadomie\u0144 push, tworz\u0105c projekt Firebase:<\/p>\n
Jak za\u0142o\u017cy\u0107 konto Firebase?<\/strong><\/p>\n
Krok 1:<\/strong>\ufffdZaloguj si\u0119 do Google Firebase<\/p>\n
![\"baza](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/1.png\")
<\/p>\nKrok 2:<\/strong>\ufffdUtw\u00f3rz nowy projekt Gdy klikniesz na Dodaj projekt, pojawi si\u0119 nast\u0119puj\u0105ce okno dialogowe:<\/p>\n
![\"tworzenie-projektu\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/2.png\")
\nUtworzenie projektu zajmie kilka sekund. Gdy projekt b\u0119dzie gotowy, kliknij kontynuuj.<\/p>\n![\"kontynuuj-projekt\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/3.png\")
<\/p>\nKrok 3:<\/strong>\ufffdZarz\u0105dzaj ustawieniami projektu Po utworzeniu projektu kliknij Ustawienia projektu.<\/p>\n
![\"ustawienia](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/4.png\")
<\/p>\nKrok 4:<\/strong>\ufffdPrzejd\u017a do opcji uwierzytelniania:<\/p>\n
![\"opcje](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/5.png\")
\nKrok 5:<\/strong>\ufffdZnajd\u017a klucze Firebase W ustawieniach projektu kliknij Ustawienia wiadomo\u015bci w chmurze. St\u0105d mo\u017cesz bezpo\u015brednio uzyska\u0107 klucz serwera.<\/p>\n![\"klawisz](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/9.png\")
\nKrok 6:<\/strong>\ufffdDodaj swoj\u0105 aplikacj\u0119 internetow\u0105 do Firebase<\/p>\n![\"web-aplikacja-do-firebase\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/7.png\")
<\/p>\n![\"web-aplikacja-do-firebase\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/7-1.png\")
<\/p>\nKrok 7:<\/strong>\ufffdPobierz inne szczeg\u00f3\u0142y zwi\u0105zane z Firebase i wklej je w panelu administracyjnym modu\u0142u PWA.<\/p>\n
![\"firebase-szczeg\u00f3\u0142y\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/8.png\")
<\/p>\nKrok 8:<\/strong>\ufffdPobierz klucz serwera Firebase z karty wiadomo\u015bci w chmurze w Ustawieniach:<\/p>\n
![\"klawisz](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/9-1.png\")
<\/p>\nKrok 9:<\/strong>\ufffdDodaj swoj\u0105 domen\u0119 do uwierzytelniania>>zaloguj si\u0119.<\/p>\n
![\"klucz-serwera-firebase\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/10.png\")
<\/p>\n![\"klucz-serwera-firebase\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/11.png\")
<\/p>\nA) Powiadomienie push o pomy\u015blnym zam\u00f3wieniu:<\/strong><\/p>\n
W\u0142\u0105cz\/wy\u0142\u0105cz automatyczne powiadomienia push, kt\u00f3re maj\u0105 by\u0107 wysy\u0142ane do u\u017cytkownik\u00f3w aplikacji za ka\u017cdym razem, gdy z\u0142o\u017c\u0105 oni pomy\u015blne zam\u00f3wienie z progresywnej aplikacji internetowej OpenCart (PWA).<\/p>\n
![\"zam\u00f3wienie-sukces\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Order-success-.png\")
<\/p>\nB) Powiadomienie push o aktualizacji statusu zam\u00f3wienia:<\/strong><\/p>\n
W\u0142\u0105cz\/wy\u0142\u0105cz automatyczne powiadomienia push wysy\u0142ane za ka\u017cdym razem, gdy status zam\u00f3wienia z aplikacji zostanie zaktualizowany. U\u017cytkownicy aplikacji mobilnej OpenCart PWA mog\u0105 mie\u0107 oko na szczeg\u00f3\u0142y poprzednich zam\u00f3wie\u0144.<\/p>\n
![\"powiadomienie](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Order-status-notification.png\")
<\/p>\nC) Powiadomienie push o porzuconym koszyku:<\/strong><\/p>\n
W\u0142\u0105cz\/wy\u0142\u0105cz automatyczne powiadomienia push wysy\u0142ane do u\u017cytkownik\u00f3w porzucaj\u0105cych produkty w koszyku bez udanego zakupu. To powiadomienie push zostanie wys\u0142ane do u\u017cytkownik\u00f3w automatycznie po wprowadzonym przedziale czasu.<\/p>\n
![\"porzucony](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Abandoned-cart.png\")
<\/p>\n2.3 Historia powiadomie\u0144 push<\/h3>\n
Tutaj b\u0119dzie widoczna pe\u0142na historia powiadomie\u0144 push o pomy\u015blnie wys\u0142anych powiadomieniach push. Administrator sklepu mo\u017ce st\u0105d \u015bledzi\u0107 wcze\u015bniej wys\u0142ane powiadomienia push.<\/p>\n
![\"historia-push-powiadomie\u0144\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/push-notification-history.png\")
<\/p>\nA) Wy\u015blij powiadomienie:<\/strong><\/p>\n
Personalizuj i r\u0119cznie wysy\u0142aj powiadomienia push do u\u017cytkownik\u00f3w OpenCart Progressive Web App (PWA) zgodnie z potrzebami. Administrator sklepu mo\u017ce samodzielnie skonfigurowa\u0107 te powiadomienia i wys\u0142a\u0107 je do u\u017cytkownik\u00f3w OpenCart Progressive Web App (PWA).<\/p>\n
![\"wy\u015blij](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/send-notification.png\")
<\/p>\nUk\u0142ad strony g\u0142\u00f3wnej 2.4:<\/h3>\n
Zaprojektuj i zapisz wiele projekt\u00f3w uk\u0142ad\u00f3w (wyprzeda\u017c, festiwale itp.) I po prostu wybierz odpowiedni z panelu administratora, aby zaktualizowa\u0107 w aplikacji OpenCart Progressive Web App.\ufffd<\/em><\/p><\/blockquote>\n
<\/a><\/p>\nProgresywna aplikacja internetowa OpenCart (PWA) oferuje konfigurowalny ekran g\u0142\u00f3wny, kt\u00f3rego uk\u0142ad mo\u017cna zaprojektowa\u0107 z panelu administracyjnego za pomoc\u0105 kilku klikni\u0119\u0107 mysz\u0105 i przeci\u0105gania. Atrakcyjny uk\u0142ad zgodnie z biegaj\u0105cym festiwalem, wyprzeda\u017c\u0105, okazj\u0105 itp. Z pewno\u015bci\u0105 mo\u017ce pom\u00f3c w poprawie sprzeda\u017cy dzi\u0119ki aplikacjom mobilnym OpenCart PWA.<\/p>\n
![\"uk\u0142ad-strony-g\u0142\u00f3wnej\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/home-page-layout.png\")
<\/p>\nDodaj nowy uk\u0142ad z tej zak\u0142adki lub edytuj poprzednio dodane. Ustawienia konfiguracji strony g\u0142\u00f3wnej oferuj\u0105 nast\u0119puj\u0105ce elementy:<\/p>\n
Najpopularniejsze kategorie:\ufffd<\/strong><\/p>\n
![\"najwy\u017cszej](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Top-category-.png\")
<\/p>\nKwadratowy baner:<\/strong><\/p>\n
![\"kwadrat-baner\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Square-Banner-.png\")
<\/p>\nPoziomy baner przesuwny:<\/strong><\/p>\n
![\"przesuwany](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Sliding-Banner.png\")
<\/p>\nSztandar siatki:\ufffd<\/strong><\/p>\n
![\"banner-siatka\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Grid-Banner.png\")
<\/p>\nBaner odliczaj\u0105cy czas:\ufffd<\/strong><\/p>\n
![\"baner](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Countdown-Timer-Banner.png\")
<\/p>\nProdukty kwadratowe:\ufffd<\/strong><\/p>\n
![\"kwadratowy](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Square-Product.png\")
<\/p>\nProdukty przesuwne:\ufffd<\/strong><\/p>\n
![\"produkty-przesuwne\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Sliding-Products-.png\")
<\/p>\nProdukty sieciowe:\ufffd<\/strong><\/p>\n
![\"produkty-siatki\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Grid-products.png\")
<\/p>\nJak uzyska\u0107 szczeg\u00f3\u0142owe informacje o aplikacji Facebook?<\/h3>\n
Aplikacj\u0119 Facebook mo\u017cna utworzy\u0107, wykonuj\u0105c poni\u017csze czynno\u015bci:-<\/p>\n
Krok 1:<\/strong>\ufffdId\u017a do danego\ufffdURL: https:\/\/developers.facebook.com\/apps\/<\/p>\n
Krok 2:<\/strong>\ufffdKliknij przycisk \u201eDodaj now\u0105 aplikacj\u0119\u201d.<\/p>\n
![\"dodaj-nowa-aplikacja\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/1.jpg\")
<\/a><\/p>\nKrok 3 i 4:<\/strong>Wprowad\u017a nazw\u0119 swojej aplikacji i identyfikator e-mail, a nast\u0119pnie kliknij przycisk \u201eUtw\u00f3rz identyfikator aplikacji\u201d.<\/p>\n
![\"utw\u00f3rz](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/2.jpg\")
<\/a><\/p>\nKrok 5 i 6:<\/strong>\ufffdPo klikni\u0119ciu Create App ID b\u0119dziesz musia\u0142\ufffd przej\u015b\u0107 kontrol\u0119 bezpiecze\u0144stwa, jak pokazano:<\/p>\n
![\"utw\u00f3rz](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/3.jpg\")
<\/a><\/p>\nKrok 7:<\/strong>\ufffdKliknij na zak\u0142adk\u0119 \u201eUstawienia\u201d.<\/p>\n
![\"ustawienie](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/4.jpg\")
<\/a><\/p>\nKrok 8-13:<\/strong>\ufffdDwie opcje b\u0119d\u0105 dost\u0119pne na li\u015bcie rozwijanej, Podstawowe i Zaawansowane, kliknij \u201ePodstawowe\u201d. Nast\u0119pnie wprowad\u017a swoj\u0105 \u201eDomen\u0119 aplikacji\u201d,\ufffd\u201eKontaktowy adres e-mail\u201d, \u201ePrywatno\u015b\u0107\ufffdURL\u201d, \u201eZasady i warunki\ufffdURL\u201d, \u201eDodaj logo\u201d, \u201eWybierz kategori\u0119\u201d i kliknij przycisk \u201eZapisz zmiany\u201d. Domeny aplikacji: twojadomena.com jest\ufffdpoprawna twojadomena.com\/store jest\ufffdnieprawid\u0142owa www.domena.com jest\ufffdnieprawid\u0142owa<\/p>\n
![\"identyfikator-aplikacji](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/5.jpg\")
<\/a><\/p>\nKrok 14:<\/strong>\ufffdTeraz kliknij \u201e+Dodaj platform\u0119\u201d.<\/p>\n
![\"dodaj](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/6.jpg\")
<\/a>
\nKrok 15:\ufffd<\/strong>I wybierz Witryn\u0119 jako Platform\u0119.<\/p>\n![\"wybierz](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/7.jpg\")
<\/a><\/p>\nKrok 16:<\/strong>\ufffdTeraz wprowad\u017a adres URL swojej witryny.<\/p>\n
![\"enter-strony-url\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/8.jpg\")
<\/a>
\nKrok 17 i 18:<\/strong>\ufffdKliknij \u201eProdukty+\u201d i wybierz login Facebook.<\/p>\n![\"Nazwa](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/9.jpg\")
<\/a>
\nKrok 19:<\/strong>\ufffdWybierz sie\u0107 jako platform\u0119 aplikacji.<\/p>\n![\"wybierz](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/10.jpg\")
<\/a><\/p>\nKrok 20:<\/strong>\ufffdTeraz kliknij Zapisz.<\/p>\n
![\"facebook](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/11.jpg\")
<\/a>
\nKrok 21 i 22:\ufffd<\/strong>Kliknij Ustawienia i dodaj prawid\u0142owe identyfikatory URI przekierowania OAuth. Prawid\u0142owe identyfikatory URI przekierowania OAuth: https:\/\/example.com\/pwa-app\/login<\/p>\n![\"przekierowanie-URL\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/12.jpg\")
<\/a><\/p>\nKrok 23 i 24:<\/strong>\ufffdKliknij \u201ePrzegl\u0105d aplikacji\u201d. I zaznacz \u201eUstaw \u201eNazw\u0119 swojej aplikacji\u201d jako publiczn\u0105\u201d na Tak.<\/p>\n
![\"recenzja](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/13.jpg\")
<\/a>
\nOstatni krok:<\/strong>\ufffdSkopiuj identyfikator aplikacji i klucz tajny aplikacji i wklej je w pola w module.<\/p>\n![\"ostatni](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/14.jpg\")
<\/a><\/p>\nJak uzyska\u0107 szczeg\u00f3\u0142owe informacje o aplikacji Google?<\/h3>\n
- \n
- Przejd\u017a do Google Developers Console (https:\/\/console.developers.google.com\/project) lub kliknij link znajduj\u0105cy si\u0119 w prawym g\u00f3rnym rogu odpowiedniej zak\u0142adki na stronie konfiguracji modu\u0142u.<\/li>\n
- Teraz kliknij Utw\u00f3rz projekt po lewej stronie.<\/li>\n
- Wpisz nazw\u0119 swojego projektu i przejd\u017a do nast\u0119pnego kroku.<\/li>\n
- Teraz kliknij APIs and auth-> Credentials z lewego menu, jak pokazano poni\u017cej.<\/li>\n<\/ul>\n
![\"identyfikator-aplikacji-google\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/a.jpg\")
<\/a><\/p>\n- \n
- Kliknij przycisk Utw\u00f3rz nowy identyfikator klienta z prawego panelu ekranu.<\/li>\n
- Przed kontynuowaniem mo\u017ce by\u0107 konieczne wype\u0142nienie formularza na ekranie zgody. Aby to zrobi\u0107, musisz klikn\u0105\u0107 Ekran zgody w lewym menu, jak pokazano na powy\u017cszym obrazku.<\/li>\n
- Wype\u0142nij wyskakuj\u0105cy formularz, podaj\u0105c poni\u017csze dane:<\/li>\n<\/ul>\n
Typ aplikacji:<\/strong>\ufffdAplikacja internetowa.
\nAutoryzowane \u017ar\u00f3d\u0142a JavaScript:<\/strong>\ufffdNazwa domeny Twojego sklepu (https:\/\/www.yourstore.com).
\nAutoryzowany identyfikator URI przekierowania lub URI strony przekierowania Loginizera:<\/strong>
\nhttps:\/\/example.com\/pwa-app\/login<\/p>\n![\"identyfikator-aplikacji-google\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/04\/b.jpg\")
<\/a><\/p>\n- \n
- Teraz kliknij przycisk Utw\u00f3rz identyfikator klienta, aby uzyska\u0107 identyfikator klienta i tajny klucz klienta.<\/li>\n
- Teraz mo\u017cesz u\u017cy\u0107 klucza klienta i identyfikatora klienta, aby umo\u017cliwi\u0107 klientom logowanie si\u0119 do Twojego sklepu przy u\u017cyciu ich konta Google.<\/li>\n<\/ul>\n
2.7 Strony informacyjne:<\/h3>\n
Dodawaj strony CMS w aplikacji i oferuj tre\u015bci informacyjne dla u\u017cytkownik\u00f3w OpenCart PWA Mobile App.<\/p>\n
![\"strony](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Information-pages-.png\")
<\/p>\n3.0 Ekrany aplikacji Front End PWA:<\/h2>\n
3.1 Ekran g\u0142\u00f3wny:<\/h3>\n
![\"home-screen\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Home-screen.png\")
<\/a><\/p>\nEkran g\u0142\u00f3wny aplikacji OpenCart Progressive Web App (PWA) jest w pe\u0142ni konfigurowalny za pomoc\u0105 edytora DIY, jak wyja\u015bniono powy\u017cej na ekranach panelu administracyjnego. Zmie\u0144 wygl\u0105d ekranu g\u0142\u00f3wnego aplikacji w dowolnym momencie i zaoferuj bardziej przyjazny dla u\u017cytkownika i oparty na sprzeda\u017cy wygl\u0105d.<\/p>\n
1. Uk\u0142ad niestandardowy:<\/h4>\n
Korzystaj\u0105c z r\u00f3\u017cnych baner\u00f3w, suwak\u00f3w, element\u00f3w produktu, administrator sklepu mo\u017ce stworzy\u0107 dynamiczny uk\u0142ad zgodnie z potrzebami.<\/p>\n
2. Logo marki:<\/h4>\n
U\u017cyj logo swojego sklepu w g\u00f3rnym nag\u0142\u00f3wku progresywnej aplikacji internetowej OpenCart (PWA).<\/p>\n
3. Torba na zakupy:<\/h4>\n
Ikona koszyka na zakupy w prawym g\u00f3rnym rogu ekranu g\u0142\u00f3wnego umo\u017cliwia u\u017cytkownikom dost\u0119p do ekranu koszyka i sprawdzanie dodanych produkt\u00f3w.<\/p>\n
4. Lewe menu nawigacyjne:<\/h4>\n
Przegl\u0105daj kategorie wy\u015bwietlane w aplikacji PWA z przegl\u0105daniem po lewej stronie menu nawigacyjnego.<\/p>\n
3.2 Menu Akordeon (Pasek Nawigacyjny)<\/h3>\n
Aplikacje mobilne OpenCart PWA s\u0105 wyposa\u017cone w bezproblemow\u0105 i odpowiedni\u0105 kategoryzacj\u0119. U\u017cytkownicy mog\u0105 znale\u017a\u0107 odpowiednie kategorie z lewego menu nawigacyjnego i przegl\u0105da\u0107 produkty. Do menu mo\u017cna r\u00f3wnie\u017c doda\u0107 r\u00f3\u017cne strony CMS oferuj\u0105ce odpowiednie tre\u015bci w aplikacji.<\/p>\n
![\"akordeon-menu-pasek](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Accordion-Menu-Navigation-Bar.png\")
<\/a><\/p>\n1. Moje konto:<\/h4>\n
Opcja Moje konto zawiera wszystkie dane osobowe u\u017cytkownik\u00f3w, w tym wysy\u0142k\u0119 i zam\u00f3wienie. Kupuj\u0105cy OpenCart Progressive Web App mog\u0105 przegl\u0105da\u0107 i aktualizowa\u0107 zapisane informacje.<\/p>\n
2. Kategorie:<\/h4>\n
Kategorie wy\u015bwietlane w lewym menu nawigacyjnym aplikacji OpenCart Progressive Web App s\u0105 takie same, jak dost\u0119pne w sklepie eCommerce.<\/p>\n
3. Strony CMS:<\/h4>\n
R\u00f3\u017cne strony CMS, takie jak O nas, Kontakt, Warunki itp., s\u0105 dost\u0119pne tutaj. Te strony informacyjne mo\u017cna doda\u0107 z panelu administracyjnego rozszerzenia.<\/p>\n
4. J\u0119zyk(i):<\/h4>\n
Opcja j\u0119zyka umo\u017cliwia u\u017cytkownikom aplikacji PWA przegl\u0105danie aplikacji internetowej w \u017c\u0105danym j\u0119zyku.<\/p>\n
5. Waluta(y):<\/h4>\n
Wszystkie waluty dost\u0119pne w Twojej witrynie s\u0105 wy\u015bwietlane tutaj w aplikacji OpenCart Progressive Web App (PWA).<\/p>\n
6. Zaloguj\/Wyloguj:<\/h4>\n
Dzi\u0119ki tej opcji u\u017cytkownicy mog\u0105 \u0142atwo zalogowa\u0107 si\u0119 \/ wylogowa\u0107 si\u0119 z aplikacji OpenCart PWA.<\/p>\n
3.3 Ekran kategorii:<\/h3>\n
![\"kategoria-ekran\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Category-Screen.png\")
<\/a><\/p>\nPozbawione ba\u0142aganu ekrany kategorii z widokiem listy i siatki pozwalaj\u0105 u\u017cytkownikom wybra\u0107 to, co jest dla nich najlepsze z okre\u015blonej kategorii. Ca\u0142y asortyment sklepu pozostanie zsynchronizowany z aplikacj\u0105 mobiln\u0105 OpenC Progressive Web App (PWA), a nowe dodatki i zmiany b\u0119d\u0105 nawet aktualizowane w czasie rzeczywistym.<\/p>\n
1. Widok listy i siatki:<\/h4>\n
Kategorie w aplikacji PWA dla OpenCart mo\u017cna przegl\u0105da\u0107 zar\u00f3wno w widoku listy, jak i siatki.<\/p>\n
2. Sortowanie produkt\u00f3w:<\/h4>\n
Opcja sortowania pozwala kupuj\u0105cym online zaw\u0119zi\u0107 produkty w \u017c\u0105danej kolejno\u015bci sortowania i znale\u017a\u0107 w\u0142a\u015bciwy.<\/p>\n
3. Filtr produkt\u00f3w:<\/h4>\n
Aplikacja mobilna OpenCart PWA oferuje opcj\u0119 filtrowania produkt\u00f3w, co upraszcza wyszukiwanie produkt\u00f3w. Kupuj\u0105cy online mog\u0105 znale\u017a\u0107 po\u017c\u0105dane produkty w kategoriach za pomoc\u0105 filtr\u00f3w dla r\u00f3\u017cnych atrybut\u00f3w, takich jak rozmiar, kolor, cena itp.<\/p>\n
3.4 Ekran produktu:<\/h3>\n
![\"ekran](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Product-Screen-1.png\")
<\/a><\/p>\nEkran produktu progresywnej aplikacji internetowej OpenCart jest tak prosty i intryguj\u0105cy, jak to tylko mo\u017cliwe. Dzi\u0119ki wszystkim niezb\u0119dnym opcjom i informacjom o produkcie, u\u017cytkownicy staj\u0105 si\u0119 kwesti\u0105 kilku minut, aby mie\u0107 pewno\u015b\u0107 co do produktu, kt\u00f3ry zamierzaj\u0105 kupi\u0107. Dost\u0119pnych jest wiele obraz\u00f3w dla produktu z opcjami W magazynie i Brak w magazynie.<\/p>\n
1. Informacje o produkcie i piel\u0119gnacja:<\/h4>\n
Tutaj zostan\u0105 wy\u015bwietlone pe\u0142ne informacje o produkcie dost\u0119pne w ekwipunku.<\/p>\n
2. Kr\u00f3tki opis:<\/h4>\n
U\u017cytkownicy mog\u0105 zapozna\u0107 si\u0119 z kr\u00f3tkim opisem Twojego produktu, aby szybko podj\u0105\u0107 decyzj\u0119 o zakupie.<\/p>\n
3. Opcje produktu:<\/h4>\n
Tutaj wy\u015bwietlane s\u0105 wszystkie opcje zwi\u0105zane z produktem, takie jak rozmiar, kolor itp.<\/p>\n
4. Dodaj do koszyka:<\/h4>\n
Ten przycisk umo\u017cliwia u\u017cytkownikom dodawanie produkt\u00f3w do koszyka. U\u017cytkownicy mog\u0105 dalej przetwarza\u0107 koszyk do zakupu.<\/p>\n
5. Udost\u0119pnianie spo\u0142eczno\u015bciowe produktu:<\/h4>\n
Opcja udost\u0119pniania produktu umo\u017cliwia u\u017cytkownikom udost\u0119pnianie produkt\u00f3w w wielu kana\u0142ach spo\u0142eczno\u015bciowych.<\/p>\n
Ekran logowania 3.5<\/h3>\n
![\"ekran](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Login-Screen-1.png\")
<\/a><\/p>\nAplikacja mobilna OpenCart PWA oferuje opcje logowania spo\u0142eczno\u015bciowego jednym dotkni\u0119ciem i sprawia, \u017ce \u200b\u200bproces logowania \/ rejestracji jest bardziej p\u0142ynny. Progresywna aplikacja internetowa OpenCart oferuje logowanie do Google i Facebooka.<\/p>\n
1. Zaloguj si\u0119:<\/h4>\n
U\u017cytkownicy aplikacji mog\u0105 \u0142atwo uwierzytelnia\u0107 si\u0119 i logowa\u0107 do aplikacji PWA przy u\u017cyciu swoich poprzednich danych logowania e-mail.<\/p>\n
2. Zarejestruj si\u0119:<\/h4>\n
Wszyscy nowi u\u017cytkownicy aplikacji mog\u0105 zarejestrowa\u0107 si\u0119 i utworzy\u0107 swoje konto w sklepie z aplikacji OpenCart PWA. Formularz rejestracyjny prosi tylko o podanie danych niezb\u0119dnych do utworzenia konta.<\/p>\n
3. Zaloguj si\u0119 przez Facebooka:<\/h4>\n
U\u017cytkownicy mog\u0105 logowa\u0107 si\u0119 do aplikacji PWA za pomoc\u0105 swoich po\u015bwiadcze\u0144 konta na Facebooku.<\/p>\n
4. Zaloguj si\u0119 przez Google:<\/h4>\n
U\u017cytkownicy mog\u0105 logowa\u0107 si\u0119 do aplikacji PWA za pomoc\u0105 swoich danych logowania do konta Google.<\/p>\n
3.6 Ekran koszyka:<\/h3>\n
Ekran Koszyk aplikacji mobilnej OpenCart PWA wy\u015bwietli wszystkie produkty dodane do koszyka. U\u017cytkownicy aplikacji mog\u0105 wy\u015bwietla\u0107 nazw\u0119 produktu, ilo\u015b\u0107, ca\u0142kowit\u0105 cen\u0119 i koszt wysy\u0142ki. Na tym ekranie dost\u0119pne s\u0105 nast\u0119puj\u0105ce opcje:<\/p>\n
![\"ekran-koszyka](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Shopping-Cart-Screen-1.png\")
<\/a><\/p>\n1. Zastosuj kupon:<\/h4>\n
Ta opcja umo\u017cliwia u\u017cytkownikom korzystanie z kupon\u00f3w internetowych i zbieranie ofert rabatowych.<\/p>\n
2. Ca\u0142kowita cena produktu:<\/h4>\n
U\u017cytkownicy mog\u0105 zobaczy\u0107 pe\u0142ny koszt swojej torby na zakupy, zanim przejd\u0105 dalej. Jest automatycznie aktualizowany zgodnie z ka\u017cd\u0105 aktualizacj\u0105 o ilo\u015b\u0107 produktu lub nowy dodatek.<\/p>\n
3. Zaktualizuj ilo\u015b\u0107 produktu:<\/h4>\n
U\u017cytkownicy aplikacji PWA mog\u0105 nawet aktualizowa\u0107 ilo\u015b\u0107 produktu za pomoc\u0105 opcji \u201eAktualizuj ilo\u015b\u0107\u201d.<\/p>\n
4. Usu\u0144 produkt:<\/h4>\n
U\u017cytkownicy aplikacji mog\u0105 po prostu usun\u0105\u0107 produkt z koszyka, po prostu dotykaj\u0105c opcji \u201eUsu\u0144\u201d.<\/p>\n
5. Kontynuuj zakupy:<\/h4>\n
U\u017cytkownicy aplikacji mog\u0105 opu\u015bci\u0107 koszyk, aby przegl\u0105da\u0107 wi\u0119cej produkt\u00f3w w Twojej aplikacji.<\/p>\n
6. Przejd\u017a do kasy:<\/h4>\n
U\u017cytkownicy aplikacji PWA mog\u0105 przej\u015b\u0107 dalej do ekran\u00f3w kasy i p\u0142atno\u015bci, klikaj\u0105c opcj\u0119 \u201ePrzejd\u017a do kasy\u201d.<\/p>\n
Ekran kasowania 3.7<\/h3>\n
Progresywna aplikacja internetowa dla OpenCart ma uproszczon\u0105 kas\u0119 na jednym ekranie z tylko istotnymi informacjami. U\u017cytkownicy aplikacji mog\u0105 przegl\u0105da\u0107 pe\u0142ne szczeg\u00f3\u0142y realizacji transakcji, takie jak szczeg\u00f3\u0142y wysy\u0142ki, dane rozliczeniowe, podsumowanie zam\u00f3wienia, komentarz do zam\u00f3wienia, podsumowanie p\u0142atno\u015bci.<\/p>\n
![\"ekran](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Checkout-Screen.png\")
<\/a><\/p>\n1. Szczeg\u00f3\u0142y dotycz\u0105ce wysy\u0142ki i rozlicze\u0144:<\/h4>\n
Ten ekran zawiera szczeg\u00f3\u0142owe informacje o adresach wysy\u0142kowych i rozliczeniowych zapisanych przez u\u017cytkownika. W razie potrzeby u\u017cytkownik mo\u017ce r\u00f3wnie\u017c edytowa\u0107\/zapisywa\u0107 nowy adres wysy\u0142ki.<\/p>\n
2. Podsumowanie zam\u00f3wienia:<\/h4>\n
U\u017cytkownicy aplikacji mog\u0105 zobaczy\u0107 szczeg\u00f3\u0142y produktu przed dokonaniem p\u0142atno\u015bci.<\/h4>\n
3. Metody wysy\u0142ki: Tutaj wy\u015bwietlane s\u0105 wszystkie dost\u0119pne metody wysy\u0142ki. U\u017cytkownicy mog\u0105 wybra\u0107 ten, kt\u00f3ry odpowiada ich potrzebom.<\/p>\n
4. Komentarz do zam\u00f3wienia:<\/h4>\n
U\u017cytkownicy mog\u0105 r\u00f3wnie\u017c doda\u0107 dowolny komentarz zwi\u0105zany z ich zam\u00f3wieniem, kt\u00f3ry b\u0119dzie widoczny dla administratora sklepu na stronie zam\u00f3wienia w zapleczu.<\/p>\n
6. Podsumowanie p\u0142atno\u015bci:<\/h4>\n
Ta sekcja wy\u015bwietla pe\u0142ne szczeg\u00f3\u0142y p\u0142atno\u015bci za awari\u0119 zwi\u0105zane z zakupem.<\/p>\n
7. Przejd\u017a do p\u0142atno\u015bci:<\/h4>\n
U\u017cytkownicy aplikacji PWA zostan\u0105 przekierowani do ekranu P\u0142atno\u015bci po naci\u015bni\u0119ciu przycisku \u201ePrzejd\u017a do p\u0142atno\u015bci\u201d.<\/p>\n
3.8 Ekran p\u0142atno\u015bci:<\/h3>\n
Ekran p\u0142atno\u015bci aplikacji OpenCart PWA zawiera wszystkie dost\u0119pne w sklepie p\u0142atno\u015bci internetowe. Kupuj\u0105cy online mog\u0105 znale\u017a\u0107 podobne sposoby p\u0142atno\u015bci zar\u00f3wno na stronach internetowych, jak i w aplikacjach.<\/p>\n
![\"ekran](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Payment-Screen-1.png\")
<\/a><\/p>\n3.9 Ekran Mojego Konta<\/h3>\n
![\"ekran-moje-konto\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/My-Account-Screen-1.png\")
<\/a><\/p>\n![\"ekran-szczeg\u00f3\u0142owy-zam\u00f3wienia\"](\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2020\/06\/Order-Detail-Screen.png\")
<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"