Obsidian Webclipper

Last updated Dec 19, 2024 by Simon Späti

Obsidian Webcliper is an alternative to ReadWise web clipper.

Super powerful to clip websites to my Obsidian vault. Even with added AI-interpreted (e.g. description, scanning a LinkedIn Profile, etc.) for a summary. Find all the features in the documentation.

# My Templates

You can download and import

Feel free to download my exported Webclipper setting and import it to yours with all the templates. Warning. Importing will overwrite all your existing settings; make sure you export yours first as a backup.

I created a template for my most used cases:

# Default

Here is an example of my default one

 1
 2
 3
 4
 5
 6
 7
 8
 9
10


# {{title}}

Summary:
{{"a 5 bullet point summary, any titles, and references to people, places or books should be in [[wikilinks]] format"}}


---
Origin: {{url}}
References: 
Created date:"YYYY-MM-DD"}}

# Book (Goodreads)

note name: {{title|split:":" |first}} ({{author}})
note location: 💡 Resources/📚 Books/Want to Read/
template triggers: https://www.goodreads.com/

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27


# {{title|split:":" |first}} ({{author}})

- Subtitle: {{schema:@Book:name|split:":" |last}}
- Link: {{url}}
- Tags / Categories: #📬 #📚 #reading #wanttoread
- Created: date:"YYYY-MM-DD"}}
- Author: [[{{author}}]]
- Type: [[Books]]
- Genre:
- Related: 
- Started reading: 
- Finished reading: 
- Origin:

> 
> 
> TODO

## Short description (GoodRead)
{{"a short description of the book, maximum 400 characters"}}

## Notes During Reading
- 

### Highlights

{{highlights}}

# YouTube

Interpreter context:

1
2
3


{{selectorHtml:ytd-engagement-panel-section-list-renderer[visibility$=\"EXPANDED\"]
#segments-container|strip_tags:"h2,ytd-transcript-segment-renderer"
|replace:"ytd-transcript-segment-renderer":"li"|markdown}} 

*I added a new lines here and below for readability, please remove them before

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18


# {{title}}

{{description}}

## AI Highlights:
{{"summarize key points from this YouTube Video and transcript in bullet points. 
Any titles, and references to people, places, or books should be in [[wikilinks]] format"}}


## Transcript:
{{selectorHtml:ytd-engagement-panel-section-list-renderer[visibility$=\"EXPANDED\"]
#segments-container|strip_tags:"h2,ytd-transcript-segment-renderer"
|replace:"ytd-transcript-segment-renderer":"li"|markdown}}

---
Origin: {{url}} by {{author}}
References: 
Created date:"YYYY-MM-DD"}}

For the transcript to work, make sure you click Show transcript:

# Recipes Cooking

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19


# {{title}}
{{description}}

![]({{image}})

## Ingredients
{{"List all ingredients needed for this recipe"}}

## Preparation
{{"Create a numbered list and copy all the steps to cook and prepare this dish, 
bolding the key parts (only 2-3 words) of each step in markdown format. Remove empty lines for listing"}}

## Inspiring
{{"Point out anything surprising or special about this menu"}}

---
Origin: {{url}}
References: 
Created date:"YYYY-MM-DD"}}

# LinkedIn

Interpreter context: {{content|strip_tags:("aside,iframe,ad-banner-container")}}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15


# {{title|replace:"/\s\|\sLinkedIn$/":""}}


## Background LinkedIn
*{{url}}*
{{"3 key bullet points highlighting their current role, industry focus, and unique value proposition. 
References to people, places or books should be in [[wikilinks]] format. Don't hallucinate."}}

{{" markdown table (comma instead of listings) with professional details like: Current Position, Company, Location, 
Industry, Education, Certifications, Projects (if there), Languages. Don't hallucinate."}}

---
Origin: {{url}} (LinkedIn)
References: 
Created date:"YYYY-MM-DD"}}

# AI Interpret

If you defined OpenAI of Claude, you can let AI prompt the AI like this:

1
2
3


## Summary

{{"a 5 bullet point summary, any titles, and references to people, places or books should be in [[wikilinks]] format"}}

# Specify HTML Tags

You can specify an HTML tag to analyze. E.g. for LinkedIn, as the full page was always too long for Claude:

1

{{content|strip_tags:("aside,iframe,ad-banner-container")}}

# Examples

# Recipe

# GoodRead (Book)

# Coffee Beans

# LinkedIn Profile

# Variables

Variable	Description
`{{author}}`	Author of the page
`{{content}}`	Article content, highlights, or selection, in Markdown format
`{{contentHtml}}`	Article content, highlights, or selection, in HTML format
`{{date}}`	Current date, can be formatted using the `date` filter
`{{description}}`	Description or excerpt
`{{domain}}`	Domain
`{{favicon}}`	Favicon URL
`{{fullHtml}}`	Unprocessed HTML for the full page content
`{{highlights}}`	Highlights with text and timestamps
`{{image}}`	Social share image URL
`{{published}}`	Published date, can be formatted using the `date` filter
`{{site}}`	Site name or publisher
`{{title}}`	Title of the page
`{{time}}`	Current date and time
`{{url}}`	Current URL

Variables - Obsidian Help

Origin:
References:
Created 2024-12-11