Advertisement
romancetown

HTML rich text editor

Jun 14th, 2013
107
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 3.43 KB | None | 0 0
  1. <script type="text/javascript" src="http://www.html.am/html-editors/ckeditor/ckeditor.js"></script>
  2. <script src="http://www.html.am/html-editors/ckeditor/_samples/sample.js" type="text/javascript"></script>
  3. <link href="http://www.html.am/html-editors/ckeditor/_samples/sample.css" rel="stylesheet" type="text/css" />
  4. <div id="alerts">
  5. <noscript>
  6. <p>
  7. <strong>This online HTML editor requires JavaScript to run</strong>. Your browser either doesn't support JavaScript, or JavaScript is currently disabled (via preferences or options). Because of this, you will see the raw HTML code instead of the rich text / WYSIWYG editor.
  8. </p>
  9. <p>To view the rich text / WYSIWYG editor, please enable JavaScript (or use a browser that supports JavaScript).</p>
  10. </noscript>
  11. </div>
  12. <div style="width:600px;">
  13. <textarea class="ckeditor" cols="80" id="EditorBold" name="EditorBold" rows="10">
  14. <p>Instructions:</p>
  15. <ol>
  16. <li>Replace this text with your own text.</li>
  17. <li>Use the above toolbar format the text.</li>
  18. <li>Use the <b>Source</b> button to view the HTML code. You can then copy/paste the code into your own website or blog.</li>
  19. </ol>
  20. <p>There, that's all it takes to generate HTML text code for your website!</p>
  21. <hr />
  22. <p>If you found this HTML text generator useful, you may also be interested in this:</p>
  23. <p style="font-size:10px;"><a href="http://www.html.am/html-codes/">Free HTML Codes</a></p>
  24. </textarea>
  25. </div>
  26. <script type="text/javascript">
  27. //<![CDATA[
  28. CKEDITOR.replace( 'EditorBold',
  29. {
  30.  
  31. toolbar :
  32. [
  33.  
  34.  
  35. ['Bold'],
  36.  
  37. ['Italic'],
  38.  
  39. ['Underline'],
  40.  
  41. ['Strike'],
  42.  
  43. ['Subscript'],
  44.  
  45. ['Superscript'],
  46.  
  47. ['NumberedList'],
  48.  
  49. ['BulletedList'],
  50.  
  51. ['Outdent'],
  52.  
  53. ['Indent'],
  54.  
  55. ['Blockquote'],
  56.  
  57. ['CreateDiv'],
  58.  
  59. ['JustifyLeft'],
  60.  
  61. ['JustifyCenter'],
  62.  
  63. ['JustifyRight'],
  64.  
  65. ['JustifyBlock'],
  66.  
  67. ['Styles'],
  68.  
  69. ['Format'],
  70.  
  71. ['Font'],
  72.  
  73. ['FontSize'],
  74.  
  75. ['TextColor'],
  76.  
  77. ['BGColor'],
  78.  
  79. ['Source']
  80.  
  81. ]
  82.  
  83.  
  84. });
  85.  
  86. CKEDITOR.on( 'instanceReady', function( ev )
  87. {
  88. ev.editor.dataProcessor.writer.setRules( 'p',
  89. {
  90. indent : false,
  91. breakBeforeOpen : false,
  92. breakAfterOpen : false,
  93. breakBeforeClose : false,
  94. breakAfterClose : true
  95. });
  96. ev.editor.dataProcessor.writer.setRules( 'li',
  97. {
  98. indent : false,
  99. breakBeforeOpen : false,
  100. breakAfterOpen : false,
  101. breakBeforeClose : false,
  102. breakAfterClose : true
  103. });
  104. ev.editor.dataProcessor.writer.setRules( 'ul',
  105. {
  106. indent : false,
  107. breakBeforeOpen : false,
  108. breakAfterOpen : true,
  109. breakBeforeClose : false,
  110. breakAfterClose : true
  111. });
  112. ev.editor.dataProcessor.writer.setRules( 'ol',
  113. {
  114. indent : false,
  115. breakBeforeOpen : false,
  116. breakAfterOpen : true,
  117. breakBeforeClose : false,
  118. breakAfterClose : true
  119. });
  120. });
  121.  
  122. //]]>
  123. </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement