WooCommerce shortcodes – jak wyświetlać konkretne produkty?
WooCommerce to jedna z najpopularniejszych wtyczek e-commerce dla WordPressa. Umożliwia łatwe tworzenie sklepu internetowego, a dzięki tzw. shortcodes (krótkim kodom), możesz dynamicznie wyświetlać produkty w różnych miejscach swojej strony – np. na stronie głównej, w postach, czy w landing page’ach.
Shortcodes to specjalne skróty w nawiasach kwadratowych (np. [products]
), które wykonują konkretne akcje – np. wyświetlają listę produktów z danej kategorii.
Podstawowa składnia shortcode’ów WooCommerce
WooCommerce oferuje kilka podstawowych shortcode’ów, m.in.:
[products]
– wyświetla produkty[product_page id="123"]
– wyświetla konkretną stronę produktu[product_category]
– wyświetla produkty z danej kategorii
Najczęściej używany jest shortcode [products]
, który możemy konfigurować przy pomocy parametrów, takich jak:
Parametr | Opis |
ids | Lista ID produktów oddzielonych przecinkami |
category | Slug (nazwa uproszczona) kategorii produktów |
orderby | Kolejność: date , price , popularity , rating , itp. |
order | asc (rosnąco) lub desc (malejąco) |
limit | Liczba produktów do wyświetlenia |
columns | Liczba kolumn w siatce produktów |
tag | Slug tagu produktu |
attribute | Atrybut produktu (np. color ) |
terms | Wartości atrybutów (np. blue ) |
20 przykładowych shortcode’ów WooCommerce
Poniżej znajdziesz gotowe przykłady z wyjaśnieniem:
Wyświetl jeden konkretny produkt (ID = 123):
[products ids=”123″]
Wyświetl kilka konkretnych produktów (ID = 123, 456, 789):
[products ids=”123,456,789″]
Wyświetl produkty z kategorii „buty”:
[products category=”buty”]
Produkty z kategorii „buty” i limitem 4 sztuk:
[products category=”buty” limit=”4″]
Produkty z kategorii „akcesoria”, posortowane wg ceny rosnąco:
[products category=”akcesoria” orderby=”price” order=”asc”]
Produkty z tagiem „promocja”:
[products tag=”promocja”]
Produkty z atrybutem kolor=czarny
:
[products attribute=”kolor” terms=”czarny”]
Najnowsze produkty (limit 5):
[products orderby=”date” order=”desc” limit=”5″]
Najlepiej oceniane produkty:
[products orderby=”rating” limit=”5″]
Produkty posortowane wg popularności (sprzedaży):
[products orderby=”popularity” limit=”6″]
Produkty z kategorii „odziez” w 3 kolumnach:
[products category=”odziez” columns=”3″]
Produkty z dwóch kategorii jednocześnie: „buty” i „akcesoria”:
[products category=”buty,akcesoria”]
Wyświetl stronę konkretnego produktu (ID = 456):
[product_page id=”456″]
Produkty w promocji (na przecenie):
[sale_products limit=”8″]
Produkty polecane (oznaczone jako „featured”):
[featured_products limit=”6″]
Najnowsze produkty z kategorii „nowosci”:
[products category=”nowosci” orderby=”date” order=”desc” limit=”4″]
Produkty z konkretnego producenta (np. nike
– jako atrybut „marka”):
[products attribute=”marka” terms=”nike”]
Produkty nieposortowane z kategorii „gadżety”, limit 9:
[products category=”gadzety” limit=”9″ orderby=”none”]
Produkty z niestandardowym tagiem np. „eko”:
[products tag=”eko” limit=”4″]
Produkty tylko w magazynie (tylko dostępne):
[products limit=”8″ visibility=”visible”]
Podsumowanie
Shortcody WooCommerce możesz używać praktycznie wszędzie na swojej stronie WordPress, ale ich zastosowanie zależy od tego, jaki efekt chcesz osiągnąć. Oto pełne zestawienie miejsc, gdzie można (i warto) je stosować:
Strona główna (Home Page)
Zastosowanie: Wyświetlenie polecanych produktów, bestsellerów, nowości lub promocji.
Przykład: Na stronie głównej możesz np. dodać sekcję „Nowości” i użyć:
[products orderby=”date” order=”desc” limit=”4″]
Jeśli używasz edytora takiego jak Elementor lub Gutenberg, dodajesz blok „Shortcode” i wklejasz kod.
Podstrony (np. „Promocje”, „Nowości”, „Wyprzedaż”)
Zastosowanie: Tworzenie dynamicznych landing page’ów z konkretnymi produktami.
Przykład: Strona „Wyprzedaż” może zawierać:
[sale_products limit=”8″]
Wpisy na blogu
Zastosowanie: Promowanie konkretnych produktów w artykułach tematycznych.
Przykład: W artykule „5 rzeczy, które warto zabrać na wakacje”, możesz dodać:
[products ids=”123,456″]
To świetna metoda na łączenie content marketingu ze sprzedażą.
Strony statyczne (np. „O nas”, „Strona startowa dla kampanii reklamowej”)
Zastosowanie: Osadzenie np. rekomendowanych produktów, produktów marki, atrybutów.
Przykład: Na stronie kampanii „Zimowa Kolekcja”:
[products category=”zimowa-kolekcja”]
Strona koszyka lub checkout (Uwaga! z ograniczeniami)
Niektóre shortcode’y, np. [woocommerce_cart]
, [woocommerce_checkout]
są przeznaczone tylko dla tych stron. WooCommerce je automatycznie przypisuje podczas instalacji. Raczej nie używasz [products]
tutaj.
Widgety lub Sidebary (za pomocą widgetu „Shortcode”)
W kokpicie WordPress → Wygląd → Widgety → dodajesz widget „Shortcode” i tam możesz wkleić dowolny kod.
Strony budowane w Elementorze lub Gutenbergie
Tutaj możesz używać shortcode’ów w dedykowanych blokach/sekcjach, np. w Elementorze przez widget „Shortcode”, w Gutenbergu przez blok „Kod skrótu”.
Na co uważać?
- Nie każdy shortcode zadziała wszędzie – np.
[product_page]
działa dobrze tylko na stronach lub w blogu, nie zawsze w widgetach. - Shortcode’y zależą od slugów, ID produktów, atrybutów, które muszą być prawidłowe.
- Pamiętaj, żeby nie umieszczać zbyt wielu produktów na raz, bo strona może zwolnić.
Gdzie używać shortcode’ów WooCommerce?
Miejsce | Czy warto? | Uwagi |
Strona główna | ✅ Tak | Nowości, promocje |
Landing page / statyczne strony | ✅ Tak | Idealne do promocji kolekcji |
Blog / wpisy | ✅ Tak | Świetne do łączenia contentu i sprzedaży |
Koszyk / Checkout | ❌ Raczej nie | Tam są dedykowane shortcode’y |
Widgety / Sidebar | ✅ Tak | Polecane, bestsellery |
Elementor / Gutenberg | ✅ Super | Duża elastyczność |
Shortcode’y WooCommerce to potężne narzędzie do dostosowania wyglądu i funkcjonalności sklepu internetowego. Dzięki nim możesz łatwo kontrolować, które produkty są wyświetlane na stronie – czy to pojedyncze ID, konkretna kategoria, czy najnowsze nowości.
Pamiętaj, że niektóre motywy lub edytory mogą mieć własne bloki wizualne do shortcode’ów – np. w Elementorze lub Gutenbergu możesz dodać blok „Shortcode” i wkleić tam dowolny kod.