LK.WXAD.Web/Skin/plugins/ckeditor/samples/old/toolbar/toolbar.html

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<!DOCTYPE html>
<!--
Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.md or http://ckeditor.com/license
-->
<html>
<head>
	<meta charset="utf-8">
	<title>Toolbar Configuration &mdash; CKEditor Sample</title>
	<meta name="ckeditor-sample-name" content="Toolbar Configurations">
	<meta name="ckeditor-sample-group" content="Advanced Samples">
	<meta name="ckeditor-sample-description" content="Configuring CKEditor to display full or custom toolbar layout.">
	<script src="../../../ckeditor.js"></script>
	<link href="../../../samples/old/sample.css" rel="stylesheet">
</head>
<body>
	<h1 class="samples">
		<a href="../../../samples/old/index.html">CKEditor Samples</a> &raquo; Toolbar Configuration
	</h1>
	<div class="warning deprecated">
		This sample is not maintained anymore. Check out the <a href="../../../samples/toolbarconfigurator/index.html#basic">brand new CKEditor Toolbar Configurator</a>.
	</div>
	<div class="description">
		<p>
			This sample page demonstrates editor with loaded <a href="#fullToolbar">full toolbar</a> (all registered buttons) and, if
			current editor's configuration modifies default settings, also editor with <a href="#currentToolbar">modified toolbar</a>.
		</p>

		<p>Since CKEditor 4 there are two ways to configure toolbar buttons.</p>

		<h2 class="samples">By <a href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-toolbar">config.toolbar</a></h2>

		<p>
			You can explicitly define which buttons are displayed in which groups and in which order.
			This is the more precise setting, but less flexible. If newly added plugin adds its
			own button you'll have to add it manually to your <code>config.toolbar</code> setting as well.
		</p>

		<p>To add a CKEditor instance with custom toolbar setting, insert the following JavaScript call to your code:</p>

		<pre class="samples">
CKEDITOR.replace( <em>'textarea_id'</em>, {
	<strong>toolbar:</strong> [
		{ name: 'document', items: [ 'Source', '-', 'NewPage', 'Preview', '-', 'Templates' ] },	// Defines toolbar group with name (used to create voice label) and items in 3 subgroups.
		[ 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo' ],			// Defines toolbar group without name.
		'/',																					// Line break - next group will be placed in new line.
		{ name: 'basicstyles', items: [ 'Bold', 'Italic' ] }
	]
});</pre>

		<h2 class="samples">By <a href="http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-toolbarGroups">config.toolbarGroups</a></h2>

		<p>
			You can define which groups of buttons (like e.g. <code>basicstyles</code>, <code>clipboard</code>
			and <code>forms</code>) are displayed and in which order. Registered buttons are associated
			with toolbar groups by <code>toolbar</code> property in their definition.
			This setting's advantage is that you don't have to modify toolbar configuration
			when adding/removing plugins which register their own buttons.
		</p>