By default, only level 9 and 10 users can edit source code, but access can be granted to level 1 through 8 users, and level 9s can have their access restricted. These settings are configured via user settings.
The source code of a page can be accessed via several ways:
- By clicking the Source button in the page actions toolbar.
- By hovering over a page in Content > Pages and selecting "Source" from the Edit menu.
- By checking out a page and clicking the blue "Edit Source" button at the bottom of the page.
Toolbar and ShortcutsLink to this section
The source editor has its own toolbar, which is different from the WYSIWYG toolbars.
- Save: Save your changes and exit the source editor. To save without exiting the editor, use Ctrl+S (PC) or Cmd+S (Mac).
- Save As: Save your changes on a copy of the original file.
- Find and Replace: Search the source code content, and/or replace what you're searching for. This field accepts regex.
- Go To Line: Enter a line number in the text field and the cursor is taken to that line.
- Line Wrap: This button enables or disables wrap-around text; if disabled, lines of code longer than the width of the window need to be scrolled horizontally to read to the end.
- Insert File Path: Click this to insert a path to another page into the source code.
- Insert Asset: Click this to insert a path to an asset into the source code.
- Theme: Select a theme that changes the colors of the text and background.
- Increase/Decrease Font Size
The following shortcuts are available for use in the source code editor:
- Ctrl (Windows)/Cmd (Mac) + S: Save-in-Place. Saves the content onto the staging server, but allows you to remain in the editor and make further changes.
- Ctrl/Cmd + A: Select All. Selects all content in the Source Editor.
- Ctrl/Cmd + D: Deletes the entire line of code on which the cursor is currently placed.
- Ctrl/Cmd + Z: Undo the last change.
- Ctrl/Cmd + Y: Redo the last undone change.
- Ctrl/Cmd + F: Brings up the Find and Replace tool for the Source Editor.
- Ctrl/Cmd + /: Comments out the currently-selected line(s) of code. This function is syntax-specific; the format of the comment depends on the language selected in the Syntax drop-down menu.
- Shift + Tab: Auto-indent. Takes all selected text and indents it according to the nesting of elements.
- Ctrl/Cmd + [: Indents all selected code by one tab less.
- Ctrl/Cmd + ]: Indents all selected code by one tab more.
- Ctrl + Q: Folds the element on the current line, hiding child elements and other content, making the code easier to read.
Other FeaturesLink to this section
Source Editor provides auto-complete suggestions as you type. The suggestions provided vary depending on the option selected in the Syntax drop-down menu. The following syntax options trigger auto-complete functionality:
- HTML: HTML nodes/attributes
- XML (PCF, TCF, TMPL and XSL): Proprietary OU nodes/attributes such as
<ouc:editor>, HTML nodes/attributes, and common XSL nodes/attributes.
- CSS: CSS properties/pseudo classes
You can drag-and-drop content from the Images and Youtube Gadgets into source code as you would in the WYSIWYG editor. When you add an image or video via these gadgets, only a simple
<iframe> tag is inserted. Any other information, such as description, alignment, or dimensions, must be added manually.