alpaca
Version:
Alpaca provides the easiest and fastest way to generate interactive forms for the web and mobile devices. It runs simply as HTML5 or more elaborately using Bootstrap, jQuery Mobile or jQuery UI. Alpaca uses Handlebars to process JSON schema and provide
70 lines (67 loc) • 2.41 kB
HTML
<!--
Copyright (c) 2003-2014, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.md or http://ckeditor.com/license
-->
<html>
<head>
<meta charset="utf-8">
<title>UI Color Picker — CKEditor Sample</title>
<script src="../ckeditor.js"></script>
<link rel="stylesheet" href="sample.css">
</head>
<body>
<h1 class="samples">
<a href="index.html">CKEditor Samples</a> » UI Color
</h1>
<div class="description">
<p>
This sample shows how to automatically replace <code><textarea></code> elements
with a CKEditor instance with an option to change the color of its user interface.<br>
<strong>Note:</strong>The UI skin color feature depends on the CKEditor skin
compatibility. The Moono and Kama skins are examples of skins that work with it.
</p>
</div>
<form action="sample_posteddata.php" method="post">
<p>
This editor instance has a UI color value defined in configuration to change the skin color,
To specify the color of the user interface, set the <code>uiColor</code> property:
</p>
<pre class="samples">
CKEDITOR.replace( '<em>textarea_id</em>', {
<strong>uiColor: '#14B8C4'</strong>
});</pre>
<p>
Note that <code><em>textarea_id</em></code> in the code above is the <code>id</code> attribute of
the <code><textarea></code> element to be replaced.
</p>
<p>
<textarea cols="80" id="editor1" name="editor1" rows="10"><p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>
<script>
// Replace the <textarea id="editor"> with an CKEditor
// instance, using default configurations.
CKEDITOR.replace( 'editor1', {
uiColor: '#14B8C4',
toolbar: [
[ 'Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink' ],
[ 'FontSize', 'TextColor', 'BGColor' ]
]
});
</script>
</p>
<p>
<input type="submit" value="Submit">
</p>
</form>
<div id="footer">
<hr>
<p>
CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
</p>
<p id="copy">
Copyright © 2003-2014, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
Knabben. All rights reserved.
</p>
</div>
</body>
</html>