Moduł Skrócone atrybuty pokazuje na karcie produktu kilka najważniejszych cech w zwartej formie. Pod listą może wyświetlić odnośnik, który po kliknięciu płynnie przewija klienta do pełnej specyfikacji produktu.

1. Włącz Aktywuj moduł.
2. Ustaw, ile pierwszych atrybutów ma być widocznych, np. 2 lub 3.
3. W polu Treść przycisku wpisz tekst, np. Pełna specyfikacja.
4. Upewnij się, że produkt ma przypisane atrybuty w Shoperze.

Poniższy symulator odwzorowuje wszystkie trzy pola z konfiguracji modułu. Każde z nich jest LIVE, ponieważ zgodnie ze źródłem bezpośrednio zmienia renderowany wynik.

Moduł przechodzi przez grupy atrybutów produktu i pokazuje pierwsze pozycje aż do wartości ustawionej w polu Maksymalna ilość wyświetanych atrybutów. Limit dotyczy całej skróconej listy, a nie każdej grupy osobno.

W symulatorze użyto sześciu przykładowych cech, dzięki czemu możesz od razu sprawdzić wartości od 0 wzwyż.

Kliknięcie tekstu pod skróconymi atrybutami wyszukuje na stronie moduł z atrybutem data-module-name="product_attributes" i przewija do niego płynnie z przesunięciem około 150 px. W podglądzie po prawej możesz kliknąć przycisk i zobaczyć tę akcję na syntetycznej pełnej specyfikacji.

Moduł korzysta z natywnego makra Shopera product_attribute. Sam wygląd w źródle jest prosty: obramowanie górne i dolne, odstęp 20 px oraz atrybuty w jednym ciągu z dwukropkiem po nazwie cechy. JavaScript ponownie podpina obsługę przewijania po zdarzeniu PageManager.loaded.