home / skills / xfstudio / skills / obsidian-clipper-template-creator

obsidian-clipper-template-creator skill

safe

This skill helps you create importable Obsidian Web Clipper JSON templates by guiding base selection, URL analysis, and verified selectors.

npx playbooks add skill xfstudio/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 to create importable JSON templates for the Obsidian Web Clipper. It focuses on mapping Base schemas, validating site-specific selectors and variables, and producing ready-to-import JSON templates you can drop into Obsidian.

How this skill works

Start by identifying the clipping intent and any existing Base schema to inherit properties. Fetch the target page (URL or DOM snapshot) and analyze HTML, Schema.org JSON-LD, and meta tags to discover reliable variables. Verify each selector against the live content, then draft a valid JSON object that follows the clipper schema and the chosen variables.

When to use it

You want to create a new clipping template for a specific site (e.g., YouTube, a blog, a recipe site).
You need to adapt a generic Base schema into a site-specific template with verified selectors.
You want to format clipped content using clipper filters and variables.
You have a sample URL or DOM snapshot and need an importable JSON template.

Best practices

Always fetch the live page or provide a DOM snapshot before choosing selectors—never guess selectors.
Prefer stable selectors (data attributes, unique IDs, semantic roles) over fragile class chains.
Map template properties to an existing Base when possible to maintain consistency.
Verify variables (Preset, Schema, Selector) exist in the analyzed page; if not, request another URL.
Document the target element purpose (e.g., "recipe ingredient list") to reduce mismatches.

Example use cases

Create a Recipe template that pulls title, ingredients, instructions, image, and rating from a cooking site.
Build a YouTube clipper template that extracts video title, channel, publish date, and description.
Convert a Base like Recipes.base into a site-specific template using Schema.org data and verified selectors.
Prepare an importable JSON template that formats clipped notes with filters and variables for consistent notes.

FAQ

What if I don't have a sample URL?

Provide a representative URL or a DOM snapshot. Without page content, selectors cannot be verified and template accuracy will be low.

Can you guess selectors from class names?

No. Selectors must be verified against fetched content. Guesses are unreliable; the workflow requires validation.