我正在尝试将一些架构元素添加到我上传到网站的图像中。
我在每个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'
},
]
});
我认为我在这里遗漏了一些东西,或者只是不了解添加itemprop属性的可能性。
为什么不工作?