Intro to WordPress

About You

Why do you want to learn WordPress?

  • Your name and background
  • Anything in particular you are hoping to learn today?


To become familiar with the WordPress dashboard, plugins, themes, widgets and more!

Ask Questions!

Using your own WordPress install today?

Are you able to add posts and pages and change the theme and navigation to your site?

What we'll cover today

  • What WordPress is
  • How to build out a site with pages and posts
  • Plugins - how to find, install, and activate them
  • Widgets and Menus
  • Themes - how to find, install, preview, and activate them
  • Customizing themes
  • How to keep your site secure
  • More advanced installs
  • Administrative backend functionality
  • Resources, questions, and if there's time, some one-on-one help

But first...

let's learn how the web works!

What is WordPress?

Official description from

WordPress is web software you can use to create a beautiful website or blog. We like to say that WordPress is both free and priceless at the same time.

WordPress is Popular

26.4% of all the websites use WordPress.

WordPress is the #1 content management system in the world (59.4% marketshare).

WordPress is

Free, open source, web-based software

WordPress core software is built by hundreds of community volunteers. People all around the word contribute to WordPress by either submitting bugfixes, testing, designing or writing code for the software.

WordPress is

A content management system

WordPress allows site owners to manage their site content via an easy-to-use admin dashboard. vs.

  • - Web software used to build a website on a hosting account with a domain name. Sites can be built and modified using themes, plugins or custom code

  • - A free blogging service that allows people to create a blog hosted on's servers. Hosting is free (although there are some for-pay add-ons), theme choices are limited, plugins can not be installed and code can not be modified

Hosting a Wordpress Install

  • If you're selling to clients, we recommend a "managed" wordpress install

  • Pros: Hassle-free. This includes security, speed, WordPress updates, daily backups, website uptime, and scalability. WPEngine is top-notch, GoDaddy also has this option.
  • Cons: More expensive (starts at $30/month, often limits you to wordpress only
  • For a simple blog, we recommend shared wordpress hosting (what we're using today)
  • More about managed wordpress hosting
  • More about shared hosting

Exercise: Get logged into WP Admin

A Tour of the Front End

WordPress comes with the default theme Twenty Seventeen activated

  • A sample post on the home page.
  • A sample page
  • A sample comment
  • A sample tag line "Just another WordPress site"
  • A set of sidebar widgets

A Tour of the Backend Admin

Located at:

The admin is divided into 3 areas:

  1. The top menu bar
  2. The left-hand menu used to navigate to most admin functionality
  3. The main content window where most admin functionality is performed

A Tour of the Backend Admin

Located at:

Tip: You can change what's displayed on an admin page by clicking on the "screen options" tab in the upper right corner.

Another Tip: Open the front end of your site in one browser tab and the backend in another so you can easily switch between the two as you make changes to your site.

Pages and Posts

  • Pages: Regular static website pages with content
  • Posts: Entries (like blog posts) that have a date, categories and tags assigned to them. They can be listed in a particular order (chronologically, alphabetically, etc.) and fed to other sites or blog readers via an RSS feed

Pages and Posts

Let's look at some examples!


  • Page Title
  • Permalink: Manage the name of the page URL
  • Revisions: View and restore previous versions of the page
  • Discussion: Turn comments on or off for this page
  • Comments: Displays current page comments
  • Slug: Manage the name of the page slug
  • Author: Switch between post authors (display requires theme support)

Using the Content Editor

  • Visual and Text tabs: Toggle between WYSIWYG and code view
  • Add Media: Upload pictures and other files
  • Button Bar: Use formatting and display options
  • Embeds: Paste links to popular media services and they will automatically display on the page


  • Excerpt: Use the Read More button (display requires theme support)
  • Categories and Tags: Assign categories and tags to allow posts to be organized by subject


Use the bulk editor on the page or post list to make edits to multiple pages or posts at a time (like removing comments).

Exercise Time!

Create pages and posts for your site.

  • Add placeholder text using Lorem Ipsum:
  • Add an image
  • Make a page password-protected
  • Make a page a "child" of another page
  • Embed a YouTube video or audio playlist
  • Add a link
  • Change the permalink of a page
  • Create a bullet point list
  • Create a new category and assign it to a post

Setting Up Your Site

The Settings menu

  • General: Title, tagline, site address, date format, etc.
  • Writing: Post-related settings
  • Reading: Set site home page, # of posts, rss settings and search engine visibility
  • Discussion: Manage comment settings
  • Media: Make default image sizes and other media settings
  • Permalinks: Define the structure of site URLs

Exercise Time!

  • Change the name of your site
  • Change the "Front page" of your site to the sample page
  • Create a page called "blog" and set as your "Posts page"
  • Require comments to be approved by an administrator before they are posted
  • Set your timezone to "Los Angeles"
  • Change the permalink set-up to "Post Name"
  • Remove the "WordPress News" from the dashboard

Changing Site Appearance

The Appearance menu

  • Themes: Manage the current theme in use and other installed themes
  • Widgets: You can add content to your site sidebars or other "widgetized" areas using widgets
  • Menus: Manage Custom menus
  • Header: Manage header text and image
  • Background: Manage background color and image
  • Editor: Dangerous way to edit theme and plugin flies. This is disabled if you "harden" WordPress

Managing Menus

Appearance > Menus

Easily create and manage navigation menus

  • Create menus: Enter a menu name and click "Create Menu"
  • Add pages: Add existing pages, custom links or category pages
  • Order Pages: Drag and drop your pages menu items in the desired order. Indent pages to make them children of other pages
  • Assign Menu to Theme location: When the menu is ready, assign it to a theme location and click "Save Menu."
  • Manage Locations Tab: Assign menus to theme locations

Exercise Time!

  • Remove a few widgets and add some of your own text to the sidebar using a text widget
  • add a link in the text widget using my super handy trick for those who don't know HTML
  • Add a picture to your header
  • Change the color of your header text
  • Change the color of your background
  • Have one menu item link to
  • Create a dropdown Menu
  • Have one menu item link to a category

Managing Comments

The Comments menu

View, approve, delete and mark comments as spam.

Managing Media

The Media menu

View all files that have been uploaded to the site via the content editor. Add, edit and delete files.

Managing Users

The Users menu

  • Manage existing users: Edit all user data or delete users
    • Removing an admin user (do this if the username is "admin")
  • Add new users: Assign new users to site
  • Your Profile: Edit your own profile settings

Managing Users

User roles

Users can be given certain levels of editing privileges.

  • Administrator: access to all the administration features within a single site
  • Editor: ability to publish and manage posts including the posts of other users
  • Author: ability to publish and manage their own posts
  • Contributor: ability to write and manage their own posts but cannot publish them
  • Subscriber: ability to only manage their profile

10 minute break!

What are Plugins?

Official description from

Plugins can extend WordPress to do almost anything you can imagine.

Plugins are Powerful

Plugins are used to add functionality to WordPress. Examples include ecommerce, SEO, forms, photo galleries, social media sharing, forums and much more!

Plugins are Often Free

Right now there are over 43,850 free plugins in the official WordPress Plugin Directory.

Managing Plugins

WordPress comes with 2 plugins:

  • Akismet: Protects your blog from comment and trackback spam. This plugin requires an Akismet key
  • Hello Dolly: Adds a random lyric from "Hello Dolly" to the upper right-hand corner of admin screen.

Managing Plugins

  • Activate/Deactivate: Turns plugins "on" and "off"
  • Edit: Ability to edit plugin files NOT RECOMMENDED
  • Delete: Delete deactivated plugins

Finding Plugins

3 Ways to Install Plugins

  1. Clicking "Install Now" from "Install Plugins" search results
  2. Download a plugin zip file and install it via the "Upload" link
  3. Unzip the plugin files and upload it via FTP to the
    /wp-content/plugins folder

Plugin Shortcodes

Plugins often use shortcodes to add content to a page or post.

For example, the plugin Contact Form 7 uses the shortcode [contact-form-7 id="105"] (the ID is the ID of the form) which allows you to add a form on a page or post.


Security tip - Vet plugins first

  • Ratings: Read the plugin reviews
  • Maintenance: Check to see if the plugin has regular updates
  • Support: See if the plugin developers regularly answer support questions

Free Plugins that are Popular

Plugin Demo

How to add a slideshow to your website using the Meta Slider plugin

Exercise Time!

  • Create a new admin user and remove the old one (attribute any posts to the new user)
  • Search for plugins via Plugins > Add New and try some
  • Browse the WordPress Plugins Directory, download one and install it using the "upload" link
  • Leave a comment on your neighbor's site (if they are using a temporary install)


Themes determine how a site looks and they also can determine its functionality. There are themes that can turn a WordPress site into an online store, an art portfolio, project management system and more.

Themes are

Often Free

Right now there are over 3,821 free themes in the official WordPress Themes Directory.

Managing Themes

Appearance > Themes

WordPress currently comes with 3 themes: Twenty Seventeen, Twenty Sixteen and Twenty Fifteen

Under Appearance > Themes is a list of all installed themes. The theme in use is labeled "Active."


Appearance > Themes

"Live Preview" before you activate or customize a theme

Click "Customize" under the current theme or "Live Preview" under an available theme to see how a new or modified theme will look before you commit to it.

Finding New Themes

3 Ways to Install a Theme

  • Install using the "Add New" button
  • Download a theme zip file and install it via the "Upload Theme" button
  • Unzip the theme files and upload it via FTP to the
    /wp-content/themes folder (this is the way to upload purchased themes)

Exercise Time!

Some tasks to get you familiar with installing, previewing and activating themes

  • Use the live theme previewer to see how Twenty Sixteen will look on your site and try activating it
  • Search for themes via the "Add New" button and give one a try
  • Browse the WordPress Themes Directory, download one and install it using the "Upload Theme" button

Tweaking your theme: 3 ways

First way: the Editor

  • The editor's changes will be overwritten if you update your theme. We want to be able to update safely.
  • It's easy to break this
  • You *really* don't want any clients messing around in here

Exercise Time!

Let's turn our background red

  • Be sure the Twenty Seventeen theme is activated
  • Navigate to Appearance > Editor in your WPAdmin sidebar
  • The first thing you should see is a style.css
  • At the bottom of this file add this and then click update file:
                  .site-content-contain {
                    background-color: red;
  • Check out your site, the background should be red

Tweaking your theme part 2: Adding CSS

Second way: Customize CSS

  • This way is update-safe and adds additional CSS to your site (not replacing it).
  • Under the Appearance tab, click Customize > Additional CSS
  • Add some new code:
                      .site-content-contain {
                        background-color: blue;
  • We recommend this method for small tweaks

Tweaking your theme part 3: Creating a child theme

What is a "child theme"?

  • A child theme is a theme that inherits the functionality and styling of another theme, called the parent theme
  • A powerful, more advanced tool: you can change far more than just how it looks
  • But creating a basic child theme is very approachable
  • A child theme consists of at least one directory (the child theme directory) and two files (style.css and functions.php)

Next Steps

Create your own themes using Child Themes

Let's create our own from the default theme

  • Make a new folder on your computer called "twentyseventeen-child"
  • Open this folder in your editor
  • Create two new empty files: "style.css" and "functions.php"
  • Style.css

  • In your new style.css file:
  • Add this with your information:
                  Theme Name: [Your Theme Name]
                  Description: The custom theme [Your Theme Name] using the parent theme Twenty Seventeen.
                  Author: [You]
                  Author URI: [Your URL]
                  Template: twentyseventeen
                  Version: 1
  • In the same file, add this code directly after:
                .site-content-contain {
                  background-color: green;
  • Save this file
  • functions.php

  • In your new functions.php file:
  • Add this with your information:
      function mychildtheme_enqueue_styles() {
        $parent_style = 'twentyseventeen-style';
        wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
        wp_enqueue_style( 'child-style',
          get_stylesheet_directory_uri() . '/style.css',
          array( $parent_style )
      add_action( 'wp_enqueue_scripts', 'mychildtheme_enqueue_styles' );
  • Save this file
  • Upload

  • zip up this folder
  • In your WP admin go to Appearance > Themes > Add theme > Upload and upload your zip
  • Activate your theme
  • Security

    Being popular means you're a target

    It is important to take security seriously when running a site that uses a CMS.


    During install

    • Make your database table prefix unique. Don't use "wp_" or "wordpress_"
    • Create a new database user, don't use the default
    • Make your database user password strong.
    • Do not use "admin" as a username. "admin" used to be the default WordPress username. Use a unique username and a very strong Password


    After install: WordPress hardening


    If you do get hacked

    • Use a malware removal service.
      • Reasonably priced WordPress security experts
      • WordPress hosting that includes malware cleanup if needed

    Installing WordPress

    What WordPress needs to run on a remote host

    • A hosting account running PHP version 5.6 or greater and MySQL version 5.6 or greater
    • Software from or an install feature through a hosting account control panel
    • A domain name (or temporary URL provided by your host)

    Installing WordPress

    Control Panel Install


    Manual install

    What Is Needed For a Control Panel Install

    • Web host needs to offer it
    • Access to your hosting control panel

    Installing WordPress

    What Is Needed For a Manual Install

    • Access to your hosting control panel to create a database and database user
    • A SFTP Program. SFTP (or FTP) is the method used to upload and download files between a computer and a hosting account
    • A Web browser. Installation is performed step-by-step on a web browser

    The Manual Install

    A Quick tour

    Detailed instructions are found here at

    Access to your hosting control panel (cPanel) to create a database and database user

    Create a database and database user

    Be sure to check all of these boxes:

    Download the latest WordPress version from

    The files

    The wpconfig.php file

    Upload the WordPress files to the desired directory using an FTP (File Transfer Protocol) Program. FTP (or SFTP) is the method used to upload and download files between a computer and a hosting account

    Installation is performed on your web browser by going to the URL where you uploaded the files.

    WordPress Workflow

    Developing locally


    Changing the URL of WordPress

    When you have finished developing your site locally and are ready to move your site to the desired URL, you will want to read the following pages:
    Moving WordPress

    There is a lot of information about this. Here are a couple more good resources:

    Migrating a WordPress Site From a Local Server to Production
    Migrating WordPress Across Hosts, Servers and URLs


    Changing the URL of WordPress

    Another option for moving your WordPress site to another domain or host is to use the Backup Buddy plugin. This plugin is not free. You can also use it to easily backup and restore a WordPress site.


    Attend a WordCamp

    WordCamps are affordable, informal, community-organized WordPress conferences held all over the world. They are packed with workshops geared toward WordPress users, designers and developers.



    One-on-one help time

    Feel free to pull me or a TA over to answer questions specific to your projects or regarding any issue not covered in class.


    Thank you!