Can anyone tell me how, or if, I can style the text inserted by the TinyMCE insertdatetime plugin?
Specifically, I'd like to set the font size to smaller than the rest of the text.
I'm also wondering if doing so might cause a problem for subsequent typed text, because it would continue with the different font size?
This is what I'm using now:
insertdatetime_formats: [ '✏️ (%d/%m/%Y - %Hh%M)', '%d/%m/%Y' ],One way to do this is to wrap the date/time string in a <time> element using insertdatetime_element: true, then style that <time> tag with content_style. As you said, this does create a problem where the text will remain smaller if you continue typing (until you hit the Enter key).
As a workaround, you can use noneditable_noneditable_class and extended_valid_elements to add the noneditable class to the <time> tag (if it doesn't need to be editable) and any text typed after that will go back to the default style.
Example fiddle: https://fiddle.tiny.cloud/LShaab/3
tinymce.init({
selector: "textarea",
plugins: [
"insertdatetime noneditable"
],
insertdatetime_formats: ['(%d/%m/%Y - %Hh%M)', '%d/%m/%Y'],
insertdatetime_element: true,
content_style: "time { font-size:11px; }",
noneditable_noneditable_class: 'mceNonEditable',
extended_valid_elements: 'time[class=mceNonEditable]'
});