Webkomponent <mmz-products>
Główną opcją umieszczania Boxów produktowych jest użycie tzw. webkomponentu, czyli kodu html z odpowiednimi parametrami, np. <mmz-products product-ids="55, 58">...</mmz-products>. Webkomponent działa w obrębie całego sklepu.
Jak wstawić webkomponent?
Dział zatytułowany „Jak wstawić webkomponent?”- Wygeneruj webkomponent w aplikacji w zakładce Generuj boxy produktowe - wypełnij wszystkie pola według swoich preferencji
- Skopiuj kod webkomponentu, który znajduje się po prawej stronie formularza
- Przejdź do miejsca w sklepie, w którym chcesz wstawić webkomponent, jeśli posiada ono edytor wysiwyg koniecznie wyłącz go przed wklejeniem kodu webkomponentu
- Wklej skopiowany kod webkomponentu w odpowiednie miejsce
- Zapisz i sprawdź działanie webkomponentu na sklepie
Tworzenie webkomponentu z listy produktów
Dział zatytułowany „Tworzenie webkomponentu z listy produktów”[TODO - screeny]
Możesz szybko stworzyć kod webkomponentu dla wybranych produktów z listy produktów w sklepie, w tym celu:
- Przejdź na listę produktów:
Produkty -> Wszystkie - Wyfiltruj produkty na których Ci zależy i zaznacz checkboxem te które chcesz wybrać do boxa produktowego
- Z menu
Aplikacjew prawym górnym rogu wybierz opcję Wygeneruj boxy produktowe (Storefront) TODO SCREEN - Sprawdź ustawienia i skopiuj kod webkomponentu a następnie wstaw go w pożądane miejsce
Różnice do tzw. shortcode’ów z aplikacji RWD
Dział zatytułowany „Różnice do tzw. shortcode’ów z aplikacji RWD”Jeśli posiadałeś wersję aplikacji na szablony RWD (Boxy produktowe lub Boxy produktowe Pro) to przed przejściem na szablon Storefront wymagana jest aktualizacja używanych kodów, zamiast tzw. shortecodów w nawiasach kwadratowych [mmz-product] należy używać kodu webkomponentów <mmz-products> - wymaga to zaktualizowania kodu we wszystkich miejscach na nowe.
- Kod nowego webkomponentu (Storefront):
<mmz-products product-ids="3722">...</mmz-products> - Stary shortcode (RWD):
[mmz-product id="3722"]
Zobacz szczegółowe porównanie różnic pomiędzy kodami
| Parametr (Storefront) | Wartość (Storefront) | Różnice względem starego shortcode’a (RWD) |
|---|---|---|
disable-lazy | brak wartości — parametr jest dodany lub nie | nowy — wcześniej nie istniał |
product-ids | id produktów po przecinku | wcześniej id (konflikt z natywnym atrybutem HTML) |
limit | maksymalna ilość wyświetlanych produktów | bez zmian |
slider | true / false | wartość false zastąpiła osobny parametr autoScrolling (usunięty) |
only-available | true | wcześniej onlyAvailable (bez wielkich liter) |
order | random / A-Z / Z-A / priceDescending / priceAscending | bez zmian |
show | promotion / new / potd / main / bestsellers | wartość bestsellers jako nowa |
search | wyszukiwana fraza | bez zmian |
category-id | id kategorii | wcześniej category_id |
collection-id | id kolekcji | wcześniej collection_id |