Kupu Button Index

by Olha Pelishok last modified Dec 30, 2008 03:06 PM
Description of the toolbars and icons in Kupu 1.4.x

A typical Kupu toolbar looks like this:

toolbar

 

The following table describes the function and output of each button.

Icon Function Description Example Example resultant HTML code
save save
Saves changes

bold bold Bolds selected text text <strong>text</strong>
italicize italicize Italicizes selected text text <em>text</em>
subscript subscript Transforms selected text to subscript textscript text<sub>script</sub>
superscript superscript Transforms selected text to superscript textscript text<sup>script</sup>
text-color text color Colors selected text

background-color background color Color background of the selected text

left left justify Aligns the selected text to the left text <p align="left">text
<br /></p>
center center justify Aligns the selected text to the center of the screen. text <p align="center">text
<br /></p>
right right justify Aligns the selected text to the right text <p align="right">text
<br /></p>
numberedlist numbered list Creates a numbered list
  1. line1
  2. line2
  3. line3
<ol><li>line1</li>
<li>line2</li>
<li>line3</li></ol>
butteledlist bulleted list Creates a bulleted list
  • line1
  • line2
  • line3
<ul><li>line1</li>
<li>line2</li>
<li>line3</li></ul>
list passage list passage Creates a definition list
line1
line2
line3
line4
<dl>
<dt>line1</dt>
<dd>line2</dd>
<dt>line3 </dt>
<dd>line4 <br />
</dd></dl>
outdent decrease quote level Moves an indented section of text one tab to the left text
indent increase quote level Indents the selected text by one tab text <blockquote>text<br /></blockquote>
insert image insert image Inserts an image into your document

internal-link insert internal link Creates a link to another object within Plone site text <a title="filename" href="front-page">
text</a>
external link insert external link Changes a link to an external site text <a href="http://...../">
text</a>
insert anchors insert anchors Creates an anchor point for linking between sections of a single page

beginning

text text text text text
to the top
<h3 class="Subheading">
<a name="beginning">
</a>beginning</h3>
text text text text text
<a href="#beginning">
to the top</a>
insert table insert table Inserts a table
first
second
third
fourth fifth sixth

<table class="plain">
<tbody><tr>
<td>first<br /></td>
<td>second<br /></td>
<td>third </td></tr>
<tr>
<td> fourth</td>
<td>fifth</td>
<td>sixth </td></tr>
</tbody>
</table>
undo undo Undo the last edit

redo redo Redo the last undo action

html switch between visual editor and HTML view


text heading text heading Chooses headings

text heading-all text headings Normal text <p>text</p>
Heading

text

<h2 class="Heading">text</h2>
Subheading

text

<h3 class="Subheading">text</h3>
Literal
text
<pre>text</pre>text
Discreet text <p class="discreet">text</p>
Pull-quote
text
<div class="pullquote">text</div>
Call-out

text

<p class="callout">text</p>
Page break (print only)
<div class="pageBreak">text</div>
Clear floats (remove style)
<div class="visualClear">text</div>
Highlight
text <span class="visualHighlight">text</span>
zoom zoom Zooms the editing window to fill the page

remove link remove link Removes an existing link

remove-image remove image Removes an existing image

In case you Kupu toolbar does not include the necessary icons, follow the next part  of this tutorial to learn how to Customize Kupu Toolbar.