Jak stworzyć domyślne atrybuty w WooCommerce

Opublikowany: 2020-05-27

Dzisiaj pokażemy, jak tworzyć domyślne atrybuty produktu w WooCommerce za pomocą wtyczki, ręcznie z pulpitu WooCommerce i programowo przez PHP . Zwykle jest to pomijane, ale może mieć ogromny wpływ na współczynniki konwersji produktów zmiennych.

Czym są atrybuty WooCommerce?

WooCommerce umożliwia dodawanie informacji do produktów poprzez atrybuty. Możesz zastosować te atrybuty do dowolnych nowych lub istniejących produktów. Na przykład wspólne atrybuty to rozmiary i kolory ubrań, system operacyjny telefonów komórkowych i tak dalej. Te atrybuty są globalne, co oznacza, że ​​zamiast ustawiać atrybut rozmiaru i koloru dla każdego nowego produktu, na przykład tworzysz predefiniowane atrybuty Rozmiar i Kolor i stosujesz je do różnych produktów. W WooCommerce atrybuty są bardzo ważne, aby:

  • Filtruj produkty : użytkownicy mogą filtrować produkty na podstawie określonego atrybutu. Na przykład dżinsy średniej wielkości.
  • Utwórz produkty zmienne : aby utworzyć odmiany produktu, najpierw musisz zdefiniować dla niego atrybuty. Gdy masz już atrybuty, możesz ich używać do tworzenia różnych odmian produktu. Jeśli więc na przykład sprzedajesz dżinsy, oznacza to, że nie możesz tworzyć różnych rozmiarów dżinsów, jeśli nie utworzyłeś dla nich atrybutu rozmiaru.

Teraz lepiej zrozummy, dlaczego domyślne atrybuty są tak ważne dla każdego sklepu WooCommerce.

Po co tworzyć domyślne atrybuty produktów?

Jedną z pierwszych rzeczy, których nauczyliśmy się, kiedy zakładaliśmy nasz sklep internetowy, było znaczenie tworzenia domyślnych atrybutów produktów. Na początku nasze współczynniki konwersji nie były zbyt dobre i wielu naszych użytkowników twierdziło, że przycisk Dodaj do koszyka jest wyłączony.

Jednak za każdym razem, gdy sprawdzaliśmy, wszystko działało dobrze. Najgorsze jest to, że traciliśmy dużo sprzedaży, ponieważ wielu z tych kupujących nigdy nie wróciłoby do naszego sklepu. Dlaczego mieliby, skoro nie mogli kupić? Zajęło nam trochę czasu, zanim zdaliśmy sobie sprawę, że problem polegał na tym, że nie ustawiliśmy domyślnych atrybutów produktu w WooCommerce.

Odmiany produktu i domyślne atrybuty

Jak zapewne wiesz, w WooCommerce istnieją 4 rodzaje produktów: proste, zmienne, pogrupowane i zewnętrzne/stowarzyszone. Dzisiaj skupimy się na produktach zmiennych i ich domyślnych atrybutach. Tworząc odmiany produktów w WooCommerce, powinieneś utworzyć domyślną kombinację tych atrybutów. W przeciwnym razie przycisk dodawania do koszyka na stronie produktu będzie wyświetlany jako wyłączony, dopóki użytkownicy nie wybiorą żądanej kombinacji atrybutów.

Problem w tym, że wielu z nich po prostu widzi, że przycisk jest zablokowany, myśli, że strona nie działa i wychodzi. Dlatego jeśli masz w swoim sklepie WooCommerce produkty zmienne, tworzenie domyślnych atrybutów produktu jest koniecznością .

Domyślne atrybuty produktu WooCommerce - Przycisk Dodaj do koszyka wyłączony
Kolor i rozmiar nie mają wartości domyślnych, więc przycisk Dodaj do koszyka jest wyłączony

Jak stworzyć domyślne atrybuty produktu w WooCommerce?

Istnieją trzy sposoby tworzenia domyślnych atrybutów produktu w WooCommerce :

  1. Z wtyczką
  2. Ręcznie przez administratora WooCommerce
  3. Programowo przez PHP

Jeśli nie jesteś programistą, najłatwiej jest użyć wtyczki. Z drugiej strony za pomocą skryptu PHP możesz zrobić to samo z odrobiną kodowania bez instalowania czegokolwiek. Ważne jest, aby pamiętać, że obie metody mogą uzyskać ten sam wynik, więc wybierz najlepszą dla siebie w zależności od swoich umiejętności.

1) Utwórz domyślne atrybuty produktu WooCommerce za pomocą wtyczki

Najprostszym sposobem jest użycie wtyczki do ustawienia domyślnych atrybutów produktu. W tym przewodniku użyjemy Direct Checkout dla WooCommerce. Jest to wtyczka freemium, która ma darmową wersję z podstawowymi funkcjami i 3 planami premium. To narzędzie ma tysiące aktywnych instalacji i jest jednym z najlepszych na rynku.

1. Pierwszą rzeczą, którą musisz zrobić, to zainstalować i aktywować wtyczkę. Przejdź do pulpitu WordPress > Wtyczki > Dodaj nowy . Następnie wyszukaj opcję Direct Checkout for WooCommerce , kliknij Zainstaluj teraz, a po zakończeniu procesu instalacji kliknij Aktywuj. Możesz też sprawdzić tę stronę i wybrać bezpłatną wersję lub jeden z planów premium.

2. Następnie przejdź do sekcji WooCommerce na pasku bocznym i kliknij opcję Bezpośrednia realizacja transakcji.

3. Przejdź do sekcji Produkty i włącz ostatnią opcję Dodaj domyślne atrybuty w zmiennych produktach . Pamiętaj o zapisaniu zmian.

Otóż ​​to! Utworzyłeś domyślne atrybuty produktu za pomocą Direct Checkout dla WooCommerce ! Teraz pierwszy atrybut każdego produktu zostanie wybrany domyślnie i zostanie zastosowany do wszystkich produktów zmiennych. Tak więc, jeśli chcesz zmienić atrybuty domyślne, musisz zmienić kolejność atrybutów i najpierw umieścić atrybut, który chcesz ustawić jako domyślny.

2) Ręcznie przez administratora WooCommerce

Możesz również ręcznie utworzyć domyślne atrybuty produktu za pomocą pulpitu nawigacyjnego WooCommerce. Ta metoda jest szybka i łatwa, ale może być czasochłonna, jeśli masz wiele produktów. W takim przypadku zalecamy skorzystanie z wtyczki Direct Checkout lub skryptu PHP opisanego w sekcji 3.

    1. Aby ręcznie ustawić domyślne atrybuty, najpierw w desce rozdzielczej WooCommerce przejdź do Produkty , a następnie kliknij swój zmienny produkt.
    2. Następnie wybierz Produkt zmienny z listy rozwijanej Dane produktu .
    3. Następnie w sekcji Odmiany musisz wybrać Domyślne wartości formularza . Są to atrybuty, które zostaną domyślnie wybrane dla tego produktu.

Otóż ​​to! Domyślne atrybuty produktu zostały utworzone ręcznie ! Teraz, gdy kupujący odwiedzi zmienną stronę produktu, pokaże wybrane domyślnie atrybuty, a przycisk Dodaj do koszyka zostanie włączony.

Domyślne atrybuty produktu WooCommerce - włączony przycisk Dodaj do koszyka
Kolor i rozmiar z wartościami domyślnymi, dzięki czemu przycisk Dodaj do koszyka jest włączony

Pamiętaj, że musisz ustawić domyślne atrybuty dla każdego produktu, który posiadasz. Dlatego jeśli masz wiele produktów, zalecamy skorzystanie z wtyczki Direct Checkout lub skryptu PHP, który opiszemy poniżej.

3) Twórz domyślne produkty programowo (PHP)

Jeśli nie chcesz instalować żadnej wtyczki na swojej stronie i masz pewne umiejętności kodowania, możesz utworzyć domyślne atrybuty produktu WooCommerce programowo z odrobiną PHP.

WSKAZÓWKA: Utwórz motyw potomny

Zanim zaczniesz, zalecamy utworzenie motywu podrzędnego . Jeśli go nie masz, po prostu zainstaluj dowolną wtyczkę lub zakoduj ją samodzielnie. Aby uzyskać więcej informacji na temat tworzenia motywu potomnego, zapoznaj się z naszym przewodnikiem krok po kroku. Jest to ważne, ponieważ jeśli zmienisz pliki motywu nadrzędnego, przy następnej aktualizacji motywu stracisz wszystkie dostosowania. Jeśli jednak zmodyfikujesz motyw podrzędny, Twoje zmiany nie zostaną zastąpione przez nową wersję motywu.

Teraz, po zainstalowaniu motywu potomnego, przejdźmy do niego.

Skrypt PHP

Aby programowo ustawić domyślną odmianę w WooCommerce, musisz zmodyfikować plik functions.php . Po prostu przejdź do wp-content/yourtheme/functions.php w motywie potomnym. Tutaj pokażemy Ci cały kod, a następnie wyjaśnimy jego główne części. Tak więc pełny skrypt PHP do programowego tworzenia domyślnych atrybutów produktu WooCommerce jest następujący:

 add_action('woocommerce_before_single_product_summary', 'quadlayers_product_default_attributes');
function quadlayers_product_default_attributes() {
      globalny produkt;
      if (!count($default_attributes = get_post_meta($product->get_id(), '_default_attributes'))) {
        $nowe_domyślne = tablica();
        $product_attributes = $product->get_attributes();
        if (count($product_attributes)) {
          foreach ($product_attributes as $key => $attributes) {
            $values ​​= explode(',', $product->get_attribute($key));
            if (isset($values[0]) && !isset($default_attributes[$key])) {
              $new_defaults[$klucz] = sanitize_key($wartości[0]);
            }
          }
          update_post_meta($product->get_id(), '_default_attributes', $new_defaults);
        }
      }
    }  

Teraz podzielmy to.

Hak

Używamy haczyka woocommerce_before_single_product_summary . Ten zaczep akcji zostanie uruchomiony przed załadowaniem strony, więc pozwala dodać trochę logiki, zanim użytkownik ją zobaczy.

 add_action('woocommerce_before_single_product_summary', 'quadlayers_update_product_default_attributes');

Sprawdź domyślne atrybuty

Następnie sprawdzamy, czy atrybuty meta_default_attributes istnieją, aby nie uruchamiać skryptu dwa razy.

 if (!count($default_attributes = get_post_meta($product->get_id(), '_default_attributes'))) {
      $nowe_domyślne = tablica();

Atrybuty

Następnie otrzymujemy całą gamę atrybutów

 $product_attributes = $product->get_attributes();
        if (count($product_attributes)) {

A potem iterujemy po tej tablicy atrybutów.

 foreach ($product_attributes as $key => $attributes) {
            $values ​​= explode(',', $product->get_attribute($key));

Otrzymujemy pierwszą wartość każdego atrybutu.

 if (isset($values[0]) && !isset($default_attributes[$key])) {

Jeśli atrybut nie ma wartości, skrypt doda pierwszą wartość z dostępnych opcji w $new_defaults.

 $new_defaults[$klucz] = sanitize_key($wartości[0]);
            }
          }

Następnie zapisuje $new_defaults w atrybutach meta_default_attributes. Zostanie to sprawdzone, aby nie uruchamiać skryptu dwa razy.

 update_post_meta($product->get_id(), '_default_attributes', $new_defaults);
        }
      }
    }  

Wniosek

Podsumowując, nieustawienie domyślnych atrybutów dla zmiennych produktów może wpłynąć na współczynniki konwersji i spowodować utratę wielu sprzedaży. Przycisk Dodaj do koszyka będzie wyświetlany jako wyłączony, więc użytkownicy mogą pomyśleć, że nie mogą kupować i odejść.

Dobrą wiadomością jest to, że dodanie domyślnych atrybutów jest łatwym zadaniem. Jeśli nie masz umiejętności kodowania, możesz skorzystać z funkcji Direct Checkout dla WooCommerce i kilkoma kliknięciami dodać domyślne atrybuty produktu. Dodatkowo, jeśli nie masz wielu produktów, możesz to zrobić ręcznie za pomocą pulpitu nawigacyjnego WooCommerce. Z drugiej strony, jeśli wolisz robić to programowo, możesz ustawić domyślne atrybuty przy odrobinie kodowania.

Jeśli chcesz uzyskać więcej informacji o tym, jak programowo ulepszyć swoją witrynę WooCommerce, możesz zapoznać się z naszymi przewodnikami na temat dodawania funkcji do koszyka i implementacji funkcji dodawania do koszyka AJAX w swojej witrynie.

Którą z tych metod zamierzasz użyć? Podziel się z nami swoimi przemyśleniami w sekcji komentarzy poniżej!