Сделать верстку фигма

Potrzebne jest wdrożenie na stronach OpenCart (3 szt.) pełnoprawnego mechanizmu zarządzania zgodą na użycie plików cookie (Cookie Consent) oraz skonfigurowanie Google Consent Mode v2. Wymagane: zainstalowanie i skonfigurowanie CMP (Cookie Management Platform) lub innego rozwiązania do zarządzania zgodami użytkowników; wdrożenie pełnoprawnego banera Cookie Consent z możliwością akceptacji, odrzucenia oraz konfiguracji kategorii cookie; skonfigurowanie Google Consent Mode v2 za pośrednictwem Google Tag Manager; zapewnienie poprawnego przesyłania statusów zgody do Google Analytics 4, Google Ads, a także innych usług marketingowych; skonfigurowanie działania tagów analitycznych i reklamowych w taki sposób, aby uruchamiały się tylko zgodnie z uzyskanymi zgodami użytkownika. Obecnie baner cookie jest jedynie informacyjny i nie zarządza zgodami, a także nie przesyła ich statusu do usług Google. Potrzebne jest pełne skonfigurowanie zgodnie z aktualnymi wymaganiami GDPR oraz Google Consent Mode v2.

Konieczne jest dodanie 129 produktów. Jest plik z eksportem produktów, jednak standardowy import nie jest odpowiedni, ponieważ przed załadowaniem należy stworzyć strukturę katalogu: kategorie, działy i w razie potrzeby podkategorie. Następnie należy wykonać import produktów i sprawdzić, czy wszystkie karty zostały poprawnie przypisane do kategorii. Jeśli masz doświadczenie w realizacji podobnych zadań, prześlij przykłady prac, terminy realizacji i koszt.

CO TRZEBA ZROBIĆ Prace podzielone są na bloki, można zająć się wszystkim lub poszczególnymi blokami: Blok 1 — Optymalizacja prędkości (Mobile-First) Aktualna ocena mobilnej wersji PageSpeed — 51/100. Należy podnieść do 80+. Docelowe metryki: LCP < 2.5 s (obecnie 7.4 s), FCP < 1.8 s (obecnie 3.9 s), TBT < 200 ms. Prace: krytyczny CSS inline, opóźniony JS, WebP/AVIF, lazy load, audyt wtyczek. Blok 2 — GTM i analityka Usunąć hardcoded skrypty GA4/Google Ads z header.php. Zainstalować i skonfigurować wtyczkę GTM4WP. Wdrożyć Google Consent Mode v2 (skrypt lub cookie-banner). Blok 3 — Szablon karty produktu Jedyny Mobile-First szablon Single Product w Elementorze. Sticky przycisk „Kup” podczas przewijania na urządzeniach mobilnych. Cross-sell blok usług pod przyciskiem zakupu. Sprawdzenie automatycznego przesyłania zdarzeń view_item, add_to_cart przez GTM4WP. Blok 4 — Feed produktowy dla Google Merchant Center Zainstalować Product Feed Pro (AdTribes) lub CTX Feed. Skonfigurować XML-feed z poprawnym mapowaniem pól (id, title, gtin, brand, price, availability). Codzienne aktualizacje przez WP-Cron, automatyczne wykluczanie produktów „brak w magazynie”. Blok 5 — 6 stron docelowych (landingów) w Elementorze 3 strony e-commerce: katalog komponentów, gotowe rozwiązania UPS, zestawy SES. 3 strony lead generation: montaż UPS pod klucz, SES dla domu, rozwiązania dla biznesu. Istnieją szczegółowe prototypy ze strukturą i blokami każdej strony. Blok 6 — Formy i zdarzenia dataLayer 6 unikalnych zdarzeń dataLayer przy pomyślnym przesłaniu formularzy (CF7 i Elementor Pro Forms). Wymagania obowiązkowe dla wszystkich formularzy: maska wprowadzania telefonu, ochrona przed ponownym przesłaniem, reCAPTCHA v3 lub Honeypot. --- WYMAGANIA — Praktyczne doświadczenie z Elementor Pro (szablony Single Product, niestandardowe Page Templates) — Zrozumienie WooCommerce dataLayer i działania GTM4WP — Doświadczenie w optymalizacji prędkości WordPress (Critical CSS, WebP, WP Rocket lub analogiczne) — Doświadczenie w konfiguracji zdarzeń dataLayer dla CF7 lub Elementor Pro Forms — Portfolio lub przykłady podobnych prac — obowiązkowo Znajomość Google Consent Mode v2 będzie atutem. --- WARUNKI PRACY Strona na produkcyjnym hostingu — wszystkie zmiany tylko przez staging lub testowy duplikat. Jakakolwiek optymalizacja nie powinna naruszać inicjalizacji GTM i dynamicznego dataLayer. Szczegółowe wymagania zostaną przekazane po pierwszym kontakcie. Wynagrodzenie etapowe według bloków lub za cały projekt (dogadamy się) Napisz w odpowiedzi: 1. Twoje doświadczenie z podobnymi zadaniami (link lub krótki opis przypadku) 2. Czy jesteś gotów wykonać cały projekt czy poszczególne bloki 3. Orientacyjny koszt i terminy po zapoznaniu się z wymaganiami

Opis zamówienia: Poszukujemy doświadczonego frontend-dewelopera/specjalisty od OpenCart do optymalizacji szybkości ładowania strony (kategorie i karty produktów) zgodnie z wymaganiami Google Core Web Vitals. O projekcie: * CMS: OpenCart. * Specyfika: Strona działa w trybie katalogu (brak koszyka i składania zamówienia). * Zakres: 2900 pozycji. * Część serwerowa: Już zoptymalizowana (działa na OpenLiteSpeed). * Stos: Prace prowadzone są wyłącznie z kodem szablonu, modyfikatorami i frontendem. Bez pracy z bazą danych. Co należy zrobić (Zadanie techniczne): 1. Opóźnione ładowanie skryptów (Delay JS): * Problem: Zewnętrzne skrypty analityczne (GTM, Google Tag) blokują główny strumień na urządzeniach mobilnych przez około 4,3 sekundy. * Zadanie: Skonfigurować opóźnione uruchamianie tych skryptów. Skrypty powinny aktywować się ściśle po pierwszej akcji użytkownika (pierwsze przewinięcie, dotknięcie ekranu lub ruch myszą). * Ważne: Zbieranie statystyk, analityka i działanie reklamy muszą pozostać w pełnym zakresie. 2. Poprawa metryki CLS (Stabilność układu): * Problem: Strona "skacze" i przesuwa się podczas ładowania obrazków. * Zadanie: W plikach stylów lub szablonu motywu sztywno wpisać atrybuty HTML width i height dla wszystkich obrazów produktów w katalogu (listach) oraz kartach produktów. * Cel: Zarezerwować miejsce pod obrazki w drzewie DOM do ich faktycznego załadowania, aby uniemożliwić przesunięcie treści. Sprawdzić, aby responsywność (CSS) nie została uszkodzona. 3. Optymalizacja krytycznej ścieżki (LCP): * Zadanie: Wpisać dla głównego (najważniejszego) obrazu produktu na pierwszym ekranie tag fetchpriority="high". To da przeglądarce polecenie ładowania głównego zdjęcia produktu w priorytetowy sposób. Wymagania wobec wykonawcy i warunki przyjęcia: 1. Bez zbędnych modułów: Praca wykonywana jest czystym kodem/modyfikatorami, bez instalowania dodatkowych zewnętrznych lub płatnych wtyczek optymalizacyjnych. 2. Bezpieczeństwo i układ: Ponosisz pełną odpowiedzialność za układ. Po wprowadzeniu poprawek wizualne wyświetlanie strony na urządzeniach mobilnych i PC, a także funkcjonalność (filtry, przełączanie zdjęć w galerii, menu) muszą pozostać bez zmian. 3. Kryterium oddania pracy (DoD): Przedstawienie zrzutu ekranu oraz linku do żywego testu raportu Google PageSpeed Insights (dla wersji mobilnej). Wskaźnik wydajności nie może być niższy niż 75 punktów, a metryka CLS — nie więcej niż 0,1 (w zielonej strefie). Poprawki wprowadzać należy wyłącznie przez modyfikatory (OCMOD) lub kopię motywu, aby nie nadpisać aktualizacji jądra. W odpowiedzi proszę podać: 1. Czy miałeś doświadczenie w konfiguracji Delay JS właśnie dla GTM na OpenCart? 2. Termin realizacji zadania. 3. Koszt pracy.