hzwz-markdown
是一款基于 Python 实现的,用于 将Markdown文件转换成带样式的微信公众号文章HTML
的工具。
简单点说:排版工具(Markdown → 公众号)
如果你和笔者一样,用 Markdown语法 撰写文稿,再用 统一样式 对文章进行排版,最后发布到公号上,使用此工具,可以有效提高你的排版效率。
网上提供的Markdown转换工具不少,如:
- Markdown转换工具:http://blog.didispace.com/tools/online-markdown/
- Md2All:http://md.aclickall.com/
- MPEditor:http://js8.in/mpeditor/
- Markdown:https://www.mdnice.com/
先感谢下大佬们提供的工具,笔者在开发时复制了部分样式,如 Mac样式窗口(真香),而在使用这些工具时,发现了两个问题:
- ① 样式单一:烂大街,有些支持定制,但要自己写CSS,不会前端谁顶得住啊。
- ② 夹带私货:要登录,要关注,要跳转,恶心心,我只是想转下文件,TM搞那么复杂。
遂有了自己写一个工具的想法,我的愿景:
- ① 样式灵活:样式我不会写,偷 我会啊,看到喜欢的公号样式直接偷,还有谁?
- ② 简单易用:用户通过尽可能简单的配置,一键完成转换,一劳永逸。
- ③ 纯粹&可定制:代码开源,没有私货,纯透明,如果懂点Python基础还能自行订制。
可以直接调用 git clone 克隆项目,也可以直接Download代码压缩包
Windows用户,直接到官网下载安装包exe,然后无脑下一步安装即可~
Mac用户,可以直接用brew直接安装
brew install python3
// 查看可用node版本
brew search node
// 安装需要的版本
brew install node@12
Linux用户,稍微繁琐一些,都需要编译安装,先是Python3
// 安装依赖
sudo yum -y install zlib-devel bzip2-devel openssl-devel ncurses-devel sqlite-devel readline-devel tk-devel gdbm-devel db4-devel libpcap-devel xz-devel libffi-devel
// 下载安装包,如这里下载3.7.2版本
wget https://www.python.org/ftp/python/3.7.2/Python-3.7.2.tgz
// 解压缩安装包
tar -zxvf Python-3.7.2.tgz
// 配置安装路径
cd Python-3.7.2
./configure prefix=/usr/local/python3
// 编译安装Python3
make && make install
// 测试是否安装成功
python3 -V
pip3 -V
然后是Nodejs:
cd /usr/local
mkdir nodejs
cd nodejs
wget https://nodejs.org/dist/v12.14.0/node-v12.14.0-darwin-x64.tar.gz
// 解压及重命名
tar zxvf node-v12.14.0-darwin-x64.tar.gz
// 删除多余压缩包
rm -rf node-v12.14.0-darwin-x64.tar.gz
// 改名nodejs
mv node-v12.14.0-darwin-x64/* /usr/local/nodejs
// 建立软链接
ln -s /usr/local/nodejs/bin/node /usr/local/bin
ln -s /usr/local/nodejs/bin/npm /usr/local/bin
// 测试是否安装成功
node -v
npm -v
如果以上方法走不通,建议善用搜索引擎~
直接执行下述命令安装 (Mac使用pip3)
pip install -r requirements.txt
可能出现的错误:
ImportError: cannot import name ‘soft_unicode’ from 'markupsafe’
# 解决方法:把已经安装的版本卸载,安装旧版本
pip install markupsafe==2.0.1
编译时,只会使用custom里的样式配置文件!!!你可以:
- ① 复制author文件夹里笔者提供的配置文件到custom目录下;
- ② 复制default_config.ini文件到custom目录下,然后自行定制;
定制的规则也很简单,如:
是的,主要修改下None的值,除codestyle和mac_window外,其他的值都指向对应的模板文件,如:h2=1 → 指向:template/h2/1.html
codestyle → 代码高亮,基于highlight.js,通过黑魔法将css转换为ini,并将样式写入到HTML中。 喜欢什么代码样式,自己去官网挑:https://highlightjs.org/
复制下这个样式名,如此处的:atom-one-dark 即可应用。
mac_window → Mac窗口风格,样式提取自:https://www.mdnice.com/,有下述几种可供选择:
具体效果如下:
Tips:样式配置文件配置一次就可以了,后续不用配置~
将md文件放到 article/md 目录下,如:
然后找到app.py文件,右键run运行:
接着,控制台会输出应用的样式及输出的文件路径:
来到article/out目录下可以看到生成带样式的HTML文件,排版有点乱,没关系:
接着打开微信公众号,新建文章,F12打开开发者工具,定位到空白内容,如下图:
右键Edit as HTML,把生成的带样式的HTML代码拷进去,然后点下外部空白区域即可:
看着有点乱?错位,没关系,点击下保存或者预览,即可恢复正常
还不正常也没关系,预览发送到手机查阅效果:
可以,效果很不错,还有自定义头尾样式,看起来步骤很多,其实非常简单,真一步到位。
这就是这个脚本的用法,如果你想订制自己的样式的话,可以继续往下看~
以某公号的样式为例:
这个黑框背景图片和二级标题不错,网页文章页,F12定位到对应结点,
右键Copy → Copy element,粘贴到工程的 wash/before/in.html,执行下清洗脚本:
将out.html文件放到template/image目录下,改名为2.html,接着改下样式文件,image=2
运行后把生成的带样式的HTML复制到微信,点击保存后看下效果:
黑边到手,剩下的二级标题也是如法炮制:
看下效果:
如果这个工具满足不了你,而你动手能力较强的,也可以直接改 styles_renderer.py 自行订制一个渲染器。