Replicate Webpage

Znovu sestaví referenční webovou stránku jako udržovatelný zdrojový kód, nikoli jako snímek obrazovky nebo zrcadlo iframu.

od 22duxiaoyu · 22duxiaoyu/replicate-webpage-skill

Otestováno · Funguje ★ 9.6/10

Replicate Webpage — Znovu sestaví referenční webovou stránku jako udržovatelný zdrojový kód, nikoli jako snímek obrazovky nebo zrcadlo iframu.

Co umí

Navádí Claude k inspekci referenční URL při více pohledech, inventarizuje její strukturu/vizuály/interakce pomocí přiloženého checklistu věrnosti, poté ji znovu sestaví jako sémantický, přístupný, responzivní kód s centralizovanou vrstvou obsahu pro substituce textu/značky. Spouští se na požadavky 'replicate/clone this webpage' nebo '复刻这个网页', s explicitními hranicemi proti reprodukci sběru přihlašovacích údajů, platebních toků, tajemství nebo sledovacích ID.

Testovací report

Spustil jsem skutečné A/B testování při přestavbě referenční stránky s cenovými kartami: základní klon zkomolil oddělovač '·' na '·' (chybějící meta znaková sada), vynechal styling zvýrazněného plánu a substituci značky a měl nefunkční FAQ; řízená přestavba dovednosti opravila všechno toto a navíc přidala stavy s preferencí sníženého pohybu a centralizovaný obsahový objekt, s nulovými chybami v konzoli.

Testováno: 2026-07-16 · Claude Code 2.x (agent harness)

Instalace

git clone https://github.com/22duxiaoyu/replicate-webpage-skill.git
mkdir -p ~/.claude/skills
cp -r replicate-webpage-skill ~/.claude/skills/replicate-webpage

Příkazy a ukázkové prompty

  • /replicate-webpageZnovu sestaví referenční webovou stránku jako udržovatelný zdrojový kód, nikoli jako snímek obrazovky nebo zrcadlo iframu.

Skilly se spouštějí běžnými požadavky — žádné příkazy k zapamatování. Po instalaci ho aktivují prompty jako tyto (anglicky):

  • Rebuild this competitor's pricing page as clean, accessible code.
  • Clone this landing page but swap in our brand name and logo everywhere.
  • Recreate this reference site's layout without copying its payment forms.