Paragraph dropdown Customization
The Paragraph Dropdown of CuteEditor by default displays a predefined set of format blocks. You can easily modify this default
set using the following methods:
1. Edit Dropdown Configuration File (Common.config).
The dropdown configuration file (Common.config) can be found in the
/CuteEditor/Configuration/Shared folder. In dropdown configuration file you can
find the FormatBlock element which contains the configuration information
for the Paragraph dropdown within CuteEditor. By default, it contains
the following format blocks:
You can modify the FormatBlock element to create your own format block list.
Example:
- <FormatBlock>
- <item text="[[DIV]]" value="<DIV>">
- <html><![CDATA[[[DIV]]]]></html>
- </item>
- <item text="[[Normal]]" value="<P>">
- <html><![CDATA[[[Normal]]]]></html>
- </item>
- <item text="[[Heading 1]]" value="<H1>">
- <html><![CDATA[<b style='font-size:24pt'>[[Heading 1]]</b>]]></html>
- </item>
- <item text="[[Heading 2]]" value="<H2>">
- <html><![CDATA[<b style='font-size:18pt'>[[Heading 2]]</b>]]></html>
- </item>
- <item text="[[Heading 3]]" value="<H3>">
- <html><![CDATA[<b style='font-size:15pt'>[[Heading 3]]</b>]]></html>
- </item>
- <item text="[[Heading 4]]" value="<H4>">
- <html><![CDATA[<b style='font-size:12pt'>[[Heading 4]]</b>]]></html>
- </item>
- <item text="[[Heading 5]]" value="<H5>">
- <html><![CDATA[<b style='font-size:9pt'>[[Heading 5]]</b>]]></html>
- </item>
- <item text="[[Heading 6]]" value="<H6>">
- <html><![CDATA[<b style='font-size:7pt'>[[Heading 6]]</b>]]></html>
- </item>
- <item text="[[Address]]" value="<Address>">
- <html><![CDATA[[[Address]]]]></html>
- </item>
- <item text="[[MenuList]]" value="<MENU>">
- <html><![CDATA[[[MenuList]]]]></html>
- </item>
- <item text="[[Formatted]]" value="<PRE>">
- <html><![CDATA[[[Formatted]]]]></html>
- </item>
- <item text="[[Definition Term]]" value="<DT>">
- <html><![CDATA[[[Definition Term]]]]></html>
- </item>
- </FormatBlock>
Now the Paragraph dropdown contains only Heading 1, Heading 5 and Normal.
2. Programmatically populate the Paragraph dropdown:
C# Example:
- if (!IsPostBack) {
- CuteEditor.ToolControl toolctrl=Editor1.ToolControls["FormatBlock"];
- if(toolctrl!=null) {
- CuteEditor.RichDropDownList dropdown=(CuteEditor.RichDropDownList)toolctrl.Control;
- //the first item is the caption
- CuteEditor.RichListItem richitem=dropdown.Items[0];
- //clear the items from configuration files
- dropdown.Items.Clear();
- //add the caption
- dropdown.Items.Add(richitem);
- //add text and value
- dropdown.Items.Add("Normal","<p>");
- //add text and value
- dropdown.Items.Add("Heading 1","<h1>");
- //add html and text and value
- dropdown.Items.Add("<b style= 'font-size:9pt'>[[Heading 5]]</b>","Heading5","<h5>");
- }
- }
VB Example:
- If Not Page.IsPostBack Then
- If Not Editor1.ToolControls("FormatBlock") Is Nothing Then
- Dim dropdown As CuteEditor.RichDropDownList
- Dim richitem As CuteEditor.RichListItem
- dropdown = DirectCast(Editor1.ToolControls("FormatBlock").Control, CuteEditor.RichDropDownList)
- 'the first item is the caption
- richitem = dropdown.Items(0)
- 'clear the items from configuration files
- dropdown.Items.Clear()
- 'add the caption
- dropdown.Items.Add(richitem)
- 'add text and value
- dropdown.Items.Add("Normal","<p>")
- 'add value and value
- dropdown.Items.Add("Heading 1","<h1>")
- 'Add html and text and value
- dropdown.Items.Add("<b style='font-size:9pt'>[[Heading 5]]</b>", "Heading 5", "<h5>")
- End If
- End If