London Dev Meetup Rescheduled! Due to unavoidable reasons, the event has been moved to 21st May. Speakers remain the same—any changes will be communicated. Seats are limited—register here to secure your spot!
AI OnAI Off
London Dev Meetup Rescheduled! Due to unavoidable reasons, the event has been moved to 21st May. Speakers remain the same—any changes will be communicated. Seats are limited—register here to secure your spot!
I think it's down to using block rather than selector:
var arrowLink = new { title = "Arrow Link", selector = "a", classes = RichTextEditors.ArrowLinkClass };
var standOutText = new { title = "Standout Text", selector = "p", classes = RichTextEditors.StandoutTextClass };
settings.AddPlugin("table anchor")
.BlockFormats(
"Paragraph=p;Header 2=h2;Header 3=h3;Header 4=h4;Header 5=h5;Header 6=h6")
.StyleFormats(arrowLink, standOutText)
.Toolbar(
"formatselect styleselect | epi-link anchor | bold italic underline | superscript subscript | bullist numlist | image epi-image-editor",
"table tabledelete tableprops tablerowprops tablecellprops tableinsertrowbefore tableinsertrowafter tabledeleterow tableinsertcolbefore tableinsertcolafter tabledeletecol",
"epi-personalized-content | removeformat | undo redo searchreplace | fullscreen help");
FYI: in later versions of CMS 12, TinyMCE is updated from v2 and you'll have some minor changes, specifically `formatselect` and `styleselect` become `blocks` and `styles` in the toolbars.
var arrowLink = new { title = "Arrow Link", selector = "a", classes = RichTextEditors.ArrowLinkClass };
var standOutText = new { title = "Standout Text", selector = "p", classes = RichTextEditors.StandoutTextClass };
settings.AddPlugin("table anchor")
.BlockFormats(
"Paragraph=p;Header 2=h2;Header 3=h3;Header 4=h4;Header 5=h5;Header 6=h6")
.StyleFormats(arrowLink, standOutText)
.Toolbar(
"blocks styles",
"epi-link anchor | bold italic underline | superscript subscript | bullist numlist | image epi-image-editor",
"table tabledelete tableprops tablerowprops tablecellprops tableinsertrowbefore tableinsertrowafter tabledeleterow tableinsertcolbefore tableinsertcolafter tabledeletecol",
"epi-personalized-content | removeformat | undo redo searchreplace | fullscreen help");
Hi,
We are in process of migrating EpiServer 11 to Optimizely ver. 12. We have also got a front-end framework AngularJS which we are also migrating to VueJS.
In our TinyMceConfiguration we have this styleformat
services.Configure<TinyMceConfiguration>(config => { // Add the advanced list styles, table, and code plugins // and append buttons for inserting and editing tables // and showing source code to the toolbar config.Default() .AddPlugin("xxx") .Toolbar( "xxx") .StyleFormats( new { title = "Accordion heading", block = "h2", classes = "accordion-header", } ) ; }); return services;
this generates following html
The accordion-header class is used as AngularJS directive but this class can't be used in VueJS directive. For VueJS directive to work I need special attribute in Html tag
e.g
How can I add this special attribute to above html via TinyMCE styleformats or by someother way ?
I tried to add format like this but it didn't work. The attirbute should be added directly to h2 html tag
Sorry if this is little bit out of the scope of Optimizely