Text

Body

To add text content to your page, in the components tab you will first select “Add Text” toward the bottom of the page.

Below you will find information about the fields available for this component.

Screenshot of backend text component in Drupal

Text Formatting: you can see the available formatting icons along the top of the editor. They include:

  • Heading style
  • Bold
  • Italic
  • Strikethrough
  • Superscript
  • Subscript
  • Link
  • Unlink
  • Anchor link
  • Bulleted list
  • Numbered list
  • Alignment
  • Table
  • Block quote
  • Add PDF
  • Insert Abbreviation
  • Remove formatting

You may also select “Source” to access the html and use the following html tags:

List of html tags

Once saved, your text component will look like this:

Screenshot of text component live

Adding Linked Files

Generally, you should avoid presenting content as linked files as these are difficult to make accessible and can also interrupt the reading experience in mobile and other browsing modes. When possible, add content to the website as Text and Image content as you see on this page. That said, there are some contexts where a PDF file is unavoidable, such as for a form that must be printed out with particular alignment and spacing. In these cases, PDF files can be added to the site. For maximum compatibility, only PDF files can be uploaded.

Note also that all files uploaded to the site are world-readable and cannot be made private or password protected. If you need to share files with particular cohorts you can share them with appropriate access restrictions via OneDrive, GoogleDrive, or MiddFiles and link to the file from the website.

Before you begin, you must upload the PDF to the Drupal system by following these steps:

1. Open the Content manager. 

Uploaded Image (Thumbnail)

2. Choose Media and then Add Media

Uploaded Image (Thumbnail)

3. Choose Document

Uploaded Image (Thumbnail)

4. Name your document and select Choose File to upload your PDF and hit Save.

Uploaded Image (Thumbnail)

5. You will now see the document in the system and you can click on the document name.

Uploaded Image (Thumbnail)

6. To retrieve the URL you will nee for the link, click on the document...

Uploaded Image (Thumbnail)

7. And then copy the URL. That is your link to the PDF.

Uploaded Image (Thumbnail)

 

Adding an "anchor" link

Creating the anchor link is a two step process. First you create the anchor (where you want to send someone). Then you link to the new anchor (the link the user clicks to be taken to your anchor).

Creating the Anchor Link

In Drupal, the "Text" component has a WYSIWYG editor that allows you to bold text, add links, etc. One of these option, represented by the little flag icon in the edit bar, is the anchor link.


Uploaded Image (Thumbnail)
Highlight the text you wish to make an anchor link and then click the little flag icon. It will ask you to give your anchor link a name. Enter an appropriate name. Make sure you copy it (or remember it as you will need it in the next step). 

Uploaded Image (Thumbnail)

Click the green check mark to save your anchor. That's it! Your anchor is set up.

Linking to the Anchor Link

Now highlight the text that you wish to act as a link to the anchor. Clicking on this link will jump the user down to wherever you set up the anchor. After you highlight your desired text, click the link icon (just like you would do to add a normal link), and search for the name of your anchor link. This will search for all links on the site, so it is best to make your anchor link name distinct. If you are having issues finding it - you can always type the name and hit save, or rename your anchor link to something more specific. 

Uploaded Image (Thumbnail)

And that's it. You've created your anchor link.

Details

Details

Article ID: 243
Created
Thu 2/17/22 1:24 PM
Modified
Tue 6/24/25 2:31 PM