Long story short: Migrace webu mezi dvěma page buildery není otázka jednoho importu ani cesty “AI to udělá sama”. Ani za podmínek, že je web lokální (a tedy AI plně přístupný).
- Začnete tím, že u čtyřjazyčného webu soukromé kliniky nejdřív zmapujete obsah, pluginy, sitemapy a jazykové vazby, abyste věděli, s čím máte tu čest.
- Připravíte si obnovitelné zálohy a nový design systém a teprve potom můžete začínat převádět stránky.
- Samotným přesunem práce zdaleka nekončí – je potřeba opravit nedostatky, provést automatické kontroly, porovnávat nový web obsahově se starým, provést vizuální testy, opravy médií a skutečné odesílání všech jazykových formulářů, cookie lišty, napojení 3. stran (GTM a podobně).
0) Starý web a jeho stav
Migrace z Elementoru do Bricks Builderu rozhodně není jen “výměna” jednoho builderu za druhý. Ve skutečnosti měníte úplně všechno, mimo textů a obrázků (a ty někdy také). Potřebujete zaručit, že výsledek bude i vývojářsky čistý (CSS třídy na správných místech, správnou HTML sémantiku, udržovatelný kód, atd…). Řešíte najednou obsahový audit, novou architekturu, převod dat, udržení a vylepšení technického SEO, práce s překlady a důkladné testování v několika vlnách.
Soukromá klinika (dále jen SouK), jejíž transformaci jsem dělala, funguje ve 4 jazycích. Jednotlivé jazykové mutace navíc nevznikaly vždy stejným způsobem, takže se v průběhu let místy rozešly jejich struktury, počty bloků i způsob uložení obsahu.
Cílem web přenést do Bricks builderu a pročistit vše, co bylo možné:
- zachovat stávající URL, WordPress ID a SEO metadata,
- udržet jazykové vazby v Polylangu,
- zůstat vizuálně co nejblíž původnímu návrhu,
- opravit problémy s responzivitou, typografii a strukturu nadpisů,
- používat čisté a opakovatelné Bricks komponenty, které zjednoduší správu později,
- a nebude dál závislý na řetězci Elementor addonů.
1) Nejdřív audit, potom změny
Web jsem původně zdědila jako správce. Navenek sice fungoval, ale uvnitř to byl slepenec 36 pluginů, které jsem nakonec redukovala na pouhých 10. Klasická šablonovitá práce, navíc na slabém hostingu. Dělat tam jakékoli změny byla zkouška trpělivosti, která stála pokaždé hromadu času.
Takže bylo potřeba zjistit, s čím mám tu čest:
- 53 (unikátních) publikovaných stránek,
- 4 jazyky,
- 6 368 Elementor uzlů,
- 75 položek v Elementor Library,
- 8 globálních ElementsKit šablon,
- 4 různé MetForm formuláře.
Součástí auditu nebyly jen stránky. Kontrolovala se také aktivní pluginy, globální hlavičky a patičky, formuláře, jazykové vztahy, Yoast metadata, cookie management, e-mailové nastavení a historická data.
Zvláštní poznámku si zaslouží uložené MetForm záznamy. Starý web jich obsahoval desítky a mohly mezi nimi být osobní nebo zdravotně citlivé údaje. Migrační nástroje proto tyto záznamy nečetly, neupravovaly ani nepřesouvaly.
2) Záloha na 1. místě
Převod jsem dělala lokálně v počítači, proto jsem si stáhla zálohy pomocí Updraft a rozběhala ji online.
3) Zdravý rozum na 2. místě
Na převod webů Elementor->Bricks existují nějaké nástroje. Ale převést Elementor data 1:1 do Bricks je technologická sebevražda do budoucna. Takový postup by přenesl i tisíce historických wrapperů, lokálních stylů a závislostí na widgetech z několika addon balíků… samá sprostá slova, která na novém webu vidět nechcete.
Proto jsem zvolila postup oklikou:
- programově zanalyzovat a vytěžit původní Elementor data,
- připravit čistý Bricks design systém a opakovatelné komponenty,
- postavit správně celou českou variantu,
- podle ní pak naplnit obsahy ostatních jazyků,
- a automatizovat vše, co je možné bezpečně automatizovat: plnění obsahu do připravených stránek, programování Bricks modulů, příprava formulářů a testování formulářů, validace dat, že žádná nechybí, atd…
4) Design systém jak základ celého webu
Ještě před sériovým převodem vznikl základní Bricks design systém:
- globální barvy,
- typografie,
- šířky kontejnerů,
- responzivní breakpointy,
- mezery a layoutové třídy,
- tlačítka,
- karty služeb a lékařů,
- ceníkové řádky,
- reference,
- hlavičky a patičky,
- a centrálně spravované formulářové šablony,
- celé sekce typizované pro kusy stránek,
- a mnoho dalšího…
Díky této přípravě pak bylo plnění obsahu mnohem jednodušší a hlavně byl postavený základ webu bez technologických dluhů.
5) Návrh architektury
Vlastní Bricks moduly pro jednodušší správu
Vedle globálních tříd vznikly v child theme také tři vlastní Bricks moduly: pro ceníky, tlačítka a kartu lékaře. V editoru se chovají jako běžné Bricks elementy, včetně stylování. A upravy jsou mnohem jednodušší – např. karta lékaře je jeden blok, nikoli 5 elementů v sobě.
Fonty bez externího načítání
Původní Elementor web načítal písma Archivo a Poppins z Google Fonts. V nové implementaci jsou všechny fonty uložené lokálně na webu.
Česká verze jako kanonický základ
Převod začal českou verzí, jednou vybranou (dostatečně složitou) stránkou. Na pilotu se ověřilo, jak má vypadat nová struktura, že fungují globální třídy a navržené sekce, že funguje responzivita, atd. Díky tomu se vyčistily různé neduhy jako pevné dané šířky/výšky z předchozího layoutu, kilometrové CSS kvůli stylům na každém elementu zvlášť.
Následně se udělaly i ostatní stránky a poté i další jazyky. Ne všechny jazykové verze měly stejný obsah, s čímž bylo potřeba se vypořádat a držet se obsahu původního webu.
6) Stránky a všechno ostatní
Takto se postupně převedl obsah celého webu, nejen stránky, ale i všechny šablony (hlavička, patička, formuláře, reference a další).
Díky postupu stránku po stránce bylo možné opravit historické neduhy a dluhy. Největší problém byl v responzivitě hlavně kvůli překladům (a tedy delším textům) – o tom více tady.
V rámci responzivních oprav se řešilo například:
- responzivita,
- dlouhé jazykové varianty tlačítek a popisků,
- pevné výšky a šířky karet,
- přizpůsobení obrázků jejich prostoru,
- odstranění vodorovného přetékání,
- přirozená výška formulářových polí,
- relativně také i oprava přístupnosti,
- chybějící nadpisy (např. nad ceníky a podobně) a oprava jejich hierarchie,
- typografie a řádkování,
- a mnoho dalšího.
7) Spousta automatických testů
Vizuální kontrola
Po automatické validaci následoval ruční průchod stránek. Ten zachytil problémy, které se v samotných datech hledají obtížně (různé přetékání v responzivitě, špatně pozicované obrázky, atd…).
Porovnání obsahu původního a nového webu
Porovnání textů vůči originálu dostal na starosti Claude jako úplně jiný model a tedy nezávislá kontrola. Díky tomu jsem našla, že se při prvním plnění chyběly některé drobnosti v textech, některé byly drobně přeformulované a podobně. Což při takové migraci není přípustné a bylo to opraveno.
Formuláře a odesílání
Původní web používal MetForm. Ten je přímo závislý na Elementoru, takže po jeho odstranění by stejně nefungovalo a nepřipadalo v úvahu, že by na webu zůstal. Místo toho jsem použila klasické Bricks formuláře a nově napojila jejich události do GTM, což původně nebylo. Samozřejmě má každý svoje překlady a otestovalo se i jejich odesílání.
8) Z 36 pluginů na 10
Menší počet pluginů znamená přehlednější administraci, méně samostatných aktualizací a menší prostor pro konflikty mezi pluginy. A hlavně to razantně zrychlilo celý web, i na slabém hostingu. Z desítek vteřin čekání na načtení stránky (kdy se často Elementor builder ani nenačetl a musela jsem do safe modu), se stalo pár vteřin.
9) Časová dotace
Asi vás zajímá, kolik tohle celé zabralo času. Zklamu vás, 10 minut to rozhodně nebylo.
Když to sečtu na můj a “AI” čas, tak to vyjde nějak takto:
- Můj čas u klávesnice: 7 hodin (hlavně zadání, oprava design systému, kontroly a vizuální testování). Možná to vypadá hodně, ale jen ten design system připravit opravdu kvalitně nebyla sranda na 5 minut.
- Čas AI: cca 9 hodin – migrace, testování a všechno okolo.
Závěr
Převod SouK z Elementoru do Bricks ukázal, že kvalitní migrace je především člověm řízený proces. Největší část práce často není samotné vytvoření nových elementů, ale příprava bezpečného prostředí, rozumná rozhodnutí o cílové architektuře a ověření všech návazností.
Díky komponentovému přístupu vznikl jednotný základ pro čtyři jazyky, přičemž zůstaly zachované původní URL, jazykové skupiny a SEO metadata. Automatizace urychlila opakovanou práci a lidská kontrola zachytila problémy, které se v datech neprojeví.
Právě kombinace auditu, opakovatelných komponent, bezpečných snapshotů, automatických testů a ručního vizuálního průchodu rozhoduje o tom, zda je migrace pouze technicky dokončená, nebo skutečně připravená k nasazení.
Hlavní poučení je, že AI není všespásná. I když měla jasné pokyny, tak není možné vypsat všechny výjimky, které při migraci nastaly, protože by vydaly na celou knihu. A to by bylo pouze pro jediný web.