public/assets/plugins/ckeditor/samples/old/stylesheetparser/stylesheetparser.html

   1 <!DOCTYPE html>\r
   2 <!--\r
   3 Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.\r
   4 For licensing, see LICENSE.md or http://ckeditor.com/license\r
   5 -->\r
   6 <html>\r
   7 <head>\r
   8         <meta charset="utf-8">\r
   9         <title>Using Stylesheet Parser Plugin &mdash; CKEditor Sample</title>\r
  10         <script src="../../../ckeditor.js"></script>\r
  11         <script src="../../../samples/old/sample.js"></script>\r
  12         <link rel="stylesheet" href="../../../samples/old/sample.css">\r
  13         <meta name="ckeditor-sample-required-plugins" content="stylescombo">\r
  14         <meta name="ckeditor-sample-name" content="Stylesheet Parser plugin">\r
  15         <meta name="ckeditor-sample-description" content="Using the Stylesheet Parser plugin to fill the Styles drop-down list based on the CSS classes available in the document stylesheet.">\r
  16         <meta name="ckeditor-sample-group" content="Plugins">\r
  17 </head>\r
  18 <body>\r
  19         <h1 class="samples">\r
  20                 <a href="../../../samples/old/index.html">CKEditor Samples</a> &raquo; Using the Stylesheet Parser Plugin\r
  21         </h1>\r
  22         <div class="warning deprecated">\r
  23                 This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/styles.html">brand new version in CKEditor SDK</a>.\r
  24         </div>\r
  25         <div class="description">\r
  26                 <p>\r
  27                         This sample shows how to configure CKEditor instances to use the\r
  28                         <strong>Stylesheet Parser</strong> (<code>stylesheetparser</code>) plugin that fills\r
  29                         the <strong>Styles</strong> drop-down list based on the CSS rules available in the document stylesheet.\r
  30                 </p>\r
  31                 <p>\r
  32                         To add a CKEditor instance using the <code>stylesheetparser</code> plugin, insert\r
  33                         the following JavaScript call into your code:\r
  34                 </p>\r
  35 <pre class="samples">\r
  36 CKEDITOR.replace( '<em>textarea_id</em>', {\r
  37         <strong>extraPlugins: 'stylesheetparser'</strong>\r
  38 });</pre>\r
  39                 <p>\r
  40                         Note that <code><em>textarea_id</em></code> in the code above is the <code>id</code> attribute of\r
  41                         the <code>&lt;textarea&gt;</code> element to be replaced with CKEditor.\r
  42                 </p>\r
  43         </div>\r
  44         <form action="../../../samples/sample_posteddata.php" method="post">\r
  45                 <p>\r
  46                         <label for="editor1">\r
  47                                 CKEditor using the <code>stylesheetparser</code> plugin with its default configuration:\r
  48                         </label>\r
  49                         <textarea cols="80" id="editor1" name="editor1" rows="10">&lt;p&gt;This is some &lt;strong&gt;sample text&lt;/strong&gt;. You are using &lt;a href="http://ckeditor.com/"&gt;CKEditor&lt;/a&gt;.&lt;/p&gt;</textarea>\r
  50                         <script>\r
  51 \r
  52                                 // This call can be placed at any point after the\r
  53                                 // <textarea>, or inside a <head><script> in a\r
  54                                 // window.onload event handler.\r
  55 \r
  56                                 // Replace the <textarea id="editor"> with an CKEditor\r
  57                                 // instance, using default configurations.\r
  58                                 CKEDITOR.replace( 'editor1' , {\r
  59                                         extraPlugins: 'stylesheetparser',\r
  60 \r
  61                                         // Stylesheet for the contents.\r
  62                                         contentsCss: 'assets/sample.css',\r
  63 \r
  64                                         // Do not load the default Styles configuration.\r
  65                                         stylesSet: []\r
  66                                 });\r
  67 \r
  68                         </script>\r
  69                 </p>\r
  70                 <p>\r
  71                         <input type="submit" value="Submit">\r
  72                 </p>\r
  73         </form>\r
  74         <div id="footer">\r
  75                 <hr>\r
  76                 <p>\r
  77                         CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>\r
  78                 </p>\r
  79                 <p id="copy">\r
  80                         Copyright &copy; 2003-2016, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico\r
  81                         Knabben. All rights reserved.\r
  82                 </p>\r
  83         </div>\r
  84 </body>\r
  85 </html>\r