INF 270: WordPress — Week 3: Core WordPress Functionality

Introduction

Today we'll explore the core features of WordPress that you'll use daily when managing a website. We'll start with the basics and progressively build up to more advanced customization options.

What we'll cover: Creating pages and posts, using the block editor, organizing content with categories and tags, managing media, and customizing your site's appearance with the site editor.

Pages vs Posts: Understanding the Difference

WordPress has two primary content types, and understanding when to use each is fundamental:

Creating Your First Page

Let's start by creating a simple page. Pages are perfect for content that forms the structure of your site.

Steps to Create a Page

1. From the WordPress admin dashboard, go to Pages → Add New
2. We're going to make a static homepage for our site, so title the page "Home"
3. You'll see the block editor interface - we'll explore this in detail next
4. For now, click the + button and select Paragraph to add some introductory text
5. Click Publish in the top right corner (you may need to click it twice to confirm)

The Block Editor (Gutenberg)

The block editor is WordPress's modern content creation interface. Every piece of content—paragraphs, images, headings, buttons—is a "block" that you can add, move, and customize.

Core Concepts

• Everything is a block: Text, images, videos, buttons, columns, etc.
• Blocks can be added using the + button (top left or between blocks)
• Blocks can be moved using drag handles or up/down arrows
• Blocks can be deleted using the three-dot menu on each block

Block Settings

When you select a block, you'll see two panels:

• Block toolbar: Appears above the block with formatting options
• Settings sidebar: On the right side, shows detailed options for the selected block (including color, typography, spacing, etc.)

Using Block Patterns

Block patterns are pre-designed layouts combining multiple blocks. They're like templates within the editor that you can customize.

How to Use Patterns

1. Click the + button to add a new block
2. Click the Patterns tab at the top
3. Browse available patterns by category (Headers, Text, Gallery, etc.)
4. Click a pattern to insert it
5. Customize the pattern by editing individual blocks within it

Managing Media (Images, Videos, Files)

Download this sample image: Roar Store Logo

The Media Library is where WordPress stores all your uploaded files: images, videos, PDFs, and other documents.

Uploading Media

Method 1: Through Media Library

1. Go to Media → Library
2. Click Add New
3. Drag and drop files or click Select Files
4. Files will upload and be available throughout your site

Method 2: While Editing (Preferred)

1. Add an Image block to your page or post
2. Click Upload or drag an image directly into the block
3. The image uploads and is automatically inserted

Image Settings

When you select an image block, you can:

• Resize: Drag corners or set specific dimensions in the sidebar
• Align: Left, center, right, wide, or full width
• Alt text: Add descriptive text for accessibility (important!)
• Link: Make the image clickable
• Crop/Edit: Basic image editing tools

Creating Posts

Now that you understand the block editor and media management, let's create posts—the time-stamped content that forms your blog or news section.

Creating Your First Post

1. Go to Posts → Add New
2. Add a title (e.g., "Welcome to Our Blog")
3. Use the block editor to add your content (same as pages)
4. Add a Featured Image in the right sidebar (this appears in blog listings)
5. Write an Excerpt (optional summary text for listings)

Featured Images

Featured images appear in blog listings and social media shares. To set one:

1. Look for Featured image in the right sidebar
2. Click Set featured image
3. Upload a new image or choose from the Media Library
4. Click Set featured image to confirm

Post Visibility Options

In the right sidebar under Visibility, you can set:

• Public: Visible to everyone
• Private: Only visible to site admins and editors
• Password protected: Requires password to view

WordPress Settings: Home & Blog Pages

By default, WordPress displays your latest blog posts on the homepage. For most professional websites, you'll want a custom static homepage and a separate page that displays your blog posts.

The Default Behavior

• WordPress shows your most recent posts on the homepage
• This works well for blogs but not for business or portfolio sites
• You typically want a custom homepage with specific content

Setting a Static Homepage

Here's how to create a custom homepage structure:

Step 1: Create the Pages

1. Create a page called "Home"
2. For now just add some welcome text or introductory content to this page. We'll flesh it out later.
3. Create another page called "Blog" (or "News", "Articles", etc.)
4. Leave the Blog page empty — WordPress will automatically fill it with your posts

Step 2: Configure Reading Settings

1. Go to Settings → Reading
2. Under "Your homepage displays," select A static page
3. For Homepage: Select your "Home" page from the dropdown
4. For Posts page: Select your "Blog" page from the dropdown
5. Click Save Changes

What This Does

• Visitors who go to your site's main URL will see your custom Home page
• Your blog posts will appear at /blog/ (or whatever you named the posts page)
• You can now design your homepage separately from your blog
• This gives you full control over your site's structure and first impression

Categories and Tags

Categories and tags help organize your posts and make content easier for visitors to find. They're only used for posts, not pages.

Categories

• Broad groups for organizing content
• Hierarchical (can have parent/child relationships)
• Every post should have at least one category
• Examples: "Technology," "Tutorials," "Company News"

Adding Categories:

1. In the post editor, find Categories in the right sidebar
2. Check existing categories to assign them
3. Or click Add New Category to create one
4. You can assign multiple categories to a single post

Managing Categories:

1. Go to Posts → Categories
2. Add new categories with names and descriptions
3. Create parent/child relationships (e.g., "Technology" → "Web Development")
4. Edit or delete existing categories

Tags

• Specific keywords describing post details
• Non-hierarchical (flat structure)
• Optional but helpful for navigation
• Examples: "wordpress," "tutorial," "beginner-friendly"

Adding Tags:

1. In the post editor, find Tags in the right sidebar
2. Type tag names and press Enter after each one
3. WordPress will suggest existing tags as you type
4. You can add as many tags as relevant (but don't overdo it)

Site Editor: Customizing Your Site's Templates

The Site Editor allows you to customize the overall design and layout of your site—headers, footers, page templates, and more. This is where you control the "frame" around your content.

To access it, from the dashboard, go to Appearance → Editor

Editing a Template

1. Select Templates
2. Choose a template to edit (e.g., "Single Post" or "Page")
3. Click to edit any block in the template
4. Use the + button to add new blocks
5. Click Save when finished

Editing Template Parts (Header & Footer)

1. In the Site Editor, click a template part (header or footer area)
2. Edit blocks directly (site title, navigation, etc.)
3. Changes apply site-wide to all pages using that template part
4. Save your changes

Global Styles

Global Styles control the overall look and feel without editing individual blocks:

1. In the Site Editor, click the Styles icon (top right)
2. Adjust Colors: Background, text, accent colors
3. Adjust Typography: Font families and sizes
4. Adjust Layout: Content width and spacing
5. Changes apply to your entire site