嵌入式文本编辑器_MediumEditor – Web的嵌入式文本编辑工具栏

每个人都知道Medium.com及其广受欢迎的博客平台。 他们在设计界重新定义了很多想法，您可以找到很多教程来教您如何克隆他们的设计。

您可能会喜欢的一种工具是基于纯JavaScript的MediumEditor插件 。 它使您可以将自定义内联文本编辑器添加到与Medium博客网站设计相同的任何页面。 因此，您可以使用简单的可视工具栏使读者加粗，斜体，添加链接，标题以及几乎所有其他内容。

请注意，该项目不以任何方式隶属于Medium，因此它不是官方插件 。

它是由网站的支持者和喜欢Medium设计风格的人创建的。 您可以在GitHub上了解有关设置的更多信息，该设置存储了所有代码，完全免费使用。

该编辑器可在所有主流浏览器中使用 ，包括当前版本的Microsoft Edge和IE。 它甚至支持可追溯到IE7的旧版Internet Explorer。 疯！

安装轻而易举，您可以直接通过npm或Bower 提取所有文件 ，甚至可以使用免费的在线CDN（例如JSDelivr） 。

然后，将CSS和JavaScript文件都添加到网站的标题中。 十分简单。

从那里，您只需一行代码即可调用编辑器 ：

var editor = new MediumEditor('.editable');

您可以传递仅应与编辑器一起使用的页面元素列表 ，也可以让它在整个页面上运行 。

该插件最实际的用途可能是为Web应用程序创建某种WYSIWYG编辑器 。

它不处理在服务器和客户端之间来回传递数据 ，因此您需要自己创建该逻辑。 不过，此插件比从头开始要容易得多。

如果滚动到MediumEditor 演示页面的最底部，则会找到您也可以测试的扩展列表 。 这些功能包括完整的降价编辑 ， 中型按钮和其他界面功能 。

强烈建议所有希望在其他项目中复制部分UX的中型粉丝使用此插件。

翻译自: https://www.hongkiat.com/blog/mediumeditor-script/