Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 12 Next »

Working with the Editor

The body typically contains the main content that appears on a webpage. It has many of the standard editing capabilities that you would find in Google Docs or Microsoft Word.

image-20240710-211017.pngeditor.png

2.1) Undo | Redo

Allows you to undo or redo any edit you make to the body copy block.

2.2) Remove Formating

Whenever you copy and paste text into Drupal from another source (Google Docs, Microsoft Word, or PDFs), the pasted text will usually inherit the font styling of the original source file (font type, color, size, etc). This font styling will likely be different from the font styling used on Swarthmore webpages. The Remove Formatting function will make your text look consistent with the rest of the website. Simply highlight the text you wish correct using your cursor and then click the Remove Formatting button.

Please note: All the text that appears on the website should use the standard default font style found on the main Swarthmore website. To ensure consistency, always use Remove Formatting when you copy and paste content into the Drupal CMS.

2.3) Bold / Italics / Bullet List / Ordered List

Allows you to add bold and italics content as well as bullet and ordered lists.

2.4) Headings

Allows you to add headings to your content. All webpages follow a convention of ranking of headings from H1 to H6. The Page Title (the most important element) is the H1. If you include heading/subheadings in the page content, you would start with H2 and then use H3-H6 for additional sub-headings.

Please note: Whenever using headings, you must follow the proper heading sort order. This is essential for both accessibility purposes and to maintain consistency.

H1: The title of the page

H2: First point

H3: Subsection of first point

H3: Subsection of first point

H3: Subsection of first point

H2: Second point

H3: Subsection of second point

H4: Subsection of H3

H4: Subsection of H3

H3: Subsection of second point

H2: Third point

2.5) Styles

The styles drop down menu allows you apply custom font styles to your content. This is useful if you wish to include lead paragraphs (slightly larger font size for the intro paragraph) or pull quotes (a quote pulled from the content) to your body content.

2.6) Horizontal Rule

Allows you to add a horizontal rule to your content.

2.7) Anchors

Anchor are internal links within the body content of a page that allow you link to that section of the page. Anchors are typically placed at the beginning of the section heading or paragraph that you want to jump to. The only requirement is to add a name for the anchor - the name should be one word and contain no spaces. Examples of good anchor names are:

  • CreatingAnchors

  • admissionsRequirements

  • required-documents

You will know you've successfully created an anchor when you see a red flag appear in the Copy Editor. This red flag will not be visible to the public and is intended to help remind you of its presence while editing.  If you need to edit the anchor name, you can click on that flag and the Anchor dialog will reopen.

Adding links to other webpages or other content is one of the most common tasks you’ll be doing when creating webpages.

Insert Screen grabs for creating links

2.9) Special Characters

This function allows you to add special characters (a,e,i,o,u with accents and other marks). This is most common for foreign words and names that might appear on the site

2.10) Find & Replace

Allows you to do a standard find and replace in the body content block.

2.11) Tables

Use this function to add table content to your webpage.

When creating a table you must select Headers and a Caption. Both of these fields are critically important - they not only make tables more understandable and readable, they also help persons with disabilities understand what the table is about.

2.12) Add Image

2.13) Upload Image

2.14) HTML Source

Clicking the HTML Source button will display the underlying HTML responsible for rendering the text formatting, links, images, and other elements that appear on the page. Editors who are comfortable working with HTML may find this functionality useful for troubleshooting, however it is not necessary for the general editing of content.

2.15) Full Screen

The Full Screen button will maximize the Copy Editor to take up the full browser window. This can be useful when working with a large amount of content or as a means of cutting down on distraction during the writing process.

Click the button a second time in order to minimize the Copy Editor, returning it to its original size.

  • No labels