Shopify · Moda

Love and Hate

Sklep na nowym motywie, przebudowane karty produktu, szybszy na telefonach

Love and Hate sprzedaje bieliznę szytą w Polsce. Przeniosłem sklep ze starego motywu Prestige 4 na Prestige 11 w Online Store 2.0, przebudowałem karty produktu, dodałem to, czego wymagają unijne przepisy o odstąpieniu od umowy, a potem zmierzyłem i usunąłem to, co spowalniało telefony.

Rola: Główny programista: 38 z 39 zmergowanych pull requestów
Okres: kwiecień - wrzesień 2026
Technologie: Shopify
Liquid
Prestige 11 (OS 2.0)
Metaobjects
Customer Privacy API
Judge.me
Python
Strona: loveandhate.pl(otwiera się w nowej karcie)

Love and Hate: strona główna na ekranie komputera

PageSpeed mobile, średnio: 57 → 71
czasu przeliczania stylów: −85%
waga strony kolekcji: 700 → 502 KB
tekstów w pamięci tłumaczeń EN: 3800+

Kontekst

Sklep działał na Prestige 4.14, starszym motywie bez bloków aplikacji. Redesign na nowej wersji stał od czerwca, a sklep nie miał niczego, czego wymaga unijna dyrektywa o odstąpieniu od umowy online: zwroty szły przez PDF do wydruku i maila.

Nowa wersja ruszyła 25 września 2026, po polsku i angielsku.

Co zrobiłem

Migracja na Prestige 11.1 w Online Store 2.0 i dokończenie redesignu na nowej wersji
Warianty kolorów jako osobne produkty grupowane przez metaobiekt, z licznikiem +N na kartach produktów
Przyklejony pasek dodawania do koszyka na telefonach, z wyborem rozmiaru w pasku
Biustonosze z obwodem i miseczką jako dwa pola obok siebie zamiast jednej długiej listy
Odstąpienie od umowy online według dyrektywy UE 2023/2673: link w stopce i przycisk na osobnej stronie otwierają formularz
Jeden przełącznik regionu, który ustawia kraj, walutę i język naraz
Wersja angielska przez proces CSV ze skryptami w Pythonie i pamięcią tłumaczeń ponad 3800 tekstów
Własny baner cookies na Customer Privacy API Shopify; Yandex i Clarity ładują się dopiero po zgodzie
Znalazłem przyczynę awarii integracji Baselinker-Fakturownia, która blokowała zamknięcie miesiąca (wygasły token), i uzupełniłem brakujące faktury

Trudne momenty i jak je rozwiązałem

Problem
Judge.me trzyma liczbę opinii w polach Shopify, ale nie ich treść, więc karty produktów pokazywały gwiazdki bez opinii.
Rozwiązanie
Liczby renderują się po stronie serwera z pól Shopify, a treści ładują się leniwie z endpointu widżetu Judge.me, gdy sekcja pojawia się na ekranie.
Problem
Trzy reguły :has() w motywie sprawiały, że przeglądarka przeliczała style ponad sekundę na stronach kolekcji i produktów.
Rozwiązanie
Zawęziłem selektory do body:has(...). Przeliczanie stylów spadło z 1369 do 205 ms na kolekcjach i z 1238 do 177 ms na kartach produktów.
Problem
Stary motyw nie miał bloków aplikacji, a natywne zwroty Shopify wymagają konta klienta, więc żadne z nich nie załatwiało odstąpienia online.
Rozwiązanie
Aplikacja do odstąpień wpięta w motyw: link w stopce i przycisk na stronie odstąpienia, bez zakładania konta.

Wyniki

PageSpeed mobile, średnia kluczowych stron: 57,0 → 71,2
Waga strony przed kompresją: kolekcja 700 → 502 KB, wyszukiwarka 1287 → 490 KB
Karty produktów na telefonach, dane z Shopify od prawdziwych użytkowników (75. percentyl, pierwszy dzień po wdrożeniu): 1,83 s → 1,14 s
Odstąpienie od umowy online zgodnie z dyrektywą UE 2023/2673