自定义 markitUp 工具栏

发布于 2024-08-04 23:47:16 字数 183 浏览 8 评论 0原文

有谁知道如何真正自定义 markitup 工具栏?当然,您可以从 mySettings 配置变量中删除项目,但这会以某种方式使工具栏出现混乱。您最终会得到由错误按钮代表的正确工具栏项目。有什么想法吗?

Has anyone figured out how to truely customize the markitup toolbar? Sure you can remove items from the mySettings config variable but that somehow garbles the toolbar. You end up with the right toolbar items represented by the wrong buttons. Any ideas?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

2024-08-11 23:47:16

我遇到了同样的问题。
我找到了这个教程(法语)可以帮助我自定义工具栏
jaysalvat.com

创建新工具栏时在 CSS 中,按钮名称(类)中的数字似乎很重要。

标记按钮1
标记按钮2
标记按钮3
markItUpButton4

在 CSS 中,如果您不想要与 markItUpButton2 关联的按钮,请将其删除或注释掉
您必须将下一个 markItUpButton3 重命名为 markItUpButton2 等,或者更改与其关联的图像。

最好的方法是使用教程从头开始。

我可能是错的,但就我而言,遵循教程和数字逻辑解决了问题。

问候,

I got the same problem.
I have found this tutorial (french) that help me to customize the toolbar
jaysalvat.com

When creating the new toolbar in the CSS the number in the button name (class) seems important.

markItUpButton1
markItUpButton2
markItUpButton3
markItUpButton4

In CSS if you don't want a button that is associate to markItUpButton2 remove it or comment it
and you will have to rename the next markItUpButton3 to markItUpButton2 and so on or change the image associate to it.

The best way it is to start from scratch using the tutorial.

I may be wrong but in my case following the tutorial and the number logic fixed the problem.

Regards,

梦幻的心爱 2024-08-11 23:47:16

我发现将自己的按钮添加到工具栏非常容易。只需在选项/ mySettings 配置中添加 className: 'classname' 即可。下面是粗体标签的示例,

{name:'Bold', key:'B', className: 'pBold', openWith:'(!(<strong>|!|<b>)!)', closeWith:'(!(</strong>|!|</b>)!)' },

然后在我的样式表中添加

.markItUp .pBold a {
background-image:url(images/bold.png);
}

I've found it pretty easy to add my own buttons to the toolbar.. just add the className: 'name of class' in with the options/ mySettings config.. example is below for the bold tag

{name:'Bold', key:'B', className: 'pBold', openWith:'(!(<strong>|!|<b>)!)', closeWith:'(!(</strong>|!|</b>)!)' },

then in my stylesheet I do

.markItUp .pBold a {
background-image:url(images/bold.png);
}
星星的軌跡 2024-08-11 23:47:16

如今,我认为这很容易。您可以在 style.css 中将按钮设置为 display:none ,并在 settings.js 中注释掉分隔符

Nowadays, I think it's very easy. You can just set the buttons to display:none in style.css, and comment out the separators in settings.js

牵你手 2024-08-11 23:47:16

刚刚遇到同样的问题。悲伤,但标记将按钮图像与其标题中的订单号联系起来。
您唯一能做的就是编辑 markitupSettings json 和 css 样式文件。

Just got the same problem. Sad, but markitup ties button image to it's order number in header.
The only thing you can do is edit both markitupSettings json and css styles file.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文