主机参考:VPS测评参考推荐/专注分享VPS服务器优惠信息!若您是商家可以在本站进行投稿,查看详情!此外我们还提供软文收录、PayPal代付、广告赞助等服务,查看详情! |
我们发布的部分优惠活动文章可能存在时效性,购买时建议在本站搜索商家名称可查看相关文章充分了解该商家!若非中文页面可使用Edge浏览器同步翻译!PayPal代付/收录合作 |
2019年,微信微信官方账号排版能力较弱,总被运营商诟病。休米135编辑器和其他工具被分开了。
然而,无论是微信原生工具还是其他编辑器,创作者都不得不将有限的创作经验分散到排版设计中。
Markdown的排版灵丹妙药应运而生。
一、什么是入门1.1 Markdown?Markdown是一种排版语法,它具有极简的输入法和非常低的学习成本。
丰富的标题、引号、粗体、链接、图片、代码片段、公式和文本创作所需的所有其他排版格式。
1.2如何与微信微信官方账号结合?如此优秀的排版语法是微信微信官方账号所不支持的。
1.3什么是markdownnice?一个开源的Markdown编辑器。写完后就排版成功了。复制粘贴到微信微信官方账号。
那又怎样?就这些吗?
当然不是!可爱的宝宝,你还有什么其他特征?
支持绘图床、脚注、代码和公式、8种印刷主题和7种代码主题,并支持自定义样式。人们可以提交主题以表达敬意。除了公众号,他们还支持知乎、掘金、博客花园和CSDN等平台。我有很高的价值。这么多优秀的功能摆在你面前,你还在等什么?
地址:https://mdnice.com。
赶紧让你的微信排版好看起来吧!
我没指望你读课文。
咳咳咳,
不要低估可爱的我。为了能够使用Markdown进行微信官方账号排版,我与微信官方账号编辑器奋斗了半年才获得了现在的成绩!
想听听我怎么打架吗?现在听我说!
2.1战序微信微信官方账号编辑器源于百度FEX前端团队的开源ueditor项目,是我刮网页代码时被宝宝发现的,如图:
因为ueditor是一个富文本编辑器,我即将面对Markdown -》;富文本的转换运动已经在开源或软件世界中实现了相当多的出色实现。例如:
Web端:editor.md,mavonEditorPC端:typora,MWeb。但是上述所有工具都存在一个问题,CSS样式没有很好地融入到富文本中,以适应微信编辑器,甚至国内其他主要平台的富文本编辑器。
那么有什么工具可以尝试弥补这个问题吗?实际上,有:
Web: md2all,we chat -格式浏览器插件:markdown-hereMarkdown Nice是一个开源项目,它结合了许多开源技术,包括:
React:facebook的开源js视图层框架Markdown -IT:Markdown -IT:Markdown富文本解析器juice:一个将CSS类选择器转换为内联样式的工具codemirror: Web代码编辑器Ant -Design: ReactUI组件库mobx:状态管理库highlight.js:代码突出显示。库math jax -节点:公式转换为图片库axios、ali-oss、qiniu-js等。注意:下面将提到上面的一些开源库。请在这里参考开源库的具体功能。
拥有以上技术后,我在微信编辑器上宣战,打响了战斗的第一枪!
2.2战斗的第一枪:2018年之前,代码主题微信微信官方账号根本不支持代码块,目前的支持非常简单,并且存在代码字体大的问题。
为此,我找到了名为highlight.js的代码的高亮神器来帮助解决代码主题单一的问题。
经过一定的筛选,最终选出了atom-one-dark、atom-one-light、monikai、GitHub、vs2015、xcode和微信代码主题七种代码风格供大家选择。
其中,微信代码的主题不属于highlight.js的范畴,因此其结构需要从微信官方账号编辑器的源代码中获取。下面两张图片展示了如何获得它:
而highlight.js与markdown-it解析器相关联,因此工具中有两个markdown解析器,分别用于解析微信代码主题和其他代码主题。
除了上述问题外,还有许多技术微信官方账号代码:单行代码过长导致的多行显示问题。
使用以下CSS代码可以解决这个问题:
预编码{display: -webkit-box!重要}复制代码对比效果如图所示:
从现在开始,使用Markdown Nice的同志代码更漂亮了!
2.3战斗的第二枪:一篇好文章没有图片怎么上传?
(有技术人员说:我的没有)
好宝宝开始用SM了。由一个大老板经营的床位小姐。非常感谢!
虽然你可以使用这个画床上传图片,但当你将其粘贴到微信编辑器中时,失败率很高(你想碾压微信编辑器),如图所示:
那是{我爱它| hēhēh }!
为了解决上述问题,Markdown Nice先后支持了阿里云和奇牛云的定制云床,并通过购买阿里云和奇牛云的服务来使用自建云床。
但是!让用户自己配置,虽然有配置文档,但整个配置过程极其复杂,简直可怕!
于是,Nice Baby用自己的账号,搭建了自己的图片床,设置保存时间为一天,并提供了mdnice图片床用于临时排版。此时,工具中的图片上传支持如下:
床位费有效期内的失败率为一天免费,SM较低。MS长期免费,高用于阿里云,低用于参考和自定义七牛云10G免费用于自定义,低用于在这场床上之战中,最大的困难在于读取阿里云OSS和七牛云KODO的文档,并使用他们的开源工具包ali-oss和qiniu-js。
这涉及到FormData、file对象、base64和blob以及源代码引用之间的神奇转换。
总之,这场战斗是一种享受。
2.4战斗第三枪:数学公式在微信微信官方账号的排版中,数学公式简直是噩梦!
因为微信编辑器做了以下三件事:
不支持公式编辑。不支持html和css生成的公式,因为字体无法导入且不支持svg,放入后提示失败。目前唯一可行的方案是将公式转换成图片,然后直接粘贴到微信官方账号中。Nice baby认为这个想法很完美!
但是怎么做呢?......
突然灵机一动,想到了一个网站codecogs,是朋友推荐的。这个网站可以将任何公式转换成png图片,并提供可访问的链接。
但是由于画面的稳定性,链接无法直接使用,会出现和第二场战斗一样的情况,让人苦不堪言。
如何解决这个问题?如果您可以构建自己的公式并将其传输到png图片服务,那就太好了。有这样的开源库吗?是啊!math jax -节点就可以了!所以Nice Baby自己搭建了后台服务,为前端调用封装了RESTful接口,实现了公式转换成图片的功能!经过测试,完全可以使用,然后根据粘贴后的排版情况调整图片大小。
其中,对于大量公式的转换,前端合理使用异步请求,不是逐个转换而是并行执行,性能达到2秒内转换10个公式的效果,完全可以用于公式排版。
2.5战斗的第四枪:脚注的微信链接众所周知(如果你不知道,你需要知道)。微信不支持外部链接,除了带有https://mp.weixin.qq.com/.域名的合法链接外,其他所有链接出现后都会自动删除
添加外部链接的唯一官方方法是阅读全文。当然,也可以直接将链接本身放在文本中或制作二维码图片。
Nice baby提供了一种方法来解决这个问题,它将微信外链变成了一个脚注。优雅吗?
使用链接和脚注的区别如下:
链接:So Nice Baby我又做了一个小改进,就是在粘贴文章时,我会自动监测是否有外部链接,并提示作者是否一键将其变成脚注,这样就不需要手动修改了。是不是很牛逼?
2.6战役的总结和与微信官方账号编辑的对抗极其有趣。除了上面提到的问题,还有很多细节需要注意,这里就不讨论了。如果你感兴趣,请阅读源代码。
第三,说说与战斗无关的3.1设计理念。对于大多数人来说,内容比排版更重要,而排版比设计更重要。
内容是吸引读者的核心,所以是最重要的。
排版与设计的对比作为一名前微信美术编辑,随着排版经验的增加,发现文章的效果并不在于多余的花边和点缀。
3.2内容、排版和设计=排版+创意
因为:大多数人不会得到创意,或者认为创意的成本太高。
所以:大多数人不做设计,富文本设计不适合简单的内容编辑器。
虽然:大多数人不会排版,或者认为排版成本太高。
但是:Markdown Nice将用户从排版中解放出来,只关注内容本身。
3.3开源是一个简单而困难的过程:
很简单,因为笔记、书籍、工具和平台等所有有价值的东西都可以在GitHub中导出。做起来简单,做起来难,因为做起来难。如上所述,做开源实际上是在做一个产品,它可能是一个技术产品(如redis和ant design),一个商业产品(如Markdown Nice)。
制作产品的过程是曲折而漫长的。与Markdown Nice开发流程相比,我们可以看到以下步骤:
我们应该有一个想法,验证其可行性和必要性,与同类产品进行比较,抓住痛点,把握核心价值,从用户的角度思考,听取反馈螺旋上升,不断迭代,生产出精品。最重要的是做产品不仅要写代码,还要做宣传!!酒味也怕巷子深!!参与开源并不容易,一路走来,希望大家珍惜。
“解释开源项目系列”-让对开源项目感兴趣的人不再害怕,让开源项目的发起人不再孤独。关注我们的文章,你会发现编程很有趣,使用和参与开源项目是如此简单。欢迎留言联系我们,加入我们,让更多人爱上开源,为开源做贡献~
这几篇文章你可能也喜欢:
本文由主机参考刊发,转载请注明:困难微信微信官方账号编辑(微信微信官方账号平台编辑) https://zhujicankao.com/106527.html
评论前必须登录!
注册