🤡公号文章排版利器 | 🐁尾汁Markdown转换工具来咯~(下)

简介: 从可定制和易用性两方面入手优化,这不第一个可用版本来咯~

② 生成转换后带样式的HTML


将md文件置于 article/md 目录下,如:


网络异常,图片无法展示
|


双击项目中的app.bat文件一键生成:


网络异常,图片无法展示
|


接着打开输出文件,HTML代码看着有点乱,没关系。


网络异常,图片无法展示
|


③ 复制到微信公众号编辑器


打开微信公众号,新建文章,F12打开开发者工具,定位到空白内容,如下图:


网络异常,图片无法展示
|


右键Edit as HTML,把生成的带样式的HTML代码拷进去:


网络异常,图片无法展示
|


点击下外部空白区域,然后看下编辑器处的效果,看着有点乱?还错位了?


网络异常,图片无法展示
|


没关系,点击下保存或预览,即可恢复正常,即使还不正常,没关系,以手机上的预览效果为准!


网络异常,图片无法展示
|


可以,效果看起来针不戳,还有自定义头尾样式,文字看起来步骤多,实际上就几步。


3、自定义自己的样式(进阶)


如果笔者的模板满足不了你,你看上了别人的样式,可以直接偷过来~


① 模板的获取


以某公号样式为例:


网络异常,图片无法展示
|


图片黑框背景和二级标题不错,浏览器打开,F12开发者模式定位到对应结点:


网络异常,图片无法展示
|


右键Copy → Copy element,粘贴到工程的 wash/before/in.html,执行下清洗脚本:


网络异常,图片无法展示
|


这里的清洗,就是剔除掉一些没用的字符串,如data-radio=xxx:


网络异常,图片无法展示
|


将图片地址部分内容改成 {{ src }},修改后:


网络异常,图片无法展示
|


将out.html文件放到template/custom/image目录下,改名为1.html,接着改下

样式文件,image=1


网络异常,图片无法展示
|


运行后把生成的带样式的HTML复制到微信,点击保存后看下效果:


网络异常,图片无法展示
|


黑边到手,剩下的二级标题也是如法炮制:


网络异常,图片无法展示
|


看下效果:


网络异常,图片无法展示
|


可以,样式的获取大概就这样,传参和文件夹结构可以参照:template/author 进行创建。


🐍Tips:使用自定义模板,需要修改config.ini文件,给为:template_dir = template/custom,如图:


网络异常,图片无法展示
|


4、自定义渲染器(进阶)


如果笔者的渲染器还不满足你的需求,而你也有较强的动手能力,可以自定义一个渲染器。以下述文章图片样式为例:


网络异常,图片无法展示
|


在Markdown语法中,插入一个图片,语法如下:


![发生甚么事了?](http:xxx)


笔者的渲染器只是对图片链接做了处理,图片描述是直接忽略掉的,如果想实现上述效果就需要自定义渲染器了。 当然也不难,抽取完样式,继承 mistune.HTMLRenderer,按需重写函数即可,此处重写image()


网络异常,图片无法展示
|


接着修改app.py:


网络异常,图片无法展示
|


最后运行,将生成的样式置于微信公号编辑器查看效果:


网络异常,图片无法展示
|


以上就是目前此工具的详细用法


相关文章
|
5月前
|
人工智能 前端开发 开发工具
9.2K Star!微信排版从未如此简单,这款开源神器让Markdown飞入公众号!
一款9.2K Star的开源神器,让微信公众号排版变得简单高效!支持Markdown语法,实时预览、多图床混搭、AI智能排版、自定义主题样式等功能一应俱全。通过沉浸式双栏编辑、七图床混合编排、AI写作助手和主题定制工坊等核心功能,彻底解放技术创作者的生产力。无论是技术博客迁移、多平台发布还是企业定制,都能满足需求。三步上手:在线体验、本地部署、公众号对接。项目地址:https://github.com/doocs/md
356 4
|
9月前
|
人工智能 文字识别 自然语言处理
Vision Parse:开源的 PDF 转 Markdown 工具,结合视觉语言模型和 OCR,识别文本和表格并保持原格式
Vision Parse 是一款开源的 PDF 转 Markdown 工具,基于视觉语言模型,能够智能识别和提取 PDF 中的文本和表格,并保持原有格式和结构。
1194 19
Vision Parse:开源的 PDF 转 Markdown 工具,结合视觉语言模型和 OCR,识别文本和表格并保持原格式
|
9月前
|
机器学习/深度学习 人工智能 文字识别
Zerox:AI驱动的万能OCR工具,精准识别复杂布局并输出Markdown格式,支持PDF、DOCX、图片等多种文件格式
Zerox 是一款开源的本地化高精度OCR工具,基于GPT-4o-mini模型,支持PDF、DOCX、图片等多种格式文件,能够零样本识别复杂布局文档,输出Markdown格式结果。
710 4
Zerox:AI驱动的万能OCR工具,精准识别复杂布局并输出Markdown格式,支持PDF、DOCX、图片等多种文件格式
|
10月前
|
人工智能 文字识别 数据挖掘
MarkItDown:微软开源的多格式转Markdown工具,支持将PDF、Word、图像和音频等文件转换为Markdown格式
MarkItDown 是微软开源的多功能文档转换工具,支持将 PDF、PPT、Word、Excel、图像、音频等多种格式的文件转换为 Markdown 格式,具备 OCR 文字识别、语音转文字和元数据提取等功能。
1870 9
MarkItDown:微软开源的多格式转Markdown工具,支持将PDF、Word、图像和音频等文件转换为Markdown格式
|
开发者
Markdown:解放排版,简洁高效的文字创作神器!
Markdown 是一种轻量级标记语言,以易读易写著称,常用于生成 HTML 页面。其简洁的语法加速了排版,尤其在写作、博客和文档领域广泛应用。虽然不擅长复杂排版,但能轻松实现字体大小调整、插入表格、图片和超链接等。Markdown 通过键盘快捷操作,避免了 Word 等软件的繁琐设置。本文将深入讲解 Markdown 语法,助你提升效率。Markdown 适合快速学习,兼容各种文本编辑器,支持导出多种格式,广泛应用于 GitHub 和多个在线平台。
427 0
|
Unix Linux Shell
Sphinx是一个Python文档生成工具,它可以解析reStructuredText或Markdown格式的源代码注释,并生成多种输出格式,如HTML、LaTeX、PDF、ePub等。
Sphinx是一个Python文档生成工具,它可以解析reStructuredText或Markdown格式的源代码注释,并生成多种输出格式,如HTML、LaTeX、PDF、ePub等。
|
7月前
|
前端开发 Docker 容器
写作利器,一款极简的Markdown 编辑器
WeChat Markdown Editor 是一款高度简洁的微信 Markdown 编辑器:支持 Markdown 语法、色盘取色、多图上传、一键下载文档、自定义 CSS 样式、一键重置等特性。
329 70
写作利器,一款极简的Markdown 编辑器
|
12月前
|
Ubuntu Linux 测试技术
Linux系统之部署轻量级Markdown文本编辑器
【10月更文挑战第6天】Linux系统之部署轻量级Markdown文本编辑器
517 1
Linux系统之部署轻量级Markdown文本编辑器
|
存储 安全 数据安全/隐私保护
Django 后端架构开发:富文本编辑器权限管理与 UEditor 、Wiki接入,实现 Markdown 文本编辑器
Django 后端架构开发:富文本编辑器权限管理与 UEditor 、Wiki接入,实现 Markdown 文本编辑器
561 0
|
存储 移动开发 编解码
基于HTML5开发的Markdown在线编辑器
Markdown是一种轻量级标记语言,以其简洁易读的格式而备受程序员和作者们的青睐。随着互联网的发展,越来越多的在线Markdown编辑器应运而生,为用户提供了更加便捷、高效的写作和编辑环境。本文将探讨基于HTML5开发的Markdown在线编辑器的设计原理、功能特点以及技术优势。
325 4