WordPress.org Developer Docs to Markdown Bookmarklet

Quick and dirty way to convert a WordPress developer documentation page into Markdown.

javascript:(function(){const turndownScript=document.createElement('script');turndownScript.src='https://unpkg.com/turndown/dist/turndown.js';turndownScript.onload=()=>{const turndownService=new TurndownService({gfm:true,headingStyle:'atx',codeBlockStyle:'fenced'});turndownService.addRule('table',{filter:'table',replacement:function(content,node){let markdownTable='\n';const rows=Array.from(node.querySelectorAll('tr'));const headerCells=Array.from(rows[0].querySelectorAll('th'));const columnCount=headerCells.length;let headerRow=headerCells.map(cell=>cell.textContent).join(' | ');let separatorRow=Array(columnCount).fill('---').join(' | ');markdownTable+=`| ${headerRow} |\n`;markdownTable+=`|${separatorRow}|\n`;for(let i=1;i<rows.length;i++){const cells=Array.from(rows[i].querySelectorAll('td'));const cellContent=cells.map(cell=>cell.textContent).join(' | ');markdownTable+=`| ${cellContent} |\n`;}return markdownTable;}});turndownService.addRule('noHeaderLinks',{filter:['h2','h3','h4','h5','h6'],replacement:function(content,node){let headingText=content;const link=node.querySelector('a');if(link){headingText=link.textContent;}return`\n\n${node.nodeName.toLowerCase().replace('h','')=='h2'?'##':'###'} ${headingText}\n\n`;}});turndownService.addRule('removeEmojis',{filter:function(node,options){return node.nodeName==='IMG'&&node.src.includes('s.w.org/images/core/emoji');},replacement:function(content){return'';}});const mainContent=document.querySelector('main#main')||document.querySelector('.entry-content')||document.body;const markdown=turndownService.turndown(mainContent);const markdownWindow=window.open('','_blank');markdownWindow.document.write(`<pre>${markdown}</pre>`);markdownWindow.document.title='Markdown Conversion';};document.body.appendChild(turndownScript);})();

Usage

1. Create a new bookmark in your browser
2. Name it something like "WP to Markdown"
3. Paste the code above into the URL field
4. Visit any WordPress developer documentation page and click the bookmark. A new tab will pop up with the Markdown content.

---

If you're looking for a more powerful command-line tool to scrape the entire WordPress Developer Documentation, check out https://github.com/kasparsd/wp-docs-md