Using the WordPress editor

Overview
Anatomy of the WordPress editor
Adding and editing content
Adding and editing the menu
Adding a banner or featured image
Saving, previewing, and publishing an unpublished page or draft
Revising a published page
Viewing or reverting to an earlier version
Avoiding sync issues

Overview

In this guide, we review how to use the WordPress editor, also known as the block editor, to edit Dornsife website pages that use the Default or Content Detail template.

The screenshot above compares the WordPress editor (left side) to the slightly different ACF editor (right side) used for pages that use a template other than Default or Content Detail. If your editor looks like the ACF editor, refer instead to the following guide:

Using the ACF editor in WordPress

Anatomy of the WordPress editor

When you create a new page or edit a page that uses the Default or Content Detail template, the page opens in the WordPress editor. The editor view is highly customizable.

The above screenshot of the WordPress editor shows four labeled areas:

Top toolbar

In the upper left, you can click the logo to return to the dashboard, access the block inserter, and use the undo and redo buttons.

In the upper right, you can save and preview your page, and access the Settings sidebar and more options.

To show the WordPress admin menu while you use the editor, click the Options icon in the top toolbar. Then, unselect Fullscreen mode.

Block inserter

Use this tool to add components (content blocks) to the page.

To show: Click the + icon in the top toolbar
To hide: Click the x icon in the top toolbar

Content area

This is your main editing area. When you add components (content blocks), they will appear in this area. Then, in the component you can add content such as text, images, and other media.

Settings sidebar

To show: Click the Settings icon in the top toolbar
To hide: Click the Settings icon again

Adding and editing content

Create a new page or open an existing page in the WordPress editor

Quick guide

In the left menu, click Pages.
The Pages Admin Screen appears.
To edit an existing page, click the page title. To create a new page, click Add New Page.

Detailed guide (with screenshots)

In the left menu, click Pages.
The Pages Admin Screen appears.
To edit an existing page, click the page title. To create a new page, click Add New Page.

Add the page title and view the URL

In the Add title field, type a title for the page.

WordPress automatically uses the page title to generate the page URL. To edit this URL, select the Link field in the Settings sidebar.

Add a component

Components are the building blocks of the Dornsife website: these are content blocks which let you add text, images, and other media in pre-designed layouts to your page. There is no limit to how many times you can add a component or use the same component on a page.

You can add a component in one of two ways:

Add a component using the block inserter

Open the block inserter by clicking the + icon in the top toolbar:

The block inserter appears on the left side of the editor and shows all of the available components.

If you click a component, it will automatically be added to the end of the page.
If you click and drag a component, you can drop and release it to a different location on the page.

Add a component in a specific location on the page

If you want to add a component in-between two existing components, hover your cursor between the two components. Then, click the + Add block button once it appears:

Duplicate or delete a component

First, click the component. Then, in the toolbar, click the Options icon and select an action:

Reorder a component

To move a component, first click the component. Then, in the toolbar, use the Drag icon or Move arrows to reorder the component on the page:

Popular components

There are more than 30 components available for use on Dornsife websites. For detailed information, refer to the following resource:

Component List

If you're not sure where to get started, here are a few suggestions:

Rich Text: This is a great default component that lets you add text and images to the page. It includes basic text formatting options such as headings, links, bulleted lists, ordered lists, and simple buttons. It's also possible to add videos in this component.
Editorial Cards, Stacking Cards: Use either of these components to display text and images in a card format for easy scanning.
Featured Block, Full Width Image + Text, Image Gallery: Use one of these components to show off larger, high resolution images with a limited amount of accompanying text.
Video with Text, Video Pane: Use Video with Text to add single videos. Use Video Pane to add multiple videos in a gallery-like format.

Adding and editing the menu

The department website menu appears as a black horizontal bar below the department name on each page. This menu is edited not in the WordPress editor but on the Menu Admin Screen:

Editing the department website menu in WordPress

Adding a banner or featured image

You can add a banner, or full-width featured image, to any page, and can even add a video banner on the homepage. For instructions, refer to the following guide:

Adding a banner or featured image to a page in WordPress

Saving, previewing, and publishing an unpublished page or draft

Save draft

Unpublished or draft pages are autosaved every 15 seconds. To manually save your progress, click Save draft in the top toolbar.

Preview draft

To preview, click the View icon in the top toolbar and select Preview in new tab .

We recommend avoiding the Desktop, Tablet, or Mobile options: the preview for these options is inaccurate and will also make it difficult to switch back into editing mode.

Instead, to preview how the draft displays for visitors on tablets or mobile devices, manually resize your browser window.

Publish draft

To publish a draft, click Publish in the top toolbar:

Revising a published page

Make minor changes

If you are making minor changes, you can edit the page and then click Save in the top toolbar. This immediately updates the page.

Make major changes

If you are making extensive changes, you can use the Rewrite & Republish feature:

Quick guide

In the Settings sidebar, click Rewrite & Republish.
WordPress creates a duplicate of the published page and opens it in the editor.
Make as many edits as you need to this draft. These edits will not affect the published page in any way.
If you need to leave and return to this draft later, make sure that you re-open the draft, not the published page.
Once you're done editing this draft, click Republish in the top toolbar.
The edits in the draft are incorporated into the published page.

Detailed guide (with screenshots)

In the Settings sidebar, click Rewrite & Republish.
WordPress creates a duplicate of the published page and opens it in the editor.
Make as many edits as you need to this draft. These edits will not affect the published page in any way.
If you need to leave and return to this draft later, make sure that you return to the draft, not the published page.
Once you're done editing this draft, click Republish in the top toolbar.
The edits in the draft are incorporated into the published page.

Viewing or reverting to an earlier version

You can view earlier versions of your published and unpublished pages, but be aware that the formatting may be a little difficult to read:

Quick guide

In the Settings sidebar, click the Revisions field.
The Compare Revisions page opens. Drag the slider control along the timeline to view earlier page versions, including the author, date, and exact changes made.
- To compare versions, select the checkbox Compare any two revisions, which provides a second draggable slider control .
- To revert the current page to an earlier version, click Restore This Revision.

Detailed guide (with screenshots)

In the Settings sidebar, click the Revisions field.
The Compare Revisions page opens. Drag the slider control along the timeline to view earlier page versions, including the author, date, and exact changes made.
- To compare versions, select the checkbox Compare any two revisions, which provides a second draggable slider control .
- To revert the current page to an earlier version, click Restore This Revision.

Avoiding sync issues

To prevent sync issues, WordPress warns you if a page is currently being edited by someone:

Be aware that WordPress will not warn you if you have the page open for editing in more than one browser or tab, or on more than one computer. For this reason, avoid having the same page open in the WordPress editor in multiple browser tabs at the same time.