Working in the Source view

You can use the Source view in Rich Page Editor to edit HTML and other markup text, such as embedded JavaScript. Any changes you make in the source view are also reflected in the Design and Split views.

About this task

You can also show the Source view by opening the Split view. The Split view shows both the Design and Source views, split vertically or horizontally. If you add or update an attribute value in the Source view while the Properties view is visible, the properties are also refreshed.

Table 1. Source view features
Feature Description
Syntax highlighting Each tag type uses different highlighting to make it easy to find a specific type of tag for editing. For example, you cannot edit read-only regions of the page which are highlighted in gray.
Unlimited undo and redo You can incrementally undo and redo every change made to a file for the entire editing session. For text, changes are incremented one character or set of selected characters at a time.
Content assist Content assist helps you to finish tags or lines of code, and insert macros. The available options in the content assist list are based on the tags that are defined by the tagging standard specified for the file being edited. If content assist does not automatically open, press Ctrl + Space. The content assist text is displayed in a yellow box as you type.
User-defined macros You can access user-defined templates, which are chunks of predefined code, with content assist to help you add the tagging combinations that are used often.
Element selection The element selection indicator is located within the border of the Source view. Based on the location of your cursor, the element selection indicator highlights the line numbers that contain the elements being edited.
Pop-up menu options You can right-click at a specific position in the editor to open the editor pop-up menu. This menu contains many of the same editing options that are available in the workbench Edit menu.
Drag-and-drop You can drag objects from the Palette view to the position of the cursor in the Source view.
Copy and paste You can press Ctrl + C and Ctrl + V to copy and paste a selected tag in the Source view.
Validation You can configure an option on the preferences page to validate your code as you type:
  1. From the main menu, select Window > Preferences > General > Editors > Structured Text Editor.
  2. On the Structured Text Editor preferences page, select Report problems as you type.
Customization You can customize the appearance of the editor on either of the following preferences pages:
  • Window > Preferences > General > Editors > Editors (or Structured Text Editors)
  • Window > Preferences > Web > HTML Files > Editor

The HTML 5 specification is supported only in the Source view. For example, you can use content assist to insert the <canvas> tag.

You can use any of the following methods to enter, insert, or delete tags and text in the Source view:
  • Type the tags directly.
  • Use content assist to receive prompts for valid tags.
  • Select the menu items.
  • Select the toolbar buttons.
  • Use the Properties view to change tags.

Procedure

To edit an HTML file in the Source view:

  1. Open the HTML file that you want to work with in the editor.
  2. In the Source tab, use the available features to edit the code, as required.
    Tip: You can select attribute values, attribute-value pairs, and entire tag sets by using the double-click feature available in the editor. Use this feature to quickly update, copy, or remove content.
  3. At intervals, to see the nesting hierarchies more clearly in the file, format individual elements or the entire document to restore element and attribute indentation. Right-click the editor window and select Source > Format.
  4. Save the file.
Icon that indicates the type of topic Task topic
Timestamp icon Last updated: July 17, 2017 21:58

File name: trpesourceviewwl.html