Почему этот конфиг extended_valid_elements в tinyMCE не будет работать? - PullRequest
Новая
       11

Почему этот конфиг extended_valid_elements в tinyMCE не будет работать?

0 голосов
/ 08 января 2019

Я пытаюсь добавить некоторые элементы схемы в изображения, загружаемые на мой сайт.

Я использую tinyMCE (v4) в каждом textarea, и после добавления свойства extended_valid_elements в tinymce.init я все еще не могу понять, как на самом деле добавить изображение itemprop в каждое изображение.

Это мой файл tinymce.js: 

  tinymce.init({
    entity_encoding : "raw",
    selector: '.wysiwyg',
    schema: 'html5',
    plugins: "media anchor code image imagetools textcolor colorpicker hr link table lists advlist contextmenu",
    toolbar: 'styleselect | undo redo | bold italic underline | link image | forecolor backcolor | hr | table code | alignleft aligncenter alignright alignjustify',
    menubar: "",
    contextmenu: "bold italic underline forecolor backcolor | bullist numlist | link | cell row column deletetable",
    content_css : ["/css/style-tinymce.css", "//fonts.googleapis.com/css?family=Lato:300,300i,400,400i"],
    //valid_elements : "img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name]",
    image_caption: true,
    image_advtab: true,
    style_formats_merge: true,
    extended_valid_elements : "img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name|itemtype|itemscope|itemprop|id|class|style]",
    style_formats: [
      {title: 'Imagen a la Izquierda', selector: 'img', styles: {
        'float' : 'left',
        'margin': '0 10px 0 10px',
        'width': '100%',
        'height': 'auto'
      }},
      {title: 'Imagen a la Derecha', selector: 'img', styles: {
        'float' : 'right',
        'margin': '0 10px 0 10px',
        'width': '100%',
        'height': 'auto'
      }},
      {title: 'Imagen Centrada', selector: 'img', styles: {
        'margin-left': 'auto !important',
        'margin-right': 'auto !important',
        'width': '100%',
        'height': 'auto'
      }},     
      { title: 'Encabezado', 
        block: 'h2', 
        styles: {   'color': '#0871ad' } 
        },
      { title: 'Texto Resaltado', 
        inline: 'span', 
        styles: {   'color': '#000000',
                    'background-color': '#f6f433' 
                } 
        },
      { title: 'Boton Azul Chico', 
        selector: 'a',
        classes: 'btn btn-primary btn-sm' 
        },
      { title: 'Boton Rojo Chico', 
        selector: 'a',
        classes: 'btn btn-danger btn-sm' 
        },              
    ]   
  });

А вот как выглядит пользовательский интерфейс при нажатии на редактор изображений: enter image description here

Полагаю, что я что-то здесь упускаю или просто не понимаю, где взять возможность добавить атрибут itemprop.

Почему не работает?

...