summernote-image-attributes
This version of summernote-image-attributes is a fork of the original project by DiemenDesign
A plugin for the Summernote WYSIWYG editor.
Adds a button to the image popover to edit title, alt, class and style attributes, and Links with relevant Attributes.
Installation
1. Include JS
Include the following code after including Summernote, to change the language from the default (en-US) you must add the lang file after the plugin.
<script src="summernote-image-attributes.js"></script>
<script src="lang/[language-COUNTRY].js"></script>2. Supported languages
Currently available in US English (Default), Spanish, French, Chinese (Traditional), Italian, German and Turkish!
3. Summernote options
Finally, customize the Summernote image popover.
$(document).ready(function() {
$('#summernote').summernote({
popover: {
image: [
['custom', ['imageAttributes']],
['imagesize', ['imageSize100', 'imageSize50', 'imageSize25']],
['float', ['floatLeft', 'floatRight', 'floatNone']],
['remove', ['removeMedia']]
],
},
lang: 'en-US', // Change to your chosen language
// imageAttribute configurations to enable/disable image popover tabs/fields
imageAttributesIcon: '<i class="note-icon-pencil"/>',
imageAttributesRemoveEmpty: true,
imageAttributesDisableImage: false,
imageAttributesDisableImageSource: true,
imageAttributesDisableImageTitle: false,
imageAttributesDisableImageAltText: false,
imageAttributesDisableImageDimensions: true,
imageAttributesDisableAttributes: true,
imageAttributesDisableAttributesClass: false,
imageAttributesDisableAttributesStyle: false,
imageAttributesDisableAttributesRole: false,
imageAttributesDisableLink: false,
imageAttributesDisableLinkUrl: false,
imageAttributesDisableLinkTarget: false,
imageAttributesDisableLinkClass: true,
imageAttributesDisableLinkStyle: true,
imageAttributesDisableLinkRel: true,
imageAttributesDisableLinkRole: true,
imageAttributesDisableUpload: true,
imageAttributesImageFolder: ''
});
});