The quick brown fox jumped over the lazy dog.

 

The quick brown fox jumped over the lazy dog.

When adding and editing content through the Joomla editor, you have access to tools much like a word processor. The Joomla editor toolbar sets at the top of the page while in editor view. Take a moment to get familiar with the editor toolbar by using your curser to hover over each tool. Hovering over a tool provides descriptive text on what action each tool will perform.

full joomla editor toolbar

Adding text

There are two common ways for adding text on a page. You can either type the text into a textbox or copy it from an external document and paste into the Joomla editor. While copying and pasting text may save time, keep in mind that you may also copy over unwanted formatting from the source material that you don't need on your page.

 

Copy/Paste text

  1. Open your document in Microsoft Word, Google Docs, etc.
  2. Select the text you need and copy by using your keyboard shortcut for copying.
  3. Paste the text into the Joomla editor using the paste as plain text button graphic Paste as Plain Text button.

Remove unwanted formatting

  1. Once you have successfully pasted the text into the Joomla editor, highlight with your cursor everything that you just pasted.
  2. Click the a graphic for the remove formatting button depicting an eraser Remove Formatting button to remove any leftover formatting from Word. This will automatically revert your text into the consistent site font and remove any unwanted formatting that may have copied over.

Styling text

Now that you have the text that you want on your page, there are a few styling options that you can use to style text. For example, you can bold or italic text, make header text, or create ordered or unordered lists. Below are instructions on how to perform basic text styling tasks in Joomla.

Bold and Italic

This is a paragraph with some text. Let's identify how to make bold text and let's also identify how to give text emphasis with italics. Use the editor toolbar to apply the following styles:

  • Bold text: select the word(s) you would like to bolden and click the a graphic of the button to bold text bold button
  • Italic text: select the word(s) you would like to give emphasis and click the a graphic of the button to italicize text italic button

Headings

Headings are used to categorize the related content below them. Think of headings like you would when writing a report. The largest heading is used at the top of the page. Sub headings are used in descending order by hierarchy. Just like you would never skip headings in a report, you would never skip headings on your webpage. Organize your content on a page by using the appropriate headings. Headers should never be used as a design element or promotion. Use the editor toolbar to apply the following styles:

  • Select the text you would like to make into a heading
  • Click the Format dropdown menu, and select Heading 2, Heading 3, Heading 4, Heading 5, or Heading 6
  • Heading 1 is not available as an option as it is reserved for the page title

Header options within Joomla editor

a graphic displaying the different heading options available on joomla

Header visual (how it will appear) on your page

Here is a heading 2 (h2)

Here is a heading 3 (h3)

Here is a heading 4 (h4)

Here is a heading 5 (h5)
Here is a heading 6 (h6)

Lists

Lists are used to style content that you may be listing on your page. Below are three commonly used list types.

  1. Most lists
  2. can be created
  3. as "unordered" lists
  4. with simple bullet points
  1. You may choose
  2. to create an ordered list
  3. with numbers built-in
  4. automatically
  1. You can also create
  2. a list alphabetically
  3. using lower or
  4. upper case letters!

Follow these steps in order to create a list in Joomla like in the examples shown above:

  1. Select the text you would like to be the first bullet point.
  2. Click either the a graphic showing the button to select and numbered list ordered list button or a graphic showing the button to select and bulleted list unordered list button to create your first list item.
  3. Proceed creating additional list items just as you would in Word.
  4. Press enter on your keyboard twice when you are done creating your list to close the list and reset the text to a normal line.
  • one
  • two
  • three
    • four
    • five
    • six

Important

  1. Joomla has no auto save functionality.
  2. If there is no activity after 10-15 minutes,
  3. Joomla may log you out. If this happens, any unsaved work will be lost. In order to prevent losing edits, be sure to click a graphic of a button that says save and close with a checkmark Save & Close to retain your page additions. Always remember to save your changes before leaving for the day, heading out for lunch, attending a meeting, or if you get distracted by people or other tasks.

Please refer to the UAH Web Style Guide for further details about adding, styling, and formatting text.