Sprzedawaj Co Chcesz Przy Pomocy Drupal Commerce – Konfiguracja Atrybutów Produktów
Atrybuty to cechy charakterystyczne dla danych typów produktów. Przykładowo, gdy sprzedajesz swoje autorskie koszulki to dzięki atrybutom nie musisz dodawać oddzielnych produktów, gdy chcesz dodać kolejny rozmiar czy kolor koszulki. Tworzysz jeden produkt, dodajesz atrybut rozmiar oraz kolor i tworzysz kolejne wariacje tego samego produktu. Chętnie powiemy, jak w prosty sposób dodać atrybuty do produktów dla kilku wybranych branż. Jesteśmy agencją Drupalową i zajmujemy się tym na co dzień.
Tematy poruszone we wpisie
- dodawanie produktów i tworzenie ich wariacji
- dodawanie atrybutów do produktów
- typowe atrybuty dla sklepu z koszulkami
- jak dodać atrybut koloru z podlinkowanymi kolorowym elementem
- dodawanie atrybutu rozmiaru odzieży
- atrybuty dla sklepu z elektroniką
Dzięki temu klient może łatwo dodać do koszyka interesujący go wariant produktu, bez konieczności przechodzenia na kolejną podstronę z innym produktem.
Atrybuty produktów w Drupal Commerce
Wpis jest kontynuacją serii dotyczącej modułu Commerce służącego do rozszerzenia Drupala o platformę e-commerce. Poprzednia część z podstawowej konfiguracji Commerce.
Nowe atrybuty dodajemy do wariacji produktu (product variation). Wariacja produktu jest powiązana referencją z produktem. Dzięki temu tworzymy jeden produkt np. Koszulka z logiem Droptica i od niego dodajemy wariacje, które różnią się atrybutami. Atrybutem może być kolor lub rozmiar koszulki. Każda wariacja może też różnić się ceną.
Zacznij od stworzenia nowego typu produktu - Tshirt
Z menu admina Commerce → Configuration → Products → Product types
Dodaj nowy produkt.
→ wpisz label
→ zaznacz, aby produkt mógł mieć wielokrotne wariacje
→ Product variation type – zaznaczając Create new automatycznie stworzy się nowy typ wariacji o takiej samej nazwie jak typ produkty, w tym przypadku tshirt. Możesz też wybrać istniejący już typ wariacji.
Jeżeli ustawiłeś Create new w polu wariacji to po zapisaniu nowego typu produktu, przechodząc na
Commerce → Configuration → Products → Product variation types zobaczysz nowy typ wariacji
Atrybuty produktu dla sklepu z koszulkami / odzieżą
Dwa typowe atrybuty dla sklepu tego typu to kolor oraz rozmiar.
Kolor.
Standardem w przypadku wyboru koloru jest stworzenie podlinkowanego koloru, gdzie po jego kliknięciu ładuje się odpowiednia wariacja produktu.
Drupal Commerce w bardzo prostu sposób pozwala uzyskać taki efekt.
Lista atrybutów i możliwość ich tworzenia znajdują się w Commerce → Product Attributes
Dodaj nowy atrybut klikając w przycisk Add product attribute
dodaj jego nazwę - Color,
typ elementu – na teraz ustaw Select list,
oraz wariację produktu, do której ma zostać podpięty – Tshirt,
Po zapisaniu dodaj wartości kolorów wedle uznania.
Teraz stwórz nowy produkt typu Tshirt i dodaj do niego kilka wariacji, tak aby zobaczyć jak działają atrybuty.
Dla różnych wariacji ustaw różne ceny, wtedy zobaczysz, że po zmianie atrybutu cena zmieni się automatycznie.
Atrybut koloru znajduje się w formularzu tworzenia wariacji produktu.
Po przejściu na stronę główną produktu będzie widoczna lista wyboru z kolorem.
Zmiana listy wyboru na linki z kolorami.
Żeby uzyskać taki efekt, potrzebne jest dodanie nowego modułu - Color Field
Po włączeniu modułu dodaj nowe pole do atrybutu koloru.
Robisz to w taki sam sposób jak do każdej innej encji w Drupalu.
Przejdź do Commerce → Product attributes
I wybierz link Manage fields
Dodaj nowe pole typu Color
Zapisz ustawienia
Kolejny krok w konfiguracji to zmiana wyświetlania pola koloru w zakładce do zarządzania wyglądem formularza jak i wyglądem pola w momencie gdy przeglądamy produkt.
Zarządzanie wyglądem formularza.
Ustaw aby oba pola były widoczne. To sprawi, że w momencie edycji atrybutu masz możliwość ustawienia nazwy koloru jak i jego wartości w HEX.
Zarządzanie wyświetlaniem.
W tym przypadku zostawimy jedynie wyświetlanie koloru a ukryjemy jego nazwę. W formacie ustaw – Color swatch.
Dzięki temu pojawią się kolorowe kwadraty z możliwością wyboru koloru. Klikając w zębatkę ustawień możesz zmienić wielkość tych kwadratów lub zamienić je na owale.
Ostatni krok to zmiana ustawień w samym atrybucie.
Przejdź do jego edycji.
Zmień Element type na Rendered attribute oraz w poszczególnych kolorach dodaj wartości hex.
Po zapisaniu ustawień na stronie produkty zamiast listy wybory atrybuty będą podlinkowanymi kolorowymi kwadratami.
Atrybuty do sklepu z elektroniką
Jednym z produktów spotykanym w sklepie z elektroniką są laptopy.
Typowe atrybuty dla tego typu produktu to:
- preinstalowany system operacyjny
- ilość pamięci RAM
- wielkość dysku SSD
oraz kilka innych, ale na potrzeby tego wpisu pokażę jak dodać te trzy.
Atrybuty dodaje się analogicznie jak we wcześniejszym przykładzie odnośnie sklepu z koszulkami.
Wynikiem konfiguracji będzie
- lista wyboru z systemem operacyjnym
- klikalne ilości pamięci RAM do wyboru
- przyciski radio z wyborem wielkości dysku SSD
Zakładam, że w sklepie jest już dodany typ produktu oraz wariacja produktu – Laptop
Konfiguracja dla atrybutu systemu operacyjnego.
Konfiguracja atrybutu pamięci RAM
Konfiguracja atrybuty wielkości dysku SSD
Podsumowanie
Jak widzisz atrybuty do produktów w sklepie opartym o Drupal Commerce dodaje się w bardzo łatwy i szybki sposób.
Wprowadzając je, ułatwisz potencjalnym klientom szybsze znalezienie właściwego produktu, a sobie dasz szansę na zwiększenie obrotów.
