WordPress Day 1

IMPORTANT: Have students create a domain and install WordPress on it before coming to class by following the instructions below. You should send the following in an email to your class prior to the first day:

  • Go to domains.byu.edu
  • Press the “Get Started” button and follow the instructions to get a domain.
  • Go to the dashboard of domains.byu.edu and click on “WordPress” under the “Applications” heading
    • Click “Install Application”
    • In the WordPress settings page, set an administrator username and password (you’ll use these to get into the back end of the website)
    • Change other settings, like website name and tagline, etc.
  • Click “Install”
  • Go to [YourDomain].com/admin and login with your newly created username and password

Note: BYU only gives ONE free domain per student and it can only be changed one time

Objectives

General Objectives

  • Students will create a website with their own domain name
  • Students will customize and populate that website

Specific Learning Outcomes

  • Students will create a domain, install WordPress onto that domain, and get onto the back end of WordPress
  • Students will know the basic functions of WordPress, such as adding images, adding themes, and creating pages and posts

Sample Lesson Plan

Hook: show a completed WordPress website

Introductions

Hosting vs. Domains

  • Domain
    • The name of your website
    • Ex. google.com
  • Hosting
    • The computers that store your website’s data. BYU is acting as our host so the data for our website is stored on BYU servers
  • Registering a domain and hosting is free through BYU for all students
    • Once students graduate they can pay $25 a year for BYU to continue to host their website (this is a great deal! most web hosts charge $100/year for hosting)
    • Students own the domain for life through BYU

What is WordPress?

  • WordPress.com
    • More basic version of WordPress; not what we teach
  • WordPress
    • The software that you use to create your website
  • WordPress.org
    • WordPress user manual 
    • Website where users can upload plugins, themes, etc.

Front End vs. Back End

  • Front end
    •  What visitors will see
    • Appearance is determined by theme (set on back end)
  • Back end
    •  Where edits are made by the site owner
    • Dashboard looks the same no matter what your website looks like on the front end
    • Contains controls for plugins, pages, posts, themes, etc.

Choosing a Theme

  • Determine how the front end of your website looks 
    • Appearance > Themes > Add New Theme
    • Keep in mind that quality/functionality is not the same across all themes

Posts & Pages

  • Pages
    • Information that will be relevant for a long time
    • About, FAQ, contact form, etc.
    • Page > Add New
      • Gutenberg block editor
      • Preview to view the front end
      • Publish to make accessible to users on your website
      • Change text size and color etc. from right panel
    • Parent/Child Pages
      • Righthand menu in Block editor
      • Useful for sub-menus

Menus

  • Once you have made pages you can add them onto a menu
    • Appearance > Menus
      • Create new menu & give it a name
      • Add pages
      • Drag around to change order
      • Remember to click “save menu” when done
  • Posts
    • Blog posts
    • Post > Add New

Images

  • Upload images to the media library
  • Image options:
    • Alt text
      • Displays when your image isn’t loading
      • Also an accessibility feature for blind users – software will read the alt text of an image out loud to them
    • Image captions
    • Description
      • Shows up in the metadata

Conclusion