WebSVN – lars-tiefland.ci – Blame – /htdocs/backend/assets/global/plugins/ckeditor/samples/xhtmlstyle.html

Revision	Autor	Zeilennr.	Zeile
776	lars	1	`<!DOCTYPE html>`
		2	`<!--`
		3	`Copyright (c) 2003-2014, CKSource - Frederico Knabben. All rights reserved.`
		4	`For licensing, see LICENSE.md or http://ckeditor.com/license`
		5	`-->`
		6	`<html>`
		7
		8	`<head>`
		9	`<meta charset="utf-8">`
		10	`<title>XHTML Compliant Output — CKEditor Sample</title>`
		11	`<meta name="ckeditor-sample-required-plugins" content="sourcearea">`
		12	`<script src="../ckeditor.js"></script>`
		13	`<script src="../samples/sample.js"></script>`
		14	`<link href="sample.css" rel="stylesheet"> </head>`
		15
		16	`<body>`
		17	`<h1 class="samples">`
		18	`<a href="index.html">CKEditor Samples</a> » Producing XHTML Compliant Output </h1>`
		19	`<div class="description">`
		20	`<p> This sample shows how to configure CKEditor to output valid`
		21	`<a class="samples" href="http://www.w3.org/TR/xhtml11/">XHTML 1.1</a> code. Deprecated elements (<code><font></code>, <code><u></code>) or attributes (<code>size</code>, <code>face</code>) will be replaced with XHTML compliant code. </p>`
		22	`<p> To add a CKEditor instance outputting valid XHTML code, load the editor using a standard JavaScript call and define CKEditor features to use the XHTML compliant elements and styles. </p>`
		23	`<p> A snippet of the configuration code can be seen below; check the source of this page for full definition: </p> <pre class="samples">`
		24	`CKEDITOR.replace( '<em>textarea_id</em>', {`
		25	`contentsCss: 'assets/outputxhtml.css',`
		26
		27	`coreStyles_bold: {`
		28	`element: 'span',`
		29	`attributes: { 'class': 'Bold' }`
		30	`},`
		31	`coreStyles_italic: {`
		32	`element: 'span',`
		33	`attributes: { 'class': 'Italic' }`
		34	`},`
		35
		36	`...`
		37	`});</pre> </div>`
		38	`<form action="sample_posteddata.php" method="post">`
		39	`<p>`
		40	`<label for="editor1"> Editor 1: </label>`
		41	`<textarea cols="80" id="editor1" name="editor1" rows="10"><p>This is some <span class="Bold">sample text</span>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p></textarea>`
		42	`<script>`
		43	`CKEDITOR.replace('editor1',`
		44	`{`
		45	`/*`
		46	`* Style sheet for the contents`
		47	`*/`
		48	`contentsCss: 'assets/outputxhtml/outputxhtml.css',`
		49	`/*`
		50	`* Special allowed content rules for spans used by`
		51	`* font face, size, and color buttons.`
		52	`*`
		53	`* Note: all rules have been written separately so`
		54	`* it was possible to specify required classes.`
		55	`*/`
		56	`extraAllowedContent: 'span(!FontColor1);span(!FontColor2);span(!FontColor3);' + 'span(!FontColor1BG);span(!FontColor2BG);span(!FontColor3BG);' + 'span(!FontComic);span(!FontCourier);span(!FontTimes);' + 'span(!FontSmaller);span(!FontLarger);span(!FontSmall);span(!FontBig);span(!FontDouble)',`
		57	`/*`
		58	`* Core styles.`
		59	`*/`
		60	`coreStyles_bold:`
		61	`{`
		62	`element: 'span',`
		63	`attributes:`
		64	`{`
		65	`'class': 'Bold'`
		66	`}`
		67	`},`
		68	`coreStyles_italic:`
		69	`{`
		70	`element: 'span',`
		71	`attributes:`
		72	`{`
		73	`'class': 'Italic'`
		74	`}`
		75	`},`
		76	`coreStyles_underline:`
		77	`{`
		78	`element: 'span',`
		79	`attributes:`
		80	`{`
		81	`'class': 'Underline'`
		82	`}`
		83	`},`
		84	`coreStyles_strike:`
		85	`{`
		86	`element: 'span',`
		87	`attributes:`
		88	`{`
		89	`'class': 'StrikeThrough'`
		90	`},`
		91	`overrides: 'strike'`
		92	`},`
		93	`coreStyles_subscript:`
		94	`{`
		95	`element: 'span',`
		96	`attributes:`
		97	`{`
		98	`'class': 'Subscript'`
		99	`},`
		100	`overrides: 'sub'`
		101	`},`
		102	`coreStyles_superscript:`
		103	`{`
		104	`element: 'span',`
		105	`attributes:`
		106	`{`
		107	`'class': 'Superscript'`
		108	`},`
		109	`overrides: 'sup'`
		110	`},`
		111	`/*`
		112	`* Font face.`
		113	`*/`
		114	`// List of fonts available in the toolbar combo. Each font definition is`
		115	`// separated by a semi-colon (;). We are using class names here, so each font`
		116	`// is defined by {Combo Label}/{Class Name}.`
		117	`font_names: 'Comic Sans MS/FontComic;Courier New/FontCourier;Times New Roman/FontTimes',`
		118	`// Define the way font elements will be applied to the document. The "span"`
		119	`// element will be used. When a font is selected, the font name defined in the`
		120	`// above list is passed to this definition with the name "Font", being it`
		121	`// injected in the "class" attribute.`
		122	`// We must also instruct the editor to replace span elements that are used to`
		123	`// set the font (Overrides).`
		124	`font_style:`
		125	`{`
		126	`element: 'span',`
		127	`attributes:`
		128	`{`
		129	`'class': '#(family)'`
		130	`},`
		131	`overrides: [`
		132	`{`
		133	`element: 'span',`
		134	`attributes:`
		135	`{`
		136	`'class': /^Font(?:Comic\|Courier\|Times)$/`
		137	`}`
		138	`}]`
		139	`},`
		140	`/*`
		141	`* Font sizes.`
		142	`*/`
		143	`fontSize_sizes: 'Smaller/FontSmaller;Larger/FontLarger;8pt/FontSmall;14pt/FontBig;Double Size/FontDouble',`
		144	`fontSize_style:`
		145	`{`
		146	`element: 'span',`
		147	`attributes:`
		148	`{`
		149	`'class': '#(size)'`
		150	`},`
		151	`overrides: [`
		152	`{`
		153	`element: 'span',`
		154	`attributes:`
		155	`{`
		156	`'class': /^Font(?:Smaller\|Larger\|Small\|Big\|Double)$/`
		157	`}`
		158	`}]`
		159	`},`
		160	`/*`
		161	`* Font colors.`
		162	`*/`
		163	`colorButton_enableMore: false,`
		164	`colorButton_colors: 'FontColor1/FF9900,FontColor2/0066CC,FontColor3/F00',`
		165	`colorButton_foreStyle:`
		166	`{`
		167	`element: 'span',`
		168	`attributes:`
		169	`{`
		170	`'class': '#(color)'`
		171	`},`
		172	`overrides: [`
		173	`{`
		174	`element: 'span',`
		175	`attributes:`
		176	`{`
		177	`'class': /^FontColor(?:1\|2\|3)$/`
		178	`}`
		179	`}]`
		180	`},`
		181	`colorButton_backStyle:`
		182	`{`
		183	`element: 'span',`
		184	`attributes:`
		185	`{`
		186	`'class': '#(color)BG'`
		187	`},`
		188	`overrides: [`
		189	`{`
		190	`element: 'span',`
		191	`attributes:`
		192	`{`
		193	`'class': /^FontColor(?:1\|2\|3)BG$/`
		194	`}`
		195	`}]`
		196	`},`
		197	`/*`
		198	`* Indentation.`
		199	`*/`
		200	`indentClasses: ['Indent1', 'Indent2', 'Indent3'],`
		201	`/*`
		202	`* Paragraph justification.`
		203	`*/`
		204	`justifyClasses: ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyFull'],`
		205	`/*`
		206	`* Styles combo.`
		207	`*/`
		208	`stylesSet: [`
		209	`{`
		210	`name: 'Strong Emphasis',`
		211	`element: 'strong'`
		212	`},`
		213	`{`
		214	`name: 'Emphasis',`
		215	`element: 'em'`
		216	`},`
		217	`{`
		218	`name: 'Computer Code',`
		219	`element: 'code'`
		220	`},`
		221	`{`
		222	`name: 'Keyboard Phrase',`
		223	`element: 'kbd'`
		224	`},`
		225	`{`
		226	`name: 'Sample Text',`
		227	`element: 'samp'`
		228	`},`
		229	`{`
		230	`name: 'Variable',`
		231	`element: 'var'`
		232	`},`
		233	`{`
		234	`name: 'Deleted Text',`
		235	`element: 'del'`
		236	`},`
		237	`{`
		238	`name: 'Inserted Text',`
		239	`element: 'ins'`
		240	`},`
		241	`{`
		242	`name: 'Cited Work',`
		243	`element: 'cite'`
		244	`},`
		245	`{`
		246	`name: 'Inline Quotation',`
		247	`element: 'q'`
		248	`}]`
		249	`});`
		250	`</script>`
		251	`</p>`
		252	`<p>`
		253	`<input type="submit" value="Submit"> </p>`
		254	`</form>`
		255	`<div id="footer">`
		256	`<hr>`
		257	`<p> CKEditor - The text editor for the Internet -`
		258	`<a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>`
		259	`</p>`
		260	`<p id="copy"> Copyright © 2003-2014,`
		261	`<a class="samples" href="http://cksource.com/">CKSource</a> - Frederico Knabben. All rights reserved. </p>`
		262	`</div>`
		263	`</body>`
		264
		265	`</html>`

Subversion-Projekte lars-tiefland.ci

(root)/htdocs/backend/assets/global/plugins/ckeditor/samples/xhtmlstyle.html – Revision 776