Closed joegiannini closed 1 year ago
Ref: INT-2967
Hello @joegiannini
Have you tried setting content_style
for TinyMCE. To set TinyMCE properties you can either set the Blazor component's Conf
property or setting JsConfSrc
I've been using the Conf property of the Editor tag. It seems to work for setting the basic toolbar properties and size details jut fine. I am trying to have a specific font and font size selected by default. Essentially, I want to have the effect of running the setup function (ed) within init where I set the fontName and fontSize defaults. The below works w/ JS but I'm hoping to find a way to set the defaults using the blazor version.
tinymce.init({ selector: '#menu', toolbar: 'undo redo | styleselect | bold italic underline | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image', width: 700, height: 432, font_formats: 'Century Gothic=century gothic,sans-serif; Andale Mono=andale mono,times; Arial=arial,helvetica,sans-serif; Arial Black=arial black,avant garde; Book Antiqua=book antiqua,palatino; Comic Sans MS=comic sans ms,sans-serif; Courier New=courier new,courier; Georgia=georgia,palatino; Helvetica=helvetica; Impact=impact,chicago; Symbol=symbol; Tahoma=tahoma,arial,helvetica,sans-serif; Terminal=terminal,monaco; Times New Roman=times new roman,times; Trebuchet MS=trebuchet ms,geneva; Verdana=verdana,geneva; Webdings=webdings; Wingdings=wingdings,zapf dingbats', fontsize_formats: '8pt 10pt 11pt 12pt 14pt 16pt 18pt 24pt 36pt 48pt', setup: function (ed) { ed.on('init', function () { this.execCommand("fontName", false, "Century Gothic"); this.execCommand("fontSize", false, "11pt"); });
I am using TinyMCE 6 with Blazor Server (.NET 6). I used JsConfSrc
, as suggested by @jscasca, to set the fontName and fontSize defaults:
ComponentThatContainsTinyMCEEditor.razor:
<Editor JsConfSrc="tinymcesettings" />
_Layout.cshtml:
<script src="_framework/blazor.server.js"></script>
<script>
window.tinymcesettings = {
content_style: 'body { font-family:Tacoma,sans-serif; font-size:18px }',
height: 300,
+ any other settings...
}
</script>
Thank you both very much! Using content_style
does the trick. I had misread the original suggestion from @jscasca.
As the title suggests. I don't see a way to override the default font style and size when using the Blazor server version of TinyMCE.