Bootstrap 3 所见即所得：仅在下拉列表中显示特定字体样式？

Question

我目前正在使用 Bootstrap 3 WYSIWYG。我已经设置了以下文本区域：

$(".textarea").wysihtml5({
    toolbar: {
        "font-styles": true,
        "emphasis": true,
        "lists": false,
        "html": false,
        "link": true,
        "image": false,
        "color": false,
        "blockquote": false
    }
});

但是，我只想在 font-styles 下拉列表中显示选项 "Normal text" 和 "Heading 2"。这可能吗？

Answer 1

字体大小

    var myCustomTemplates = {
    "font-styles": function (context) {
        var locale = context.locale;
        var options = context.options;
        return "<li class='dropdown'>"+
                "<a class='btn btn-default dropdown-toggle btn-"+ options.toolbar.size+"' data-toggle='dropdown'>"+
                 "<span class='glyphicon glyphicon-font'></span>"+
                 "<span class='current-font'>"+ locale.font_styles.normal+"</span>"+
                 "<b class='caret'></b>"+
                 "</a>"+
                 "<ul class='dropdown-menu'>"+
                   "<li><a data-wysihtml5-command='formatBlock' data-wysihtml5-command-value='p' tabindex='-1'>"+locale.font_styles.normal+"</a></li>"+
                 "<li><a data-wysihtml5-command='formatBlock' data-wysihtml5-command-value='h2' tabindex='-1'>"+locale.font_styles.h2+"</a></li>"+
                  "</ul>"+
                "</li>";
    }

// pass in your custom templates on init
$('.textarea').wysihtml5({
                        toolbar: {"font-styles": true,
                         "emphasis": true,
                         "lists": false,
                         "html": false,
                         "link": true,
                         "image": false,
                         "color": false,
                         "blockquote": false},
                        customTemplates: myCustomTemplates
                        });

Bootstrap 3 所见即所得：仅在下拉列表中显示特定字体样式？

Bootstrap 3 WYSIWYG: Only show specific font-styles in dropdown?

bootstrap-wysiwyg