0

I actually have an issue with tinymce and the style_formats.

I created a css file and add with content_css function. Then i apply my style with style_formats like this :

tinymce.init({
  selector: "textarea",
  paste_text_sticky: true,
  paste_text_sticky_default: true,
  paste_as_text: true,
  forced_root_block: "",
  force_br_newlines: true,
  force_p_newlines: false,
  menubar: false,
  height: 700,
  schema: 'html5',
  min_height: "700",
  max_height: 3000,
  language: "fr_FR",
  content_css: 'stylesheets/SITE/aparte_generic.css?'+ new Date().getTime(),
  style_formats: [

    {
      title: 'Headers', items: [

      {
        title: 'H2', items: [
        {title: "H2 Corail", inline: 'h2', classes: '_aparte_h2_corail', wrapper: true},
        {title: "H2 Violine", inline: 'h2', classes: '_aparte_h2_violine', wrapper: true},
        {title: "H2 Prune", inline: 'h2', classes: '_aparte_h2_prune', wrapper: true},
        {title: "H2 Gris", inline: 'h2', classes: '_aparte_h2_grey', wrapper: true}
      ]
      },
      {
        title: 'H3', items: [
        {title: "H3 Corail", inline: 'h3', classes: '_aparte_h3_corail', wrapper: true},
        {title: "H3 Violine", inline: 'h3', classes: '_aparte_h3_violine', wrapper: true},
        {title: "H3 Prune", inline: 'h3', classes: '_aparte_h3_prune', wrapper: true},
        {title: "H3 Gris", inline: 'h3', classes: '_aparte_h3_grey', wrapper: true}
      ]
      }
    ]
    },

    {
      title: 'Bold', items: [
      {title: "Bold corail", inline: 'strong', classes: '_bold_corail', wrapper: true},
      {title: "Bold gris", inline: 'strong', classes: '_bold_grey', wrapper: true},
      {title: "Bold rouge", inline: 'strong', classes: '_bold_red', wrapper: true},
      {title: "Bold prune", inline: 'strong', classes: '_bold_prune', wrapper: true}
    ]
    },

    {
      title: 'Autres', items: [
      {title: "Block fond", block: 'div', classes: '_block_background', wrapper: true},
      {title: "Surligné Corail", inline: 'span', classes: '_surligne_corail', exact: true},
      {title: "Surligné Prune", inline: 'span', classes: '_surligne_prune', exact: true},
      {title: 'Texte arrow Prune', inline:'span', classes: '_inline_arrow_prune'}
    ]
    }
  ],
  link_class_list: [
    {title: 'Lien surligné', value: '_link_surligne'},
    {title: 'Lien avec fond', value: '_link_background'}
  ],
  table_class_list: [
    {title: '', value: ''},
    {title: 'full width', value: '_table_width'}
  ],
  plugins: [
    "advlist autolink lists link image charmap preview anchor",
    "searchreplace visualblocks code fullscreen",
    "insertdatetime media table contextmenu paste jbimages "
  ],
  toolbar: "code | undo redo | removeformat  | styleselect | bold italic underline | alignleft aligncenter alignright alignjustify | table | bullist numlist outdent indent | link image jbimages | fullscreen",
  relative_urls: false
});

The classes are apply good, except that tinymce not take the good font i load ( inside the css file ) by from myfonts.net like that

 @import url("//hello.myfonts.net/count/3338780");
@font-face {font-family: 'B-Regular';src: url('../../fonts/webfonts/333780_0.eot');src: url('../../fonts/webfonts/3338780_0_0.eot?#iefix') format('embedded-opentype'),url('../../fonts/webfonts/3338780_0_0.woff2') format('woff2'),url('../../fonts/webfonts/3338780_0_0.woff') format('woff'),url('../../fonts/webfonts/3338780_0_0.ttf') format('truetype');}

The font is correctly apply everywhere except inside tinymce, how can i visualize the good font-face inside it properly ?

Thanks a lot by advance

loximose
  • 11
  • 3
  • Possible duplicate of [Adding new fonts to TinyMCE font options](http://stackoverflow.com/questions/14170758/adding-new-fonts-to-tinymce-font-options) – behkod Mar 08 '17 at 12:41
  • Consider reading [How to ask](http://stackoverflow.com/help/mcve) before asking – behkod Mar 08 '17 at 12:42
  • another duplicate: http://stackoverflow.com/questions/15499198/how-to-add-a-new-font-in-tinymce-editor – behkod Mar 08 '17 at 12:43

0 Answers0