Referenciák/Webshop

Lazacfehérje Áruház
Étrend-kiegészítő webáruház

A Lazacfehérje Áruház az Amata Power hidrolizált lazacfehérjéjét forgalmazza három ízben, néhány kiegészítő étrend-kiegészítővel együtt. A bolt korábban egy egyedi fejlesztésű webáruház-platformon futott. A projektben WooCommerce-re költöztettük, ugyanazon a domainen, a termék matt fekete tégelyére épülő új designnal.

Ügyfél
Lazacfehérje Áruház
Helyszín
Magyarország
Iparág
E-kereskedelem, Fitnesz
Munka
Design, Fejlesztés
Év
2026
Lazacfehérje Áruház weboldal

01. fejezetA kiindulás

A régi platform saját címstruktúrát használt, így minden indexelt kategória és oldal címe megváltozott volna. A katalógusnak és a keresőforgalomnak át kellett vészelnie a váltást, a vendégként történő vásárlás alapkövetelmény volt, és a boltnak szüksége volt a magyar jogi oldalakra is.

Lazacfehérje Áruház – képernyőkép 1

02. fejezetAmit csináltunk

A designt a csomagolásra építettük: sötét grafit szekciók, meleg krém megszakítások, egyetlen korall kiemelő és egyetlen betűtípus. A három íz saját színt kapott, ami az egész boltban navigációs jelként működik. A főoldalon a látogató ízek között vált, és a tégely, a leírás és az ár a helyén cserélődik.

A design görgetésre mozduló szövegekre, a termékfotók fölött lebegő címkékre és interaktív ízválasztóra épül, ezért egyedi fejlesztésű WordPress-témát készítettünk, saját sablonokkal a termék-, kategória-, kosár-, pénztár- és fiókoldalra. Az árak, a kiszerelések és az adagok a WooCommerce-ből jönnek, az ízekhez tartozó mezők ACF-mezők a terméken, így egy árváltozás az adminban egyszerre mindenhol megjelenik.

A termékoldalon a kiszerelés váltása frissíti az árat és az adagonkénti árat, a galéria telefonon lapozható. A céges vásárlók ellenőrzött adószám-mezőt kapnak a pénztárban, a jogi szövegeket az ügyfél meglévő jogidokumentum-szolgáltatásából ágyaztuk be. A kapcsolati űrlap Fluent Formsszal működik, így a mezőit és a leveleit az ügyfél maga is szerkesztheti.

A költöztetésnél 19 terméket vittünk át leírással és képekkel. A meglévő vásárlói fiókok a címükkel együtt jöttek át, jelszó nélkül, ezért a visszatérő vásárlók egy erre tervezett oldalon állítanak be újat. A 19 indexelt termékcímből 18 megtartotta a korábbi slugját, a kategóriákra, a statikus oldalakra és a fiókcímekre 14 átirányítást írtunk Rank Mathben, és hét mintaesetet valódi böngészőben teszteltünk. Minden termék saját meta leírást, minden kép a tartalmát leíró alt szöveget kapott.

Lazacfehérje Áruház – képernyőkép 2

03. fejezetAz eredmény

A bolt 2026. szeptember 21-én indult el az ügyfél saját tárhelyén, a megszokott domainen. Élesítéskor a PageSpeed Insights mobilon 93, asztali nézetben 99 pontot adott a főoldalra, oldalépítő nélkül, egyedi fejlesztésű témával.

Az élesítés napján a régi bolt még elérhető volt, így mindkét főoldalt ugyanazzal a Lighthouse-beállítással mértük. Az új 2154 kB helyett 898 kB-ot tölt be, 86 helyett 38 kérést küld, és betöltés közben nem ugrál: a régi oldal mobilon 0,43-as elrendezés-elcsúszást mutatott, az új 0-t. Minden egyedi kód a témában él, a termékadatok, az árak és az űrlapbeállítások a WordPress adminban szerkeszthetők maradnak.

93
PageSpeed Insights mobilon, élesítéskor mérve
99
PageSpeed Insights asztali nézetben, élesítéskor mérve
−58%
Könnyebb főoldal, mint a régi boltnál (2154 kB → 898 kB)
−56%
Kevesebb kérés a főoldalon (86 → 38)
0,43 → 0
Elrendezés-elcsúszás mobilon, régi bolt → új
0,79 → 0
Elrendezés-elcsúszás asztali nézetben, régi bolt → új

Előtte
és utána

Húzd el a csúszkát: balra a régi weboldal, jobbra az új.

Lazacfehérje Áruház – az új weboldal
Lazacfehérje Áruház – a régi weboldal
A régi, egyedi platformon futó webáruház és az új WooCommerce-bolt nyitóoldala, az élesítés napján rögzítve.

A megjelenés,
színek és betűk

A matt fekete tégely adja a palettát: grafit és közel fekete, egyetlen korall kiemelő meleg krém alapon, végig egy lekerekített geometrikus groteszk betű, és minden íz saját színe, ami navigációs jelként is működik.

  • Korall#FF6C44
  • Grafit#1F1F23
  • Matt fekete#0E0E10
  • Meleg krém#FAF5F3
  • Citrus#F5A623
Címsorok és szövegtörzs
Chillax
Lazacfehérje Áruház – képernyőkép 1

Amit
átadtunk

Webáruház-design és egyedi fejlesztésű WordPress-téma WooCommerce-hez, saját sablonokkal a főoldalra, a termék-, kategória-, kosár-, pénztár-, fiók- és kapcsolatoldalra. A 19 termékes katalógust és a vásárlói fiókokat átköltöztettük a régi platformról, beállítottuk a régi címek átirányítását, és a boltot ugyanazon a domainen, az ügyfél saját tárhelyén élesítettük.

  • 01

    Feladat

    Webáruház-design, egyedi WooCommerce-téma, platformváltás

  • 02

    Platform

    WordPress és WooCommerce, egyedi fejlesztésű témával

  • 03

    Katalógus

    19 termék, négy lazacfehérje és 15 kiegészítő

  • 04

    Átirányítások

    14 szabály a régi platform címeiről, böngészőben tesztelve

  • 05

    Élesítés

    2026. szeptember 21.

WordPressWooCommerceACFPHP 8