Question

我使用contenttools脚本。

我有以下代码：如何编辑“READ MORE”文本？

<div data-name="main-content-1" data-editable="" class="home3-box1">
<h3>
    Test test test
</h3>
<p>
    Test test test Test test test Test test test
</p>
<a href="#" class="btn btn-success btn-default">READ MORE</a></div>

https://jsfiddle.net/0x15nshk/1/

Answer 1

您可以在这里尝试几种方法，最简单的方法是将按钮放在可编辑的文本标签中，例如段落，例如：

<p>
    <a href="#" class="btn btn-success btn-default">READ MORE</a> 
</p>

或者，如果您不想使用其他p元素，则可以将a标记标记为文本元素类型，如下所示：

<a href="#" class="btn btn-success btn-default" data-ce-tag="text">READ MORE</a>

请注意，此处使用data-ce-tag属性标记该元素应解析为ContentEdit.Text元素。

您可能还想考虑在标签的编辑方式上应用一些限制，在ContentTools (1.2.5)的最新版本中，现在可以进行实验。作为如何处理这个问题的简单示例：

// Define a limited set of tools that can be used with buttons
var BUTTON_TOOLS = [
    ['align-left', 'align-center', 'align-right'], 
    ['undo', 'redo']
    ];

ContentEdit.Root.get().bind('focus', function (element) {
    var tools;

    // Whenever a button is selected switch to the button only tools
    if (element.domElement().containsClass('btn')) {
        tools = BUTTON_TOOLS;
    } else {
        tools = ContentTools.DEFAULT_TOOLS;
    }

    if (ContentTools.EditorApp.get().toolbox().tools() !== tools) {
        ContentTools.EditorApp.get().toolbox().tools(tools);
    }

    // Limit the behaviour of the button so it can't be moved, merged or removed
    if (element.domElement().classList.contains('btn')) {
        element.can('drag', false);
        element.can('drop', false);
        element.can('remove', false);
        element.can('merge', false);
    } 
});

此处提供了有关不同元素行为的文档：http://getcontenttools.com/api/content-edit#behaviours

如何使用contenttools编辑带有（按钮）链接的html？

1 个答案: