E-commerce
3 godz. 52 min · Webflow · UI, UX i Webdesign
Grzegorz RógIdea ArchitectZ pomocą Webflow, stworzysz gotowe, zaawansowane rozwiązanie e-commerce, z pomocą wizualnego interfejsu. Pod spodem działa rozwiązanie bazodanowe, które w gui pozwala Ci łatwo definiować i edytować produkty, kraje wysyłki, ceny a także spiąć całość z jednym z najnowocześniejszych systemów płatności - Stripe. Aby stworzyć sklep, nie potrzebujesz jednak wiedzy programistycznej, wszystko wykonasz wewnątrz kreatora Webflow.
Webflow pozwala na przygotowanie wyglądu Twojego sklepu, który jest w pełni dostosowany do Twoich (lub Twojego klienta) potrzeb. Możesz wdrożyć dowolny projekt, stworzyć i zaprojektować stronę produktu, koszyka, a także pozostałe podstrony sklepu. Dodatkowo, możesz łatwo rozbudować go nie tylko o statyczne, ale i dynamiczne podstrony, wykorzystując CMS. W ten sposób dodasz do swojego sklepu np. bloga.
O ile sklepy, które sprzedają lokalnie wysyłkowe produkty mogą na ten moment nie być najlepszym wyborem pod Webflow, głównie z uwagi na system wysyłek i płatności, to jeśli rozważasz sprzedaż na cały świat, Webflow posiada kilka naprawdę ciekawych rozwiązań. Kolejne ciekawe zastosowanie e-commerce w Webflow to możliwość sprzedaży produktów cyfrowych - jak e-booki, kursy wideo i inne. To obecnie jeden z najlepszych systemów dla twórców, którzy chcą sprzedawać w sieci, również na cały świat.
W kursie skupimy się na przygotowaniu bardzo praktycznego rozwiązania. Pokażę Ci jak wdrożyć w Webflow kompletny system e-commerce, który odwzorowuje dokładnie istniejący sklep zaprzyjaźnionej marki MKTP (polecamy!). Dzięki temu na rzeczywistych danych postaram się pokazać Ci jak może wyglądać wdrożenie projektu w Webflow.
Choć Webflow nie posiada tysięcy wtyczek, jak WooCommerce, ma też w stosunku do innych systemów dość istotne przewagi - możliwość hostowania i skalowania Twojej strony niezależnie od ruchu, profesjonalny system do tworzenia customowych szablonów i wiele więcej. Tam, gdzie brakuje funkcjonalności, możemy jednak wspierać się automatyzacjami. W kursie dowiesz się jak połączyć Webflow z Zapier czy Integromat, aby stworzyć rozmaite procesy wokół zakupów. Dodatkowo, możesz rozszerzyć jego możliwości o lepszy koszyk np. z pomocąć Foxy Cart i innych rozwiązań, które dają wiele możliwości!
Webflow oferuje szereg narzędzi ułatwiających modyfikację sklepu jak i zarządzanie stanem magazynowym i przyjmowanymi zamówieniami z pomocą przeglądarki - obsługa sklepu może w ten sposób łatwo dokonywać zmian i monitorować zamówienia. Dodatkowo, do sklepu można dorobić szereg automatyzacji. Jeśli zarządzasz wieloma sklepami dla klientów, możesz uruchomić opcję billing - ciekawy wariant w którym klienci opłacają wszystkie usługi a także Twoje usługi utrzymania serwisu.
Kurs został przygotowany z myślą o tych z Was, którzy znają już Webflow i chcą zacząć budować sklepy internetowe dla siebie, lub oferować taką usługę swoim klientom. Webflow to także jedno z najlepszych narzędzi pozwalających sprzedawać na cały świat cyfrowe produkty - będzie więc świetnym rozwiązaniem dla twórców, którzy myślą o takich przedsięwzięciach. Zdecydowanie polecamy jednak wcześniej zapoznać się z pozostałymi kursami Webflow, a także kursem HTML od Podstaw. Web Developerzy mogą także wykorzystać platformę e-commerce w Webflow do szybszych wdrożeń a także rozbudowania swojego portfolio o modną, rosnącą w siłę usługę.
Cześć Witaj w kolejnej lekcji którą zatytułował pomysły i to nie bez powodu
dlatego że nie chciałbym ci tutaj dawać kompletnego gotowego rozwiązania.
Pewnie musielibyśmy nad nim popracować
nawet przez parę godzin żeby było kompletne.
Ale chciałbym dać ci pewne wytyczne i
sugestie dotyczące tego jak możesz dalej pracować z danymi z Web flow.
Jak możesz te dane dalej gdzieś przekazywać tworzyć sobie swój własny CRM
z klientami zarządzać tymi klientami zarządzać również fakturami i rachunkami.
Może księgowości.
Mam nadzieję że to otworzy twoją głowę na
pewne możliwości które daje nam integracja z UE np.
przez Intel gromad czy zapier.
I przekazywanie tych danych dalej i w tym celu żeby też przetestować działanie
robota chciałbym uruchomić na razie scenariusz wybieram polecenie ONZ i czekam
w tym momencie na dane będziemy musieli złożyć nowe zamówienie na naszej stronie a
więc wybierzmy jakiś produkt i dodajemy go do koszyka np.
ja chciałbym przejść znowu przez cały
proces zamówienia wybieram polecenie a karty musimy wybrać rozmiar i wariant.
I teraz przejdźmy do płatności Continuum
doczekały się te dane zostaną wysłane zaraz do groma tu
zapisujemy kod który pozwoli nam pracować za darmo i wypełni znów przykładowe dane.
I w tym momencie nasze zamówienie jest
składane a ja dostałem już wszystkie dane i zostały też one pomyślnie zapisane BHP
robota można sprawdzić w Sopocie czy nawet klient został utworzony.
Tam wszystko jest OK a dodatkowo mam tutaj
różne informacje które teraz pozwolą mi trochę lepiej poruszać się po tych danych
które zostały przesłane po to aby na przykład wystawić automatycznie fakturę i
wysłać ją do klienta chciałbym pokazać Ci to w tej lekcji jak można to zrobić a
przynajmniej jak można podejść do tego zadania więc zostawię sobie tutaj router
po to żeby stworzyć jeszcze jedną operację i skorzystam z takiego serwisu jak wojsk
ninja Wind bądź ninja też trzeba się wcześniej zarejestrować.
No i tutaj mamy naprawdę sporo rzeczy które możemy zrobić ta która
będzie nas najbardziej interesowała to możliwość wystawienia faktury.
żeby jednak taką fakturę wystawić.
Czyli żeby skorzystać z polecenia ten
wojsk najpierw trzeba mieć klienta któremu tę fakturę będziemy mogli przyporządkować
czyli wybieramy najpierw stworzenie klienta jest to opcja klient klient
i będziemy chcieli dodać dane tego klienta czyli jego imię mamy imię i nazwisko które
jest w CUSTOMER info przekazujemy full name.
Możemy przekazać też wszystkie dane adresowe.
I one też będą widoczne później na fakturze.
W związku z tym przejdźmy do danych z
sekcji bilingi adres bo to właśnie one powinny się znaleźć na fakturze.
Wypełniamy sobie adres i tutaj jest
ulica jeszcze test 1 2 3 podaliśmy Sid i też było przez nas wypełnione.
Dzięki temu że mamy dane
tutaj trochę łatwiej jest teraz namierzyć te informacje które przekazaliśmy State.
Niekoniecznie aczkolwiek jest tutaj też w
danych nie wypełnić ale możemy go przekazać.
Kod pocztowy jest dostępny numer telefonu nie mamy go i ewentualnie jakieś Custom
Files można dodać do tego klienta czyli jakieś specjalne pola i informacje o nim
na przykład można tutaj dodać informację o jego pierwszej rejestracji itd.
Ale my zostawimy to w ten sposób wybieram polecenie OK.
Następnie dodam kolejny moduł ninja.
Po stworzeniu klienta będziemy chcieli
właśnie utworzyć dla niego fakturę czyli Create.
I teraz już będziemy mieli dane klienta bo
będziemy chcieli te dane z mapą czyli zaznaczam te opcję map
i będziemy chcieli przekazać tutaj klient IP z poprzedniego modułu.
W ten sposób zaznaczyć my tego klienta w systemie i dla niego wystawimy fakturę
data stworzenia tej faktury to będzie data zaakceptowania zakupu ewentualnie możemy
tę datę pobrać i wybrać tutaj datę aczkolwiek dla nas
w tym przypadku sensowne będzie właśnie data zamówienia datę możemy zostawić puste
ale XML czyli produkty które kupił nasz klient musimy dodać mamy tu ich nazwę mamy
kwotę również ich ilość i jakieś również informacje o podatkach itd.
Więc co możemy z tym zrobić.
Na chwilę wybiorę ok i skąd możemy wziąć te dane.
Oczywiście one są tutaj w specjalnej tablice jest to tablica PL.
I na razie mam jeden kupiony element czyli
gdybym miał ich więcej byłoby to osobne kolekcje 1 2 3 itd.
W takich kolekcjach mam informację o tym
ile produktów zostało kupionych m.in. również mam ich nazwę.
Mam też informacje o cenie Total.
Jest to wartość 49.
I tutaj mamy właśnie walił i ewentualnie String nas będzie interesowało walił
ponieważ pozwoli nam pobrać dane numery na ocenie jeśli chodzi o pozostałe elementy
pozostałe informacje mamy też wariant Price obrazki itd.
To nie będzie nam do końca potrzebne.
Dużą zaletą korzystania z Znicza jest
jednak to że z jego pomocą będziemy mogli automatycznie przeliczyć.
Podatków na fakturze czego niestety na razie nie robi.
Alternatywnym sposobem który ewentualnie moglibyśmy wykorzystać.
Czy to z wojsk Ninja czy bez. I np.
wystawiać faktury w trochę inny sposób na bazie np.
jakiegoś szablonu mogłoby być zapisanie tych danych jeszcze pośrednio np.
b r tabel czy do Excela co umożliwiłoby nam stworzenie kalkulacji w takim arkuszu
kalkulacji wyliczenie podatków dla poszczególnych systemów no i wtedy
przekazanie ich do jakiegoś narzędzia które np.
wygeneruje nam z tego PDF a jest to też
możliwe w macie tutaj druk jest na pewno sporo.
Ja w zasadzie nie chcę pokazywać ci kompletnego rozwiązania bo ono na każde
potrzeby w zasadzie będzie inne i wymaga konsultowania z doradcą podatkowym z twoim
księgowym to jak te faktury powinny być wystawiane.
Natomiast chcę otworzyć swoją głowę na pewne możliwości jakie tutaj się kryją.
No i właśnie np. z pomocą wojsk.
To co będziemy mogli zrobić tutaj to zostawmy to datę i jeśli chodzi o XML.
Na razie spróbujmy to symulować dla jednego produktu który mamy kupiony zaraz
pokażę ci jak można to zrobić więcej niż jednego produktu.
W każdym razie mamy tutaj do podania nazwę
produktu no i oczywiście przechodzimy do sekcji w której znajdują się.
Tutaj wybierzemy produkt name.
Czy to będzie ta pierwsza kolekcja.
Kolejne mamy remont czyli kwota to też
musimy wybrać i sprawdzić jest system znajduje się tutaj Total value.
Wydawało mi się że jestem z formatów od 49 00 jednym ciągiem.
W związku z tym musimy jeszcze skorzystać
z takiej funkcji ma funkcję zintegrować po to żeby sformować sobie ten numer.
Czyli przekazujemy tutaj na samym początku to co chcemy.
Forma 49 00 i mówimy ile miejsce ma odliczyć od prawej strony i to będą w
naszym przypadku dwa domyślne domyślnie zostanie wystawiona kropka.
Dla tysięcy zdaje się przecinek dla tych
części i zostanie to poprawnie czy powinno być poprawnie sformułowane.
Możesz ten format Number sobie jeszcze eksperymentować Quintet czyli ilość
zamawianych elementów przypominam dla tego jednego na tej pierwszej kolekcji.
Czyli wybieramy ale skąd jakaś notka którą możemy dodać Custom owe pola.
Nie potrzebujemy tego.
No i tutaj właśnie możemy przekazać nam
czy przykładowo możemy przekazać że wartość podatku
VAT będzie wynosiła 23 i dzięki temu in India będzie potrafił dla takiego systemu
po prostu dynamicznie wyliczyć sobie stawki podatków i umieścić je na fakturze.
To daje teraz ten model mówi wygląda to w ten sposób mamy jeden system który
znajdzie się na fakturze ale tych systemów oczywiście możemy dodawać więcej.
I teraz co jest istotne gdyby tych umów
było więcej to możemy tutaj został wygenerowany taki format tej kolekcji
która zostaje może zostać przyjęta przez moduł widza czyli my mamy
tak naprawdę taki schemat w którym jest nazwa klucz później ma dwa wątki itd.
I my jesteśmy w stanie jeżeli teraz
zatwierdzi te zmiany gdzieś wcześniej sobie wygenerować taki model.
Czyli możemy i chcę to o tym wspomnieć nie będę chciał tego
dokładnie przerabiać tak czy inaczej powinieneś z tym eksperymentować
we własnym zakresie i też z wystawiania faktur bo nie jest to kompletne
rozwiązania a jedynie jakieś sugestie jak mógłbyś to zrobić.
Natomiast to co bym proponował to właśnie zrobić sobie imperator
który będzie sterował po każdym z elementów czy każdym z tych elementów
kolekcji który znajdzie się de facto w parku.
M.S. Czyli tutaj będziemy chcieli przejechać po wszystkich elementów
elementach kolekcji jest hitem i flow Control i operator przejmuje właśnie jako
dane wejściowe taką tablicę którą musimy przekazać czyli tą tablicę.
Jest w ten sposób a później dodamy jeszcze jeden moduł który będzie po drodze.
I będzie to znowu.
W tym przypadku będzie to Gmail czyli coś co pozwoli nam
te wszystkie dane sterowane za nową tablicę po co nam jest nowa tablica.
Będziemy
mieli Imperator a nowa tablica jest nam
potrzebna po to żebyśmy mogli stworzyć w ramach tej tablicy strukturę danych.
I tutaj co ciekawe ta struktura danych
jeśli ją wybierzemy zobaczy że mamy coś takiego jak im wojsk ninja kryje
i dwoje czyli z tego modułu automatycznie może zostać zaciągnięte za czytamy.
To jest bardzo fajna opcja czyli ja nie muszę definiować sobie nowej struktury
danych ponieważ i nazywać tak samo tych kluczy które tam są tylko mogę skorzystać
z tej struktury danych która już jest zrobiona dzięki temu że mieliśmy tam
przykładowe dane do faktury i zobacz że i my możemy sobie teraz tutaj poukładać.
Czyli możemy w tym miejscu dodać nazwę i z naszej kolekcji tworzonej przez
Imperator będziemy mogli wyciągnąć tutaj te wszystkie dane.
Interesuje nas product name.
To będzie kwota którą znów powinniśmy funkcją matematyczną sformułować
odpowiednio ale ja już nie będę tego robił bo to tylko przykład.
Wybierzemy could not nie wybieramy i.
Możemy też wprowadzić sobie VAT.
I tak straty 23 na przykład i zapisując taki model będziemy
mieli możliwość przetworzenia wielu różnych produktów.
Czyli każdy bank który zostanie zwrócony jako kupiony produkt
zostanie osobno kierowany przez literaturę i zgromadzony w jedną tablicę która jest
zgodna z formatem tym który przejmuje Liga ja w tym miejscu.
Ostatnia rzecz która będzie do zrobienia
to przekazanie do niego informacji że właśnie nie ma korzystać z tych danych a z
tych danych które zostaną uregulowane w tablicy wybieram opcję map.
W związku z tym to co będziemy chcieli
smakować to będzie tablica która jest generowana przez nasz
generator czyli całą tą tablicę ona już jest w dobrym formacie bo ten
format został zaczerpnięty przekazujemy w to miejsce kolejne pola które tutaj mamy
to bliska i tutaj także trzeba było przekazać informację o zniżce.
Te informacje wszystkie tutaj są natomiast trzeba będzie znowu to teraz jest coś
takiego jak ekstra trzeba będzie znowu przeliczyć sobie to odpowiednio czyli tą
wartość walutę trzeba będzie za pomocą funkcji matematycznych zamienić z formatu
zamienić na wartość pozytywną z negatywnej.
No i wtedy może zostać przekazana już idę tutaj trochę na skróty bo moim zadaniem
nie jest przygotowanie takiego w pełni działającego systemu wystawiania faktur
zwłaszcza dlatego że bardzo dużo ustawień może się po prostu zmienić w lidze i
często też to się zmienia więc może to być za jakiś czas nieaktualne chcę jedynie
przekazać taką ideę jak to można zrobić jakimi funkcjami się wspomóc a samą
implementację chce zostawić tobie jako zadanie domowe.
Tak nam znowu tutaj dla całego zamówienia dali byśmy VAT i stawkę VAT np.
23.
I mamy jeszcze do dyspozycji jakieś
zaawansowane rzeczy tutaj jako Numer możemy generować sobie numer jeśli nie
zrobimy tego I liga wystawi kolejną fakturę zgodnie z numerację którą mamy w
ustawieniach itd więc parę rzeczy jeszcze można tutaj dodać.
Moim zadaniem tutaj było pokazać Ci że
rzeczywiście nie jest to może takie łatwe żeby wystawić jakieś swoje własne
dokumenty czy przeliczyć podatki i wysyłać do klienta.
Ale jest możliwe.
No właśnie a jeśli chodzi o kwestię wysyłania do klienta to moglibyśmy znów to
zrobić w kolejnym module czyli w Dwójce lidze.
Moglibyśmy wybrać teraz polecenie email
and in voice in Voice IP zostałoby zwrócone przez ten nasz poprzedni moduł.
Wystarczy się pobrali byśmy Invisible.
I wtedy moglibyśmy wysłać taką fakturę skąd liczba wie do jakiego klienta ją
wysłać no stąd że najpierw otworzyliśmy klienta a następnie napisaliśmy do niego
tę fakturę więc to do niego ta faktura w mailu zostałaby wysłana.
Tego typu automatyzacja możesz
rozbudowywać o kolejne moduły i choć robi się ona już trochę skomplikowana to
naturalnie można tutaj bardzo dużo rzeczy jeszcze dodać.
Można dać notyfikacji dla nas dla naszego zespołu np.
na szlaku że faktura została wysłana można
dodać sobie jeszcze jeden kolejny moduł i np.
z pomocą RTL logować wszystkie rekordy.
Tak jak powiedziałem wcześniej można to robić już nic.
Można to robić do RTL bo można utworzyć sobie osobne takie mini bazy danych.
Po pierwsze z klientami.
Drugi taki arkusz mógłby zawierać
informacje ogólne o zamówieniu a trzeci arkusz mógłby zawierać szczegóły
zamówienia bo moglibyśmy wszystkie te arkusze pod linkiem połączyć ze sobą i w
ten sposób wiedziałby miałby całą strukturę klientów wiedziałby
jaki klient złożył zamówienie a także jakie zamówienie ma jakie poszczególne.
Dzięki temu mielibyśmy wszystko w jednym arkuszu i np.
mogłoby nam to posłużyć później do tego
żeby przygotować sobie chociażby jakiś email cotygodniowe podsumowanie wszystkich
zamówień bo oczywiście mogłoby je też zliczyć podobnie jak gdyby już nic
policzyć sobie łączne kwoty moglibyśmy stamtąd przygotować jakiś dash board z
którego przekażemy dynamicznie dane więc masę rzeczy można tutaj zrobić.
A tą lekcję specjalnie zacząłem jako pomysły po to żeby właśnie trochę takich
pomysłów rzucić ale zostawić sobie ich implementację ponieważ ona
musiałaby zająć jeszcze naprawdę dość dużo czasu żeby zrobić to porządnie.
Również w kontekście samych tych faktur.
Tutaj także kilku rzeczy nie wzięliśmy pod uwagę.
Przykładowo wysyłka ona powinna być też kolejnym etapem który tutaj możemy za
pomocą innego modułu i dopisać ją do faktury.
Moglibyśmy pomyśleć też o tym aby najpierw szukać klientów czy oni już istnieją w
bazie naszych klientów a dopiero później jeżeli istnieją w
zależności od tego aktualizować na nich dane albo dodawać nowego klienta.
Tak jak wspomniałem masa rzeczy jest tutaj ewentualnie do zrobienia.
Same takie faktury możemy z niej też
automatycznie przykładowo zapisywać na jakiegoś Dropbox a po to żeby później
mogły zostać wysłane w linku też automatycznie do
naszego biura rachunkowe które je wszystkie księgowe.
No ale to zostawiamy.
Ta część pomysłów dotyczyła rozliczeń i zarządzania naszymi klientami tworzenie
jakiegoś repozytorium danych z danymi klientów przekazywania ich dalej i
gromadzenia tak abyśmy mogli nimi łatwiej zarządzać.
Dzięki za uwagę i do usłyszenia w kolejnej elekcji.