为什么tinyMCE中的extended_valid_elements配置不起作用?

时间:2019-01-08 17:51:09

标签: tinymce tinymce-4

我正在尝试将一些架构元素添加到我上传到网站的图像中。

我在每个textarea中都使用tinyMCE(v4),将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' 
        },              
    ]   
  });

这是单击图像编辑器时UI的外观: enter image description here

我认为我在这里遗漏了一些东西,或者只是不了解添加itemprop属性的可能性。

为什么不工作?

0 个答案:

没有答案