Source Code
Only level 9 and 10 users can edit source code, by default. Level 10 users can grant access to level 1 through 8 users and restrict access to level 9s via user settings.
There are three ways to edit the source code of a page from Content > Pages, as follows:
- Click to open your page, click Source in the page actions toolbar.
- Check out your page, click More Actions
, click Edit > Properties.
- Click to open your page, scroll to the page footer, click Edit Source.
Toolbar and ShortcutsLink to this section
The source editor has its own toolbar, different from the What You See Is What You Get (WYSIWYG) toolbar.
- 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 a copy.
- Undo/Redo
- Find/Replace: Search the source code content, and/or replace what you're searching for. This field accepts regular expression (regex).
- Go To Line: Enter a line number in the text field, click Go, and the cursor is taken to that line.
- Line Wrap: Enable or disable text wrapping.
- Insert File Path: Insert a path to another page.
- Insert Asset: Insert a path to an asset.
- Syntax: Select the syntax formatting and highlighting based on the code type. The available languages are: None, HTML, XML, CSS, JavaScript, PHP, Python, VBScript, Perl, SQL, and C#.
- Theme: Select a theme that changes the colors of the text and background.
- Increase/Decrease Font Size
Use the following shortcuts in the source code editor:
- Ctrl (Windows)/Cmd (Mac) + S: Save the text onto the staging server but remain in the editor and make further changes.
- Ctrl/Cmd + A: Select all text in the editor.
- Ctrl/Cmd + D: Delete the entire line of text 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: Bring up the Find and Replace tool.
- Ctrl/Cmd + /: Comment out the currently-selected line(s) of text. This function is syntax-specific; the format of the comment depends on the language selected in the "Syntax" dropdown menu.
- Shift + Tab: Auto-indent all selected text according to the nesting of elements.
- Ctrl/Cmd + [: Indent all selected text by one tab less.
- Ctrl/Cmd + ]: Indent all selected text by one tab more.
- Ctrl + Q: Fold the element on the current line, hiding child elements and other content, making the code easier to read.
Other FeaturesLink to this section
The source editor provides auto-complete suggestions as you type, depending on the syntax you select:
- JavaScript: JS-related methods/syntax
- HTML: HTML nodes/attributes
- XML (PCF, TCF, TMPL, and XSL): Proprietary OU nodes/attributes such as
<ouc:div>
and<ouc:editor>
, HTML nodes/attributes, and common XSL nodes/attributes. - CSS: CSS properties/pseudo classes
You can drag from the Images and Youtube Gadgets into source code as you would in the WYSIWYG editor. Adding an image or video via these gadgets inserts a simple <img>
or <iframe>
tag. Then you manually add description, alignment, or dimensions.