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