Bootstrap 3 WYSIWYG:只在下拉列表中显示特定的字体样式?

时间:2016-01-25 16:27:36

标签: bootstrap-wysiwyg

我目前正在使用Bootstrap 3 WYSIWYG。我已经设置了以下textarea:

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

但是,我只想在font-styles下拉列表中显示选项“普通文字”和“标题2”。这可能吗?

1 个答案:

答案 0 :(得分: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
                        });