Markdown to HTML Conversion Script

[{"id":"eccf9aa2-0ed1-42da-9efe-93c0f2e13ba6","thread_id":"24a3ed82-9f10-4658-91c4-9bde657c3bfa","created_at":"2025-01-26T14:39:59Z","state":"done","prompt":"write a python script that transforms a markdown file with \"```\" code blocks to html. Render the code blocks appropriately.","reply":"Let me break this down step by step:\n<ol>\n<li>Read markdown file</li>\n<li>Find code blocks marked with ```</li>\n<li>Convert code blocks to HTML <code><pre><code></code> tags</li>\n<li>Handle language specification if present</li>\n<li>Convert the rest of markdown to HTML</li>\n</ol>\nHere's the implementation using Python's markdown library:\n<div class=\"codehilite\">Python<pre><code>import re\nimport markdown\nfrom pygments import highlight\nfrom pygments.formatters import HtmlFormatter\nfrom pygments.lexers import get_lexer_by_name, TextLexer\n\ndef convert_markdown_to_html(markdown_file_path, output_file_path):\n # Read markdown file\n with open(markdown_file_path, &#x27;r&#x27;, encoding=&#x27;utf-8&#x27;) as f:\n content = f.read()\n\n # Custom processing for code blocks\n def code_block_handler(match):\n code = match.group(2).strip()\n lang = match.group(1) if match.group(1) else &#x27;&#x27;\n\n try:\n if lang:\n lexer = get_lexer_by_name(lang, stripall=True)\n else:\n lexer = TextLexer()\n except:\n lexer = TextLexer()\n\n formatter = HtmlFormatter(linenos=True, cssclass=&quot;source&quot;)\n highlighted_code = highlight(code, lexer, formatter)\n return highlighted_code\n\n # Replace code blocks with highlighted HTML\n pattern = r&#x27;```(\\w*)\\n(.*?)```&#x27;\n processed_content = re.sub(pattern, code_block_handler, content, flags=re.DOTALL)\n\n # Convert remaining markdown to HTML\n html_content = markdown.markdown(\n processed_content,\n extensions=[&#x27;tables&#x27;, &#x27;fenced_code&#x27;, &#x27;codehilite&#x27;]\n )\n\n # Add CSS for syntax highlighting\n css = HtmlFormatter().get_style_defs(&#x27;.source&#x27;)\n complete_html = f&quot;&quot;&quot;\n &lt;!DOCTYPE html&gt;\n &lt;html&gt;\n &lt;head&gt;\n &lt;style&gt;\n {css}\n .source {{ padding: 10px; }}\n &lt;/style&gt;\n &lt;/head&gt;\n &lt;body&gt;\n {html_content}\n &lt;/body&gt;\n &lt;/html&gt;\n &quot;&quot;&quot;\n\n # Write output HTML file\n with open(output_file_path, &#x27;w&#x27;, encoding=&#x27;utf-8&#x27;) as f:\n f.write(complete_html)\n\n# Usage example\nif __name__ == &quot;__main__&quot;:\n convert_markdown_to_html(&#x27;input.md&#x27;, &#x27;output.html&#x27;)\n</code></pre></div>\nThis script: \n- Uses <code>markdown</code> library for basic markdown conversion \n- Uses <code>pygments</code> for syntax highlighting \n- Handles code blocks with or without language specification \n- Adds line numbers to code blocks \n- Includes necessary CSS for syntax highlighting \n- Creates a complete HTML document\nRequired packages: \n<div class=\"codehilite\">Bash<pre><code>pip install markdown pygments\n</code></pre></div>","md":"Let me break this down step by step:\n\n1. Read markdown file\n2. Find code blocks marked with ```\n3. Convert code blocks to HTML `<pre><code>` tags\n4. Handle language specification if present\n5. Convert the rest of markdown to HTML\n\nHere's the implementation using Python's markdown library:\n\n```python\nimport re\nimport markdown\nfrom pygments import highlight\nfrom pygments.formatters import HtmlFormatter\nfrom pygments.lexers import get_lexer_by_name, TextLexer\n\ndef convert_markdown_to_html(markdown_file_path, output_file_path):\n # Read markdown file\n with open(markdown_file_path, 'r', encoding='utf-8') as f:\n content = f.read()\n \n # Custom processing for code blocks\n def code_block_handler(match):\n code = match.group(2).strip()\n lang = match.group(1) if match.group(1) else ''\n \n try:\n if lang:\n lexer = get_lexer_by_name(lang, stripall=True)\n else:\n lexer = TextLexer()\n except:\n lexer = TextLexer()\n \n formatter = HtmlFormatter(linenos=True, cssclass=\"source\")\n highlighted_code = highlight(code, lexer, formatter)\n return highlighted_code\n\n # Replace code blocks with highlighted HTML\n pattern = r'```(\\w*)\\n(.*?)```'\n processed_content = re.sub(pattern, code_block_handler, content, flags=re.DOTALL)\n \n # Convert remaining markdown to HTML\n html_content = markdown.markdown(\n processed_content,\n extensions=['tables', 'fenced_code', 'codehilite']\n )\n \n # Add CSS for syntax highlighting\n css = HtmlFormatter().get_style_defs('.source')\n complete_html = f\"\"\"\n <!DOCTYPE html>\n <html>\n <head>\n <style>\n {css}\n .source {{ padding: 10px; }}\n </style>\n </head>\n <body>\n {html_content}\n </body>\n </html>\n \"\"\"\n \n # Write output HTML file\n with open(output_file_path, 'w', encoding='utf-8') as f:\n f.write(complete_html)\n\n# Usage example\nif __name__ == \"__main__\":\n convert_markdown_to_html('input.md', 'output.html')\n```\n\nThis script:\n- Uses `markdown` library for basic markdown conversion\n- Uses `pygments` for syntax highlighting\n- Handles code blocks with or without language specification\n- Adds line numbers to code blocks\n- Includes necessary CSS for syntax highlighting\n- Creates a complete HTML document\n\nRequired packages:\n```bash\npip install markdown pygments\n```","profile":{"id":"095899c5-634b-4eeb-ad03-41fd508fbb51","name":"Code","model":"claude-3-sonnet","model_name":"Claude 3.7 Sonnet","model_provider":"anthropic","model_input_limit":1000000,"recommended":false,"model_info":"\n\n<div class=\"heading\">\n <div class=\"left\">\n \n \n \n <svg class=\"model-icon icon-xs\" data-model=\"claude-3-sonnet\">\n <use href=\"#icon-kagi-1\"/>\n </svg>\n <h3>\n \n Code\n </h3>\n </div>\n\n \n</div>\n\n\n<hr />\n<ul>\n \n <li>\n <h4>\n Model\n </h4>\n \n <svg class=\"icon-xs icon\">\n <use href=\"#icon-anthropic\" />\n </svg>\n Claude 3.7 Sonnet\n \n </li>\n <li>\n <h4>\n Web access\n </h4>\n Off\n </li>\n <li>\n <h4>\n Lenses\n </h4>\n --\n </li>\n \n</ul>\n","model_provider_name":"Anthropic","internet_access":false,"personalizations":false,"shortcut":null,"is_default_profile":true},"metadata":"<li>\n Model\n <svg><use href=\"#icon-anthropic\"></use></svg>Claude 3.5 Sonnet\n</li>\n<li>\n Version\n claude-3-5-sonnet-20241022\n</li>\n<li>\n Speed (tok/s)\n 25,779\n</li>\n<li>\n Tokens\n 1,866\n</li>\n<li>\n Cost / Total ($)\n none\n</li>\n<li>\n End to end time (s)\n 0.05\n</li>\n\n","documents":[]}]

References