See Also

Fonts
Selection
Styles
Templates
Toolbar

Enumerations

Name Values
HorizontalRuleStyles Solid
Dotted
Dashed
Views WYSIWYG
Code
Languages EN
EN
CKB
DA
DE
ES
FR
HE
IT
JA
KO
LV
NL
PL
PT
RO
RU
SE
UA
ZH

Constants

Name Type Value

This class exposes no constants.

Events

Definition Parameters Return Type Description
Changed None None Raised when the content has been changed by the user.
CustomButtonPressed button as GraffitiEditorToolbarButton None Raised when a GraffitiEditorToolbarButton that has been added to the toolbar is pressed.
CustomMenuSelected menu as GraffitiEditorToolbarMenu None Raised when the user selects an item from a GraffitiEditorToolbarMenu that has been added to the toolbar.
value as String
Ready None None Raised when the component is fully displayed and ready.
SaveButtonPressed None None Raised when the user clicks the Save button, if the Save button is currently on the toolbar.
ViewChanged None None Raised when the user switches between the WYSIWYG and Code views.

Methods

Definition Parameters Return Type Description
Append html as String None Appends the provided HTML to the content of the editor.
Insert html as String None Inserts the provided HTML as the current selection point of the editor.
InsertAudio url as String None Inserts an AUDIO element at the current selection point of the editor.
InsertHorizontalRule style as HorizontalRuleStyles None Inserts an HR element at the current selection point of the editor.
InsertImage f as FolderItem None Inserts the specified image at the current selection point of the editor.
InsertImage url as String None Inserts the specified image at the current selection point of the editor. Provide -1 for width and/or height to automatically size.
altText as String = “”
width as Integer = -1
height as Integer = -1
InsertLink url as String None Inserts a link at the current selection point of the editor.
text as String
newWindow as Boolean = True
relationship as String = “”
InsertTable rows as Integer = 2 None Inserts a table at the current selection point of the editor.
columns as Integer = 2
hasHeader as Boolean = False
InsertVideo url as String None Inserts a VIDEO element at the current selection point of the editor. Attempts to automatically parse YouTube and Vimeo links.
ToPage PageTitle as String None Creates a valid HTML page complete with headers using the current content of the editor.
includeStyleBlock as Boolean = False
additionalCSS as String = “”
ZoomReset None None Resets the Zoom level to 100%.
ZoomText percent as Integer None Zooms the editor portion of the component by a percentage value.
ZoomTextIn None None Zooms the editor portion of the component by 10%.
ZoomTextOut None None Zooms the editor portion of the component by -10%.

Properties

Name Type Default Value Description
Alert ReadOnly GraffitiEditorAlert Generated Access to Alert functionality.
Enabled Boolean True Determines whether the user can interact with the component's toolbar or change its contents.
Fonts ReadOnly GraffitiEditorFonts Generated Access to font management functionality.
History ReadOnly GraffitiEditorHistory Generated Access to editor history functionality.
HTML String “” Current value of the editor.
Locale Languages Languages.EN Language used to display the toolbar tooltips.
Padding Integer 16 Pixel size of the editor's padding.
ReadOnly Boolean False Determines whether the user can interact with the component's toolbar or change its contents without significantly altering its appearance.
RTL Boolean False Right-to-left display.
Selection ReadOnly GraffitiEditorSelection Generated Access to Selection functionality.
SpellCheck Boolean True When True, spell checking will be enabled on the component.
SpellCheckLanguage String “en-US” Locale to use for checking spelling.
State ReadOnly GraffitiEditorState Generated Access to state functionality.
Styles ReadOnly GraffitiEditorStyles Generated Access to custom Styles functionality.
Templates ReadOnly GraffitiEditorTemplates Generated Access to Templates functionality.
Toolbar ReadOnly GraffitiEditorToolbar Generated Access to Toolbar functionality.
View Views Views.WYSIWYG Current editor view.

Examples

Setting Font Defaults

Font settings are stored in the GraffitiEditorFonts class that is accessible in the Fonts property of the GraffitiEditor instance. Changes to these settings can be made at any time, but it is recommended that you do so in the Opening event.

me.Fonts.DefaultFace = "Verdana"
me.Fonts.DefaultSize = 23
me.Fonts.DefaultLineHeight = 1.25

Notes

Custom Toolbar Buttons

For many plugins to function, they must have a corresponding Toolbar button. For example, if you wish to create your own implementation for inserting links but retain the edit dialog that is displayed when a user clicks a link, you will need to have the built-in link button on the toolbar, but hide it using CSS in the CustomCSS property:

button[data-command="link"] {
  display: none;
}

Data Command Values

  • blockquote
  • image
  • link
  • video
  • audio
  • align
  • font
  • fontColor
  • fontSize
  • formatBlock
  • hiliteColor
  • horizontalRule
  • lineHeight
  • list
  • paragraphStyle
  • table
  • template
  • textStyle