1.0.2 • Published 6 years ago
tinymce-schema v1.0.2
Schema TinyMCE Plugin
This plugin helps the content editor add Schema values to content inside the WYISIWYG editor.
Installation
- Via NPM:
$ npm i tinymce-schema
- Via Github:
$ git clone https://github.com/nomensa/tinymce-schema
User workflow
- Highlight text;
- Press the "Add schema" button;
- A popup window appears with the title of "Adding schema" and field label "Schema property"
- Add the schema value as the "Schema property'
- Press "Ok"
Developer workflow
- The developer adds a schema type to the template, i.e:
itemtype="http://schema.org/Event"
- The WYSIWYG content editor highlights text and adds a property 'value' to the text;
- The plugin (always) adds a 'itemprop' attribute to the text with a
<span>
tag, i.e.:
<span itemprop="..."> Highlighted text </span>
- The plugin uses the value provided by the content editor inside the value of the 'itemprop' attribute, i.e.:
<span itemprop="event-title"> Highlighted text </span>
The development server
By running the npm start
command you start the development server and open a browser window with an instance of TinyMCE with your plugin added to it. This window will reload automatically whenever a change is detected in the index.html
file in the static
folder or in one of the JavaScript files in the src
directory.
The production build
By running the npm run build
command Webpack will create a dist
directory with a child directory with the name of your plugin (schema) containing three files:
plugin.js
- the bundled pluginplugin.min.js
- the bundles, uglified and minified pluginLICENSE
- a file explaining the license of your plugin (copied over fromsrc/LICENSE
)