sources/plugins/Audio/docs/install.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   2         "http://www.w3.org/TR/html4/loose.dtd">
   3 <html lang="en">
   4 <head>
   5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   6 <title>Audio plugin</title>
   7 <link href="styles.css" rel="stylesheet" type="text/css">
   8 </head>
   9
  10 <body>
  11 <h1>Audio Plugin for CKEditor</h1>
  12
  13 <h2>Introduction</h2>
  14 <p>This is a plugin to create HTML5 &lt;audio&gt; elements in <a href="http://www.ckeditor.com">CKEditor</a>.</p>
  15 <h3>Version history: </h3>
  16 <ol>
  17   <li>1.0: 10-July-2015. First version.</li>
  18 </ol>
  19
  20 <h2>Installation</h2>
  21 <h3>1. Copying the files</h3>
  22 <p>Extract the contents of the zip in you plugins directory, so it ends up like
  23     this<br>
  24     <!--<img src="installation.png" alt="Screenshot of installation" width="311" height="346" longdesc="#install">-->
  25     </p>
  26 <pre id="--install">
  27 ckeditor\
  28         ...
  29         images\
  30         lang\
  31         plugins\
  32                 ...
  33                 audio\
  34                         plugin.js
  35                         dialogs\
  36                                 audio.js
  37                         docs\
  38                                 install.html
  39                         images\
  40                                 icon.png
  41                                 placeholder.png
  42                 ...
  43         skins\
  44         themes\
  45 </pre>
  46 <h3>2. Adding it to CKEditor</h3>
  47 <p>Now add the plugin in your <em>config.js</em> or custom js configuration
  48 file:
  49 <code>config.extraPlugins='audio'; </code>
  50 </p>
  51
  52 <h3>3. Add it to your toolbar</h3>
  53 <p>In your toolbar configuration, add a new 'Audio' item in the place where you want the button to show up.</p>
  54
  55 <h3>4. Configure server browser for audio</h3>
  56 <p>You can use the <code>config.filebrowserAudioBrowseUrl</code> entry to specify a url so the file browser shows just audio elements (as long as your configure properly your file browser).</p>
  57
  58 <h3>5. Use it</h3>
  59 <p>Now empty the cache of your browser and reload the editor, the new button should show up and you can add &lt;audio&gt; elements into the content.</p>
  60
  61 <h2>Final notes</h2>
  62 <p>Please, note that only newer browsers support the Audio element, in older ones a simple text linking to the source audios is provided, you might want to
  63 use some javascript or css to customize the final behavior of these elements.</p>
  64
  65
  66 <h2>Disclaimers</h2>
  67 <p>CKEditor is  &copy; CKSource.com</p>
  68 </body>
  69 </html>