Skip to main content

An official website of the State of Maryland.

Official websites use .gov
A .gov website belongs to an official government organization in the United States.

Secure .gov websites use HTTPS
A lock ( ) or https:// means you’ve safely connected to the .gov website. Share sensitive information only on official, secure websites.

On this page

How to use the Text Editor

The Text Editor displays headings, paragraph text, basic links, images, and tables. 

The Text Editor has features similar to those found in applications like Microsoft Word or Google Documents. It is sometimes referred to as a “What You See is What You Get” or WYSIWYG editor. This means that the way a text section looks when editing the page is how it will look once it is published.

The Text Editor is found in the Body field of the Basic Page or as a component you can add to a Landing Page.

The Text Editor has the following options, shown from left to right in the screenshot above.

1. Text style

Text style includes bold and italics. Use these options only for Paragraph heading style.

2. Bookmark

Bookmarks create jump links, that when clicked, take users further down the page. To create a bookmark:

  • Highlight the heading or paragraph text you want to link to.

  • Name the bookmark. Do not use spaces.

  • Create a link using the Link button.

  • Select the bookmark from the bookmarks menu.

Note: To use a Bookmark, the page must use the Table of Contents on a Basic Page.

3. Link

The Link option creates a basic text link. Links can go to pages on your website, or to external websites. If a link goes to an external website, it will include an icon indicating that the link goes to an external website.

4. Bulleted and numbered lists

Use to add bulleted and numbered lists to your website.

5. Block Quote

Use the Block Quote to create a uniquely styled section of text that displays a quote from a person.

6. Table

Tables can include a header row or header column.

  • Only use tables for numerical data or for information with a defined structure, such as a directory.
  • Do not use a table for long-form content. Table content must be brief and scannable.
  • Limit the number of table columns. It’s easier for users to read down a long list of rows than it is to read across a wide list of columns.
    • Note: When a table is too wide to fit within the width of the user’s screen, the user will need to scroll to the right to see all the table columns.
  • Use the optional Caption to describe the table or to provide an attribution for the data.

7. Special character

Use to include special characters like the copyright symbol and non-English characters.

8. Heading style

Text must be given a Heading style. Options include:

  • Heading 2
  • Heading 3
  • Heading 4
  • Heading 5
  • Heading 6
  • Paragraph

Headings define the structure of information on the page. Think of a webpage like a book.

  • Use Heading 2 for each of the page’s chapters. A page can have more than one Heading 2.
  • Use Heading 3 for major sections within a chapter (within each Heading 2).
  • Use Heading 4, Heading 5, and Heading 6 for subsections within a major section (within each Heading 3).
  • Use the Paragraph heading style for basic text.
  • Tip: Always use headings in ascending  order. For instance, a page cannot have a Heading 3 without an associated Heading 2.

9. Media Library

Use the Media Library to add a photo, video or document. 

  • Media can be uploaded directly when using the Text Editor.
  • Or you can select a photo, video or document that has already been added to your Media Library. 

After you have inserted the image, you can change its alignment. Images can be aligned left or right, with text wrapping around the image. Alternatively, an image can be centered, placed between sections of text.

Learn more about images, videos and documents

10. Component Library

The Component Library allows you to add other Page Components to a Basic Page.

11. Undo/Redo

Undo and redo allow you to easily edit the page.

Text Editor Examples

Example Heading 2

This is a section of Paragraph text with some text formatted in Bold and some text formatted in Italics…Lorem ipsum dolor sit amet, consectetur adipiscing elit magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

This is a stand alone link.

Duis aute irure dolor. This is an inline link. In reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum

  • This is a Bulleted List
  • Consectetur adipiscing elit
  • Eiusmod tempor incididunt
    • Ut labore et dolore magna aliqua
    • Ut enim ad minim veniam
    • Quis nostrud exercitation
  • Laboris nisi ut aliquip ex ea commodo
  1. This is a Numbered List
  2. Consectetur adipiscing elit
  3. Eiusmod tempor incididunt
    1. Ut labore et dolore magna aliqua
    2. Ut enim ad minim veniam
    3. Quis nostrud exercitation
  4. Laboris nisi ut aliquip ex ea commodo

Example Heading 3

This is a section of Paragraph text … Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum

Example Heading 4

This is a section of Paragraph text … Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Example Heading 5

This is a section of Paragraph text … Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Example Heading 6

This is a section of Paragraph text … Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

This is an example Block Quote…lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Example Heading 2 with tables

This is a section of Paragraph text … Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Example table with a header row

Column 1 Heading

Column 2 Heading

Column 3 Heading

123

456

789

321

654

987

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 

Example table with header columns

Row 1 Heading

123

321

Row 2 Heading

456

654

Row 3 Heading

789

987

Example Heading 2 with images

This is a section of Paragraph text … Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

This is a section of Paragraph text … Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 

This is a section of Paragraph text … Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 

This is a section of Paragraph text … Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit 

This is a section of Paragraph text … Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 

This is a section of Paragraph text … Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

 

Get support

Ask questions about the Maryland Drupal CMS, Maryland Web Design System (MDWDS), accessibility, plain language, and more.

Get support