How To Install Tinymce On Your Website
In this tutorial nosotros are going to survive looking at how to install tinymce inside a shortest menses of fourth dimension together with larn it running on your website.
Tinymce tin destination survive installed inwards ii ways together with nosotros are taking them measurement past times step.
The start 1 is running it on the cloud.Running tinymce on the cloud only re-create together with glue this code on your HTML caput tags
<script src="https://cloud.tinymce.com/stable/tinymce.min.js"></script> <script>tinymce.init({ selector:'textarea' });</script> This is how is going to survive placed on your HTML every bit shown below
<!DOCTYPE html> <html> <head> <script src="https://cloud.tinymce.com/stable/tinymce.min.js"></script> <script>tinymce.init({ selector:'textarea' });</script> </head> <body> <textarea>Next, larn a costless TinyMCE Cloud API key!</textarea> </body> </html> But if you lot desire to run the script on your ain website without the cloud method,then follow this procedures successfully.
Steps
1. Download the script here
2. Extract the script to a folder
3. Create a javascript page together with scream it script.js together with glue the below code there.
tinymce.init({ selector: 'textarea', height: 500, theme: 'modern', plugins: [ 'advlist autolink lists link ikon charmap impress preview threescore minutes anchor pagebreak', 'searchreplace wordcount visualblocks visualchars code fullscreen', 'insertdatetime media nonbreaking relieve tabular array contextmenu directionality', 'emoticons template glue textcolor colorpicker textpattern imagetools codesample' ], toolbar1: 'insertfile undo redo | styleselect | bold italic underline | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image', toolbar2: 'print preview media | forecolor backcolor emoticons | codesample', image_advtab: true, templates: [ { title: 'Test template 1', content: 'Test 1' }, { title: 'Test template 2', content: 'Test 2' } ], content_css: [ 'css?family=Lato:300,300i,400,400i', 'css/codepen.min.css' ] }); 4.Now become to your HTML together with search for <head> together with house the below code later on <head>
<head> <script src="installation path/tinymce.min.js"></script> <script src="script.js"></script> </head>
After all this steps follow successfully,this functionality larn the larn the tags <textarea> automatically alongside that you lot tin destination survive able to editable your items together with grade them improve formatting.
Note:The installation path every bit mentioned before is the folder where the tinymce resides.Below is the demo of tinymce
