Webpage Editing

Webpage Creation and Editing

To see how to access pages, see the documentation “Getting Started”.

Suggested Training

For first time users, please complete WordPress training on Lynda.com.  Login in  using your NetID and password.  The correct training is “WordPress Essential Training”, accessible through the top search bar.

Lynda.com UIUC Login: http://web.uillinois.edu/lynda/lynda_uiuc/

Topics covered in the training include creating pages and posts, formatting text, adding media, and using widgets.  This training will teach you the necessary, general components of editing a WordPress page.

Online Tutorials

There are many useful tutorials online covering WordPress basics.  We suggest using TutorialPoint’s WordPress Tutorial, available here: https://www.tutorialspoint.com/wordpress/index.htm. The following sections are particularly useful:

Entering Content

When transferring content from another webpage, copy the content into the visual editor.  However, make sure to check the text editor for correct structure.  Keep an eye out for:

  • Headings – Check to make sure the headings are in the correct order, namely <h1>, <h2>, <h3>, and so on.  Sometimes previously created webpages use headings (incorrectly) to achieve certain looks or styles, rather than for semantic markup.  For instance, you may see a page that has heading 3, then heading 2 nested under heading 3.  Or the headings might skip order, such as jumping from heading 2 to heading 4.  Below is an example of what headings look like in the text editor:
    • <h2>Webpage Creation and Editing</h2>
      To see how to access pages, see the documentation “Getting Started”.
      <h3>Required Training</h3>
  • Classes – Some webpages assign <class> tags to elements to ensure equal styling.  Classes, and other related outside styling demarcations, are not recognized by WordPress. These should be removed.
  • Divs – <div> tags mark certain sections in HTML or block-elements in CSS.  These should be removed from the text in WordPress.
  • IDs – Id’s are unique identifiers for elements on a webpage.  The are used to manipulate an element or to assign specific styling.  They should be removed.
  • Lists – Check that lists are in the proper format. Sometimes webpages will have pseudo-lists, made by setting each item as a paragraph in <p> tags. They should be converted to proper lists. Below is an example of correct formatting:
    • <ul>
      <li><a href=”https://www.tutorialspoint.com/wordpress/wordpress_add_posts.htm”>Add Posts</a></li>
      <li><a href=”https://www.tutorialspoint.com/wordpress/wordpress_edit_posts.htm”>Edit Posts</a></li>
      <li><a href=”https://www.tutorialspoint.com/wordpress/wordpress_add_pages.htm”>Add Pages</a></li>
      <li><a href=”https://www.tutorialspoint.com/wordpress/wordpress_edit_pages.htm”>Edit Pages</a></li>
      </ul>
  • Media – When transferring content, do not copy media directly into the page.  Instead, download the media and add the media using the “Add Media” button.  To see instructions on adding media, using the following tutorial: https://www.tutorialspoint.com/wordpress/wordpress_add_media.htm

UIUC Library-specific Controls

Slugs

Slug

The slug for a page can be set through the “Slug” box at the bottom of the editing page, or in the URL under the “Title” box.  The UIUC library policy for creating slugs for new WordPress pages is as follows:

  1. The slug should match the current library URL
  2. If the current URL has .html at the end, remove the .html.
    Example: http://search.grainger.illinois.edu/top/staff.html
    Original slug: staff.html
    New slug: staff
    New URL: http://search.grainger.illinois.edu/top/staff/
  3. If the URL ends in index.html, drop the index.html
    Example: http://library.illinois.edu/fake-page/index.html
    Original Slug: fake-page/index.html
    New Slug: fake-page
    New URL: http://library.illinois.edu/fake-page/

Sidebar Control

The settings for the sidebar of the website are located in the right-hand column of the editing page.

Sidebar ControlWebpage Sidebar Display

Display Sidebar

Each page created will automatically contain a space for a sidebar. The features included in the sidebar, such as library hours and Ask a Librarian, can be edited separately. To remove the sidebar space entirely, use the “Hide Sidebar” box on the right side of the editing screen.

Sidebar

Library Chat Services

Library Chat Settings

Each page automatically displays the Ask A Librarian settings for the site.  To remove Ask a Librarian from a specific page, or to display Ask a Librarian if not displayed, use the “Library Chat Services” in the right-hand column of the editing page.

Library Hours

Similar to Ask a Librarian, the library hours are displayed based on site settings.  To change the hours display to a different library’s hours, or to remove the hours, use the drop down list in “Library Hours”.

Library Contact Information

Library contact

The default for contact information and location of the contact info on the webpage is the site wide setting.  The default location can be changed to top of page or sidebar.