Customizing Editable Region Buttons
Editable Region Buttons Overview
An editable region button is used to provide a user-friendly label for an editable region within a page. Any number of editable regions can be created on a page. A few of the frequently used page divisions that are made editable:
- Top navigation
- Main content region
- Left navigation
- Right navigation (also called the sidenav or local navigation)
The system by default includes editable region buttons that are pre-styled. For example:
The editable regions themselves are created within an <ouc:div> and usually the <ouc:editor> tag is used to include editing capability with the WYSIWYG Editor. Several attributes are available for these tags that can be used to customize the editing experience for the end user:
Prior to OU Campus 9.15.10, the button attribute was used to specify GIF buttons for editable regions. For example: button="707" provided a generic edit button.
After the release of version 10, the use of GIFs was deprecated, but in order to support existing implementations and button styling, the button attribute is still supported. The equivalent buttons are rendered using CSS. For example, if the button="707" is used with v10, the following edit button is provided:
Also, if the button attribute is inadvertently omitted without providing another method of styling buttons, the 707 button is used by default.
The following screenshot shows several examples of editable region buttons, which make the various regions of the page independently editable.