# How to Fine-Tune the AI for Specific Cloning Scenarios in the AI Website Cloner Template

> Learn how to fine-tune the AI for specific cloning scenarios in the AI Website Cloner Template by editing AGENTS.md and running sync scripts.

- Repository: [JCodesMore/ai-website-cloner-template](https://github.com/JCodesMore/ai-website-cloner-template)
- Tags: how-to-guide
- Published: 2026-06-27

---

**Fine-tune the AI by editing the [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md) file and running the sync scripts to propagate custom instructions across all supported coding agents.**

The JCodesMore/ai-website-cloner-template repository provides a framework for cloning websites using AI agents. To fine-tune the AI for specific cloning scenarios, you customize the centralized instructions in [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md) and synchronize them across the pipeline. This approach ensures that every agent—from Claude to GitHub Copilot—follows the same behavioral rules when reconstructing target sites as Next.js 16 applications.

## Understanding the Cloning Pipeline Architecture

The template operates through a six-stage pipeline where each stage has specific entry points for customization.

**Prompt Definition** happens in [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md), which contains human-readable directives that shape the AI's output, including component spec formats and naming conventions.

**Skill Generation** materializes the `/clone-website` command for each AI platform from the canonical skill file at [`.claude/skills/clone-website/SKILL.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/.claude/skills/clone-website/SKILL.md), propagated via `scripts/sync-skills.mjs`.

**Agent-Specific Configs** are generated by [`scripts/sync-agent-rules.sh`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/scripts/sync-agent-rules.sh), which creates plain-text rule files (like [`.github/copilot-instructions.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/.github/copilot-instructions.md) and `.clinerules`) for agents that cannot read [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md) directly.

**Inspection and Spec Creation** follows the checklist in [`docs/research/INSPECTION_GUIDE.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/docs/research/INSPECTION_GUIDE.md), where the AI runs Chrome DevTools to extract design tokens and screenshots, writing detailed component specs under `docs/research/`.

**Parallel Builders** execute in separate git worktrees, with each component receiving its spec and emitting React/TSX code based on the instructions provided.

**Assembly and QA** merges worktrees, wires pages together, and performs visual diffs against the original site.

## Where to Inject Custom Behavior

You can intervene at specific files to alter the AI's behavior for your scenario.

**Alter the overall tone or scope** by editing [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md) to add bullet points under *Design Principles* or create a new **Scenario** section. After editing, run `bash scripts/sync-agent-rules.sh` and `node scripts/sync-skills.mjs` to push the new wording to every agent.

**Change the component-spec format** by modifying the *Component Specs* description in [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md)'s **How It Works** section. The AI will include the new field when writing spec files, and builders automatically parse the updated markdown.

**Introduce custom assets handling** by extending [`scripts/sync-agent-rules.sh`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/scripts/sync-agent-rules.sh) or creating a custom helper script that filters the asset list before the AI downloads files. Because the pipeline reads from `public/` after download, any filtering is reflected downstream.

**Add platform-specific flags** by extending [`.claude/skills/clone-website/SKILL.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/.claude/skills/clone-website/SKILL.md) with optional arguments, then re-running `node scripts/sync-skills.mjs`. This allows invocation like `/clone-website --no-images <url>` if you implement the handling logic in the agent's prompt.

**Enforce a particular UI library** by replacing the *UI* bullet in the *Tech Stack* section of [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md). The AI will generate components using the specified library, though you may need to adjust the starter `src/` folder to include new dependencies.

## Practical Implementation Steps

### Add a Custom Scenario to AGENTS.md

Create a new scenario section in [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md) to handle specific requirements like accessibility-first cloning:

```markdown

## Scenario: Accessibility-First Clone

- Prioritize WCAG 2.1 AA compliance.
- Generate ARIA attributes for all interactive elements.
- Add `skip-nav` links and visible focus outlines.
- Export a `design-tokens-a11y.md` file that includes contrast-checked color values.

```

After saving, propagate the changes:

```bash
bash scripts/sync-agent-rules.sh
node scripts/sync-skills.mjs

```

### Expose a New Flag in the Skill File

Edit [`.claude/skills/clone-website/SKILL.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/.claude/skills/clone-website/SKILL.md) to add command-line options:

```markdown
name: clone-website
description: Clone a website with optional flags.
arguments:
  - name: no-images
    type: boolean
    description: Skip downloading images for a faster preview.

```

Regenerate the platform copies:

```bash
node scripts/sync-skills.mjs

```

### Filter Assets in the Sync Script

Modify [`scripts/sync-agent-rules.sh`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/scripts/sync-agent-rules.sh) to restrict downloads to specific formats:

```bash

# After the RESOLVED_CONTENT variable is built

FILTERED_ASSETS=$(echo "$RESOLVED_CONTENT" | grep -E "\.svg$" || true)
write_file "$REPO_ROOT/public/asset-list.txt" "$FILTERED_ASSETS"

```

Point the AI's asset-download step at [`public/asset-list.txt`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/public/asset-list.txt) by adding a new instruction to [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md).

## Key Source Files for Customization

Understanding these files helps you fine-tune the AI for specific cloning scenarios effectively:

- **[`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md)** — The single source of truth containing tech stack definitions, design principles, and the core cloning prompt.
- **[`scripts/sync-agent-rules.sh`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/scripts/sync-agent-rules.sh)** — Generates plain-text rule files for agents that cannot read [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md) directly.
- **`scripts/sync-skills.mjs`** — Propagates the canonical skill file to every supported platform.
- **[`docs/research/INSPECTION_GUIDE.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/docs/research/INSPECTION_GUIDE.md)** — The checklist the AI follows when inspecting target sites for design tokens and assets.
- **[`src/app/page.tsx`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/src/app/page.tsx)** — The default landing page displaying the "Clone target not yet built" placeholder, useful for testing the end-to-end flow.

## Summary

Fine-tuning the AI for specific cloning scenarios requires modifying the central configuration and synchronizing changes across the agent ecosystem:

- **Edit [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md)** to shape the AI's overall behavior, design principles, and component specifications.
- **Run sync scripts** (`bash scripts/sync-agent-rules.sh` and `node scripts/sync-skills.mjs`) to push changes to every supported agent.
- **Adjust the skill file** at [`.claude/skills/clone-website/SKILL.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/.claude/skills/clone-website/SKILL.md) for new command-line flags or scenario-specific arguments.
- **Leverage the inspection guide** to ensure the AI harvests the correct design tokens and interaction data.
- **Test modifications** by invoking `/clone-website <url>` with any custom flags you added.

## Frequently Asked Questions

### What is the single source of truth for AI behavior in this template?

The [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md) file serves as the single source of truth for all AI agents in the repository. It defines the behavior of every supported coding agent, including component specifications, naming conventions, and design principles. When you fine-tune the AI for specific cloning scenarios, you start by modifying this file.

### How do I add a custom command-line flag to the clone-website skill?

Define the new flag in [`.claude/skills/clone-website/SKILL.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/.claude/skills/clone-website/SKILL.md) by adding an entry to the arguments section with a name, type, and description. After saving, run `node scripts/sync-skills.mjs` to propagate the flag to all platform-specific skill files. You must also implement the handling logic in your agent's prompt or scripts to respect the flag during execution.

### Can I restrict asset downloads to specific file types like SVGs only?

Yes, you can filter assets by modifying [`scripts/sync-agent-rules.sh`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/scripts/sync-agent-rules.sh) to process the `RESOLVED_CONTENT` variable and output only matching patterns to [`public/asset-list.txt`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/public/asset-list.txt). For example, pipe the content through `grep -E "\.svg$"` to create a manifest containing only SVG files. Then update [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md) to instruct the AI to read from this filtered manifest during the asset-download step.

### How do I ensure all AI agents receive my custom instructions?

After editing [`AGENTS.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main/AGENTS.md), you must run both synchronization commands: `bash scripts/sync-agent-rules.sh` generates plain-text rule files for agents like GitHub Copilot and Cline, while `node scripts/sync-skills.mjs` updates the platform-specific skill definitions. Running both ensures consistent behavior across Claude, Copilot, Cline, and other supported agents.