如何排版 微信公众号「代码块」

本文分享了在微信公众号中使用Markdown排版的经验,特别是如何处理「代码块」的样式问题。介绍了借助MarkdownHere插件直接在公众号编辑器内转换Markdown为富文本的方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

最近博主刚开通微信公众号「石佳劼的博客」,被微信公众平台的图文编辑器折腾的不轻,如果文章中包含「代码块」,怎么排版都显得杂乱无章。之前一直用 Markdown 写作,从来没有考虑过排版、样式问题,因为绝大多数 Markdown 编辑器都能生成简洁、优雅的预览效果。

试过用 Markdown 在 GitHub为知笔记有道云笔记石佳劼的博客i 排版 生成带样式的文本,拷贝到微信公众号之后,「代码块」的样式几乎完全丢失,实在是惨不忍睹。

最后,终于在 知乎 上找到了解决方案,使用 Markdown Here 浏览器插件,能够直接在微信公众平台的图文编辑器中把 Markdown 转换成带样式的文本,从而避免拷贝引起的样式丢失,再对「代码块」的缩进、换行、字号、行间距进行微调即可。

Markdown Here 支持 Chrome、Safari、Firefox、Opera 等浏览器,不会翻墙的朋友可以在 Firefox 下使用。

Markdown Here 还提供了非常丰富的可选样式,博主用的是 Zenburn,大家可以根据自己的喜好选择。

折腾了快一个礼拜,能够在自己的公众号里看到深灰背景的「代码块」,真是内牛满面:

欢迎来到 石佳劼的博客,如有疑问,请在「原文」评论区 留言,我会尽量为您解答。


### 如何在微信公众号文章中添加代码块 为了在微信公众号文章中成功插入并格式化代码块,可以采用多种方法。一种方式是利用专门为此目的设计的工具或插件。 #### 使用MarkdownConvert工具 对于希望保持工作流程简洁高效的开发者来说,“MarkdownConvert”是一个非常有用的选择[^1]。此工具不仅简化了从Markdown到适合微信公众号HTML格式的转换过程,还提供了额外的功能如自定义文章主题等特性。 #### 利用GitHub上的开源项目 另一个解决方案来自于GitHub上发现的一个由lyric创建的强大编辑器,该编辑器允许直接把Markdown文件转化为适用于微信公众平台发布的HTML文档[^2]。这种方法同样能有效提升工作效率,并且可能提供更好的用户体验。 #### 手动编写带语法高亮的代码片段 如果倾向于手动操作,则可以在撰写过程中遵循特定规则来确保最终效果良好: 当输入反引号\`\`\`后紧跟指定的语言名称(例如 `python`, `javascript`),接着另起一行录入实际代码内容,在结束时再次闭合三个反引号即可完成一段带有适当样式的程序列表展示[^3]。 ```html <pre> <code class="language-python"> def hello_world(): print("Hello, world!") </code> </pre> ``` 需要注意的是,由于微信内置编辑器可能存在某些局限性,因此建议先通过上述提到的一些外部手段预处理后再粘贴至官方界面发布[^4]。
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值