home / skills / sickn33 / antigravity-awesome-skills / obsidian-clipper-template-creator

obsidian-clipper-template-creator skill

/skills/obsidian-clipper-template-creator

This skill helps you generate Obsidian Web Clipper JSON templates by analyzing pages, applying bases, and validating selectors for accurate clipping.

This is most likely a fork of the obsidian-clipper-template-creator skill from xfstudio
npx playbooks add skill sickn33/antigravity-awesome-skills --skill obsidian-clipper-template-creator

Review the files below or copy the command above to add this skill to your agents.

Files (8)
SKILL.md
3.2 KB
---
name: obsidian-clipper-template-creator
description: Guide for creating templates for the Obsidian Web Clipper. Use when you want to create a new clipping template, understand available variables, or format clipped content.
---

# Obsidian Web Clipper Template Creator

This skill helps you create importable JSON templates for the Obsidian Web Clipper.

## Workflow

1. **Identify User Intent:** specific site (YouTube), specific type (Recipe), or general clipping?
2. **Check Existing Bases:** The user likely has a "Base" schema defined in `Templates/Bases/`.
    - **Action:** Read `Templates/Bases/*.base` to find a matching category (e.g., `Recipes.base`).
    - **Action:** Use the properties defined in the Base to structure the Clipper template properties.
    - See [references/bases-workflow.md](references/bases-workflow.md) for details.
3. **Fetch & Analyze Reference URL:** Validate variables against a real page.
    - **Action:** Ask the user for a sample URL of the content they want to clip (if not provided).
    - **Action (REQUIRED):** Use `WebFetch` or a browser DOM snapshot to retrieve page content before choosing any selector.
    - **Action:** Analyze the HTML for Schema.org JSON, Meta tags, and CSS selectors.
    - **Action (REQUIRED):** Verify each selector against the fetched content. Do not guess selectors.
    - See [references/analysis-workflow.md](references/analysis-workflow.md) for analysis techniques.
4. **Draft the JSON:** Create a valid JSON object following the schema.
    - See [references/json-schema.md](references/json-schema.md).
5. **Verify Variables:** Ensure the chosen variables (Preset, Schema, Selector) exist in your analysis.
    - **Action (REQUIRED):** If a selector cannot be verified from the fetched content, state that explicitly and ask for another URL.
    - See [references/variables.md](references/variables.md).

## Selector Verification Rules

- **Always verify selectors** against live page content before responding.
- **Never guess selectors.** If the DOM cannot be accessed or the element is missing, ask for another URL or a screenshot.
- **Prefer stable selectors** (data attributes, semantic roles, unique IDs) over fragile class chains.
- **Document the target element** in your reasoning (e.g., "About sidebar paragraph") to reduce mismatch.

## Output Format

**ALWAYS** output the final result as a JSON code block that the user can copy and import.

```json
{
  "schemaVersion": "0.1.0",
  "name": "My Template",
  ...
}
```

## Resources

- [references/variables.md](references/variables.md) - Available data variables.
- [references/filters.md](references/filters.md) - Formatting filters.
- [references/json-schema.md](references/json-schema.md) - JSON structure documentation.
- [references/bases-workflow.md](references/bases-workflow.md) - How to map Bases to Templates.
- [references/analysis-workflow.md](references/analysis-workflow.md) - How to validate page data.

### Official Documentation

- [Variables](https://help.obsidian.md/web-clipper/variables)
- [Filters](https://help.obsidian.md/web-clipper/filters)
- [Templates](https://help.obsidian.md/web-clipper/templates)

## Examples

See [assets/](assets/) for JSON examples.

Overview

This skill guides you through creating importable JSON templates for the Obsidian Web Clipper. It helps map existing Base schemas, inspect live pages for reliable selectors and variables, and produce a validated template ready for import. The focus is on reproducible, verifiable templates that work across similar pages.

How this skill works

I first clarify your clipping intent (site, content type, or general pattern). I inspect your Bases directory to reuse schema properties and then fetch a sample URL or DOM snapshot to detect Schema.org JSON, meta tags, and candidate CSS selectors. I verify each selector against the fetched content, prefer stable attributes, and assemble a valid JSON template following the Web Clipper schema. If any selector cannot be verified, I report it and request another URL or screenshot.

When to use it

  • Creating a new clipping template for a specific site (YouTube, news, recipes).
  • Converting an existing Base schema into a Clipper template.
  • Validating or repairing selectors after site layout changes.
  • Formatting clipped content with variables and filters before import.
  • Training consistent note structure across many clipped pages.

Best practices

  • Document the target element in short terms (e.g., “article author meta” or “recipe ingredients list”) so selectors match intent.

Example use cases

  • Create a recipe template that pulls title, ingredients (list), instructions, cook time, and image from major food blogs.
  • Build a YouTube clipper that captures video title, channel, publish date, description, and transcript link when available.
  • Generate a news article template that uses Schema.org article metadata and falls back to robust selectors if meta is missing.
  • Convert an existing Base like Recipes.base into a ready-to-import Web Clipper template with matching Preset and variables.
  • Repair a broken template by verifying selectors against the updated page DOM and replacing fragile class chains.

FAQ

What if I don’t have a sample URL?

Provide one before selector selection. If none is available, I can guide you on generic templates and recommended variables, but selectors must be verified later with a real page.

Can you guess selectors when DOM access fails?

No. I will not guess selectors. If the DOM is inaccessible, I’ll ask for another URL or a screenshot and explain which elements need verification.