tinymce.js code example

Example 1: tinymce

Basic Example 
-------------------------------------------------------------------------
Html -> 

<textarea id="basic-example">
  <p style="text-align: center;">
    <img title="TinyMCE Logo" src="//www.tiny.cloud/images/[email protected]" alt="TinyMCE Logo" width="110" height="97" />
  </p>
  <h2 style="text-align: center;">Welcome to the TinyMCE editor demo!</h2>
  <h2>Got questions or need help?</h2>
</textarea>

Javascript -> 

tinymce.init({
  selector: 'textarea#basic-example',
  height: 500,
  menubar: false,
  plugins: [
    'advlist autolink lists link image charmap print preview anchor',
    'searchreplace visualblocks code fullscreen',
    'insertdatetime media table paste code help wordcount'
  ],
  toolbar: 'undo redo | formatselect | ' +
  'bold italic backcolor | alignleft aligncenter ' +
  'alignright alignjustify | bullist numlist outdent indent | ' +
  'removeformat | help',
  content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px }'
});

Example 2: tinymce.value

// Add a class to all paragraphs in the editor.
tinymce.activeEditor.dom.addClass(tinymce.activeEditor.dom.select('p'), 'someclass');

// Gets the current editors selection as text
tinymce.activeEditor.selection.getContent({format: 'text'});

// Creates a new editor instance
var ed = new tinymce.Editor('textareaid', {
    some_setting: 1
}, tinymce.EditorManager);

ed.render();

Tags:

Css Example