Search code examples
wysihtml5bootstrap-wysihtml5

wysihtml5 bootstrap3-wysiwyg font size and <p> to <br>


I use bootstrap3-wysiwyg based on wysihtml5

I seek solution for

  1. On "Enter" key insert "br" not "p"

  2. Button for change font size with input value


Solution

    1. Use 'br'
    $("#TextContent").wysihtml5({useLineBreaks: true, ...})
    
    1. Font-size
      var myCustomTemplates = {
    
        custom1: function (context) {
            var s = ""
            s += '<li class="dropdown">';
            s += '<a class="btn btn-default dropdown-toggle" data-toggle="dropdown" tabindex="-1" aria-expanded="false">';
            s += '<span class="current-color">Size</span>';
            s += '<b class="caret"></b>';
            s += '</a>';
            s += '<ul class="dropdown-menu" style="margin-top: 0px;">';
            s += '<li><a class="fontSize" data-wysihtml5-command="fontSize" data-wysihtml5-command-value="fs5">5px</a></li>';
            s += '</ul>';
            s += '</li>';
    
            return s;
        }
    };
    
     $("#TextContent").wysihtml5(
            {
                customTemplates: myCustomTemplates,
                "stylesheets": ["~/Content/wysiwyg/editor.css"]
            });
    

    editor.css

    .wysiwyg-font-size-fs5 {
        font-size: 5px;
    }