A lightweight, developer-focused Chrome Extension (built with Manifest V3) designed to convert Grok (by xAI) conversations into Blogger-compatible HTML format and clean Markdown, allowing seamless publishing to Blogger posts.
- Secure Network Interception: Silently intercepts Grok API requests from the main page context to retrieve complete conversation data, supporting pagination and long threads.
- Blogger HTML & Markdown Export: Automatically parses Grok's raw Markdown response and outputs Blogger-tailored HTML styling as well as standard Markdown.
- Interactive Sidebar Interface: Adds a clean, non-intrusive floating sidebar directly on the Grok page for real-time previewing, layout customization, and one-click copying.
- Offline/Pagination Support: Seamlessly caches and handles conversation updates during active sessions.
- Modern Vector Asset: Features a newly redesigned geometric/slanted style icon.
Here is an overview of the key files in this extension:
Grok2Blogger/
├── manifest.json # Extension configuration & V3 permissions
├── background.js # Service worker handling toolbar clicks & content script injection
├── inject.js # Code executed in the MAIN world to intercept Grok API responses
├── content.js # Main content script managing sidebar rendering, Marked parser & clipboard
├── sidebar/
│ └── sidebar.html # UI template and stylesheets for the floating sidebar
├── lib/
│ └── marked.min.js # Third-party library for fast Markdown parsing
└── assets/
├── icon.svg # Redesigned master vector icon
├── icon16.png # 16x16px extension action icon
├── icon48.png # 48x48px extension dashboard icon
├── icon128.png # 128x128px details/unpacked icon
└── icon512.png # 512x512px high-res webstore promotional icon
Since this extension is in active development, you can load it locally as an unpacked extension:
- Open your Google Chrome or any Chromium-based browser.
- Navigate to
chrome://extensions/by typing it in the address bar. - Enable Developer mode by toggling the switch in the top-right corner.
- Click the Load unpacked button in the top-left corner.
- Select the root folder of this project (
Grok2Blogger). - The Grok to Blogger extension will now appear in your list.
- Navigate to any active Grok conversation on Twitter/X (e.g.,
https://x.com/i/grok?conversation=...). - Click the Grok to Blogger action icon in your Chrome toolbar.
- A clean floating sidebar will slide open on the right side of the screen.
- As you navigate the conversation, the sidebar will automatically extract the content.
- Use the preview area to inspect the rendering, and click Copy HTML or Copy Markdown to save the formatted result to your clipboard.
- Paste directly into the HTML editor of your Blogger dashboard.
- Chrome Extension APIs: MV3, Runtime Messaging, Scripting injection.
- Marked.js: Light, high-speed markdown compiler utilized in
content.jsto format output. - Vanilla JavaScript & CSS: Zero-dependency UI construction.
This project is licensed under the MIT License.