creating-bookmarklets

Solid

Creates browser-executable JavaScript bookmarklets with strict formatting requirements. Use when users mention bookmarklets, browser utilities, dragging code to bookmarks bar, or need JavaScript that runs when clicked in the browser toolbar.

Web & Frontend 134 stars 7 forks Updated yesterday MIT

Install

View on GitHub

Quality Score: 84/100

Stars 20%
71
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# Bookmarklet Creation ## Critical Requirements ### Comment Style - ABSOLUTE **Use ONLY `/* */` comments. NEVER use `//` comments.** Bookmark execution contexts fail with `//` style. Every comment must use block format. ```javascript /* ✓ Correct */ const x = 5; /* inline */ /* ✗ Wrong - breaks bookmarklets */ // const x = 5; const y = 10; // inline ``` ### IIFE Wrapper All bookmarklets must wrap in IIFE: ```javascript (function() { /* bookmarklet code */ })(); ``` ### Protocol Prefix All delivered bookmarklets must begin with `javascript:` protocol: ```javascript javascript:(function() { /* bookmarklet code */ })(); ``` This makes the code immediately usable without requiring manual modification during installation. ## Workflow ### 1. Generate Pretty-Printed Code Create readable source with: - 2-space indentation - Descriptive variable names - Block comments for key sections - Logical organization - **Prepend `javascript:` protocol to the code** **This version with `javascript:` prefix gets stored in GitHub and shown to users, making it ready for installation without manual modification.** ### 2. Provide Installation **Default approach - reference installer:** ``` Install: https://austegard.com/web-utilities/bookmarklet-installer.html ``` Installer handles: - Minification with Terser - URL encoding - Draggable link generation - GitHub repo integration **Alternative - generate link programmatically:** Use Terser.js to create installable link if requested...

Details

Author
oaustegard
Repository
oaustegard/claude-skills
Created
9 months ago
Last Updated
yesterday
Language
Python
License
MIT

Integrates with

Similar Skills

Semantically similar based on skill content — not just same category