WordPress Word Press The Missing Manual (2nd Ed.) [Mac Donald 2014 07 12]

User Manual: manual pdf -FilePursuit

Open the PDF directly: View PDF PDF.
Page Count: 613

DownloadWordPress Word Press The Missing Manual (2nd Ed.) [Mac Donald 2014-07-12]
Open PDF In BrowserView PDF
The book that should have been in the box®

Matthew MacDonald

Beijing | Cambridge | Farnham | Köln | Sebastopol | Tokyo

WordPress: The Missing Manual
by Matthew MacDonald

Copyright © 2014 Matthew MacDonald. All rights reserved.
Printed in the United States of America.
Published by O’Reilly Media, Inc.,
1005 Gravenstein Highway North, Sebastopol, CA 95472.
O’Reilly books may be purchased for educational, business, or sales promotional use.
Online editions are also available for most titles (http://safaribooksonline.com). For
more information, contact our corporate/institutional sales department: (800) 9989938 or corporate@oreilly.com.
July 2014:

First Edition.

Revision History for the First Edition:

First release
Second release

See http://oreilly.com/catalog/errata.csp?isbn=9781449341909 for release details.

The Missing Manual is a registered trademark of O’Reilly Media, Inc. The Missing
Manual logo, and “The book that should have been in the box” are trademarks of
O’Reilly Media, Inc. Many of the designations used by manufacturers and sellers to
distinguish their products are claimed as trademarks. Where those designations
appear in this book, and O’Reilly Media is aware of a trademark claim, the
designations are capitalized.
While every precaution has been taken in the preparation of this book, the publisher
assumes no responsibility for errors or omissions, or for damages resulting from the
use of the information contained in it.
ISBN-13: 978-1-449-34190-9

The Missing Credits. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vii
Introduction. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ix
About This Book. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  x
About the Outline. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  xii
About the Online Resources. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xiii
Using Code Examples. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xiv
Safari® Books Online . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xiv

Part One:

Starting Out with WordPress
The WordPress Landscape. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
How WordPress Works. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  4
What You Can Build with WordPress. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  7
WordPress Hosting . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17


Signing Up with WordPress.com. . . . . . . . . . . . . . . . . . . . . . . . . . . 23
Choosing a Web Address. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  24
Creating Your WordPress.com Account. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  26
Managing Your New Site. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
Exploring the WordPress.com Community. . . . . . . . . . . . . . . . . . . . . . . . . . . .  38
Visiting the WordPress.com Store. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42


Installing WordPress on Your Web Host. . . . . . . . . . . . . . . . . . . 49
Preparing for WordPress. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .49
Installing WordPress with an Autoinstaller. . . . . . . . . . . . . . . . . . . . . . . . . . . .  55
Installing WordPress by Hand. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
Keeping WordPress Up to Date. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  79

Part Two:

Building a WordPress Blog


Creating Posts. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 85
Introducing the Dashboard. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  85
Adding Your First Post . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94
Organizing Your Posts. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  106


How to Get High-Quality Web Addresses. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 115
Dashboard Tricks to Save Time and Effort . . . . . . . . . . . . . . . . . . . . . . . . . . . . 123

Choosing and Polishing Your Theme. . . . . . . . . . . . . . . . . . . . . . . 131
How Themes Work. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 132
Choosing a New Theme. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 136
Tweaking Your Theme. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  144
Customizing Your Widgets. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  154
Mobile Themes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  168


Jazzing Up Your Posts. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 171
Making Fancier Posts. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 171
Adding Pictures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  180
Featured Images. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  190
Showing Part of a Post . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  195
Post Formats. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202


Adding Pages and Menus. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 207
Creating Pages. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208
Viewing Pages. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 211
Custom Menus. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 218
Changing Your Home Page. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 228
Page Templates. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 233


Comments: Letting Your Readers Talk Back.. . . . . . . . . . . . . . 239
Allowing or Forbidding Comments. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 240
The Life Cycle of a Comment. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 242
The Ongoing Conversation. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 253
Making Comments More Personal. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 262
Stamping Out Comment Spam. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 273

Part Three:

Supercharging Your Blog
Getting New Features with Plug-Ins. . . . . . . . . . . . . . . . . . . . . . 285
Managing Plug-Ins. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 286
The Jetpack Plug-In. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 297
Adding Mobile Support. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 307
Backing Up a WordPress Site. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 311
Better Performance with Caching. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  316




Adding Picture Galleries, Video, and Music. . . . . . . . . . . . . . . 323
Understanding Embeds and Shortcodes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 323
Showing Groups of Pictures. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 330
Embedding a Video . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 349
Playing Audio Files. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 360


Collaborating with Multiple Authors. . . . . . . . . . . . . . . . . . . . . . 369
Adding People to Your Site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 369
Working with Authors. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 378
Building a Private Community. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 394
Creating a Network of Sites. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 399


Attracting a Crowd.. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 411
Encouraging Your Readers to Share. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 412
Keeping Readers in the Loop. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 423
Managing Your Site’s Feed. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 433
Search Engine Optimization. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 437
WordPress Site Statistics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 444

Part Four:

From Blog to Website


Editing Themes: The Key to Customizing Your Site. . . . . . . 453
The Goal: More Flexible Blogs and Sites . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 454
Taking Control of Your Theme. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 459
Protecting Yourself with a Child Theme. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 462
Editing the Styles in Your Theme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 468
Editing the Code in Your Theme. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 485


Building an Advanced WordPress Site. . . . . . . . . . . . . . . . . . . . 505
Planning Your Site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 505
Adding New Types of Posts. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  510
Creating Custom Category Pages. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  519
Building a Better Home Page. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .  527
Making a Smarter Product Page. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 534
Adding eCommerce. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 542

Part Five:

Migrating from WordPress.com. . . . . . . . . . . . . . . . . . . . . . . . . . . 553
Before You Begin. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 554
Transferring Your Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 554
Cleaning Up Your New Site. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 560




Securing a Self-Hosted Site. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 563
1. Crash-Proof Your Site with Backups. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 564
2. Change Your Posting Account. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 564
3. Be Cautious When Extending Your Site. . . . . . . . . . . . . . . . . . . . . . . . . . . . 565
4. Prevent Password-Guessing Attacks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 566
5. Hide Passwords with SSL. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 568


Useful Websites.. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 571
Chapter Links. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 571

Index. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 581



The Missing Credits
Matthew MacDonald is a science and technology writer with well
over a dozen books to his name. Web novices can tiptoe out onto
the Internet with him in Creating a Website: The Missing Manual.
HTML fans can learn about the cutting edge of web design in HTML5:
The Missing Manual. And human beings of all description can discover just how strange they really are in the quirky handbooks Your
Brain: The Missing Manual and Your Body: The Missing Manual.

Peter McKie (editor) lives in New York City and, in his spare time, archives material
chronicling the history of his summer community. Email: pmckie@oreilly.com.
Melanie Yarbrough (production editor) lives and works in Cambridge, MA, where
she writes and bakes whatever she can dream up. Email: myarbrough@oreilly.com.
Ron Strauss (indexer) specializes in the indexing of information technology publications of all kinds. Ron is also an accomplished classical violist and lives in Northern
California with his wife and fellow indexer, Annie, and his miniature pinscher, Kanga.
Email: rstrauss@mchsi.com.
Julie Van Keuren (proofreader) quit her newspaper job in 2006 to move to Montana
and live the freelancing dream. She and her husband (who is living the novel-writing
dream) have two hungry teenage sons. Email: little_media@yahoo.com.
Sallie Goetsch (technical reviewer) (rhymes with “sketch”) hand-coded her first
website in HTML in 1995, but hasn’t looked back since discovering WordPress in
2005. She works as an independent consultant and organizes the East Bay WordPress
Meetup in Oakland, California. You can reach her at www.wpfangirl.com.

No author could complete a book without a small army of helpful individuals. I’m
deeply indebted to the whole Missing Manual team, including expert tech reviewer
Sallie Goetsch, my editor Peter McKie, and numerous others who’ve toiled behind
the scenes indexing pages, drawing figures, and proofreading the final copy.
Finally, for the parts of my life that exist outside this book, I’d like to thank all my
family members. They include my parents, Nora and Paul; my extended parents, Razia
and Hamid; my wife, Faria; and my daughters, Maya and Brenna. Thanks, everyone!



Missing Manuals are witty, superbly written guides to computer products that don’t
come with printed manuals (which is just about all of them). Each book features a
handcrafted index.
Recent and upcoming titles include:

WordPress: The Missing Manual, Second Edition by Matthew MacDonald
iPhoto: The Missing Manual by David Pogue and Lesa Snider
iWork: The Missing Manual by Jessica Thornsby and Josh Clark
Switching to the Mac: The Missing Manual, Mavericks Edition by David Pogue
OS X Mavericks: The Missing Manual by David Pogue
HTML5: The Missing Manual, Second Edition by Matthew MacDonald
Dreamweaver CC: The Missing Manual by David Sawyer McFarland and Chris Grover
Windows 8.1: The Missing Manual by David Pogue
iPad: the Missing Manual, Sixth Edition by J.D. Biersdorfer
Quickbooks 2014: The Missing Manual by Bonnie Biafore
iPhone: the Missing Manual, Seventh Edition by David Pogue
Photoshop Elements 12: The Missing Manual by Barbara Brundage
Galaxy S4: The Missing Manual by Preston Gralla
Photoshop CC: The Missing Manual by Lesa Snider
Office 2013: The Missing Manual by Nancy Connor and Matthew MacDonald
Excel 2013: The Missing Manual by Matthew MacDonald
Microsoft Project 2013: The Missing Manual by Bonnie Biafore
Access 2013: The Missing Manual by Matthew MacDonald
For a full list of all Missing Manuals in print, go to www.missingmanuals.com/





hroughout history, people have searched for new places to vent their opinions,
sell their products, and just chat it up. The World Wide Web is the culmination
of this trend—the best and biggest soapbox, marketplace, and meeting spot
ever created.
But there’s a problem. If you want people to take your website seriously, you need
first-rate content, a dash of good style, and the behind-the-scenes technology that
ties everything together. The first two items require some hard work. But the third
element—the industrial-strength web plumbing that powers a good site—is a lot
trickier to build on your own. Overlook that, and you’ve got a broken mess of pages
that even your mom can’t love.
This is where the ridiculously popular web publishing tool called WordPress comes
in. WordPress makes you a basic deal: You write the content, and WordPress takes
care of the rest.
The services that WordPress provides are no small potatoes. First, WordPress puts
every page of your content into a nicely formatted, consistent layout. It provides the
links and menus that help your visitors get around, and a search box that lets people
dig through your archives. WordPress also lets your readers add comments using
their Facebook or Twitter identities, so they don’t need to create a new account on
your site. And if you add a few community-created plug-ins (from the vast library of
more than 30,000), there’s no limit to the challenges you can tackle. Selling products?
Check. Setting up a membership site? No problem. Building forums and collaborative
workspaces? There’s a plug-in for that, too. And while it’s true that WordPress isn’t
the best tool for every type of website, it’s also true that wherever you find a gap
in the WordPress framework, you’ll find some sort of plug-in that attempts to fill it.



WordPress is stunningly popular, too—it’s responsible for more than one-fifth of
the world’s websites, according to the web statistics company W3Techs (see http://
tinyurl.com/3438rb6). It’s 10 times more popular than its closest competitors, sitebuilding tools like Joomla and Drupal. And month after month, WordPress’s share of
the Web continues to inch upward. In short, when you create your own WordPress
site, you’ll be in good company.

About This Book
This book provides a thorough, soup-to-nuts look at WordPress. You’ll learn everything you need to know, including how to create, manage, maintain, and extend a
WordPress site.
NOTE Notice that we haven’t yet used the word blog. Although WordPress is the world’s premiere blogging
tool, it’s also a great way to create other types of websites, like those that promote products, people, or things
(say, your hipster harmonica band), sites that share stuff (for example, a family travelogue), and even sites that
let people get together and collaborate (say, a short-story writing club for vampire fans). And if you’re not quite
sure whether the site you have in mind is a good fit for WordPress, the discussion on page 7 will help you decide.

What You Need to Know
If you’re planning to make the world’s most awesome blog, you don’t need a stitch
of experience. Chapters 1 through 12 will tell you everything you need to know.
However, you will come across some examples of posts and pages that feature
HTML (the language of the Web), and any HTML knowledge you already have will
pay off handsomely.
If you’re planning to create a website that isn’t a blog (like a catalog of products
for your handmade jewelry business), you need to step up your game. You’ll still
start with the WordPress basics in Chapters 1 through 12, but you’ll also need to
learn the advanced customization skills you’ll find in Chapters 13 and 14. How much
customization you do depends on the type of site you plan to build and whether
you can find a theme that already does most of the work for you. But sooner or
later, you’ll probably decide to crack open one of the WordPress template files that
controls your site and edit it.
When you do that, you’ll encounter two more web standards: CSS, the style sheet
language that helps lay out and format your site; and PHP, the web programming
language upon which WordPress is built. But don’t panic—we’ll go gently and introduce the essentials from the ground up. You won’t learn enough to write your own
custom web apps, but you will pick up the skills you need to customize a WordPress
theme so you can build the kind of site you want.



Your Computer
WordPress has no special hardware requirements. As long as you have an Internet
connection and a web browser, you’re good to go. Because WordPress (and its
design tools) live on the Web, you can use a computer running Windows, Mac OS,
Linux, or something more exotic; it really doesn’t matter. In fact, WordPress even
gives you tools for quick-and-convenient blog posting through a smartphone or
tablet computer (see page 130 for the scoop).


Hosting WordPress
To let other people visit your WordPress site on the Internet, you need the help of
a web hosting company. Web hosts offer the powerful, web-connected computers
that run your site (and the websites of many other people). Without a host to store
your site, no one will be able to see your handiwork.
WordPress site-builders have two choices of web host:
• WordPress.com. The WordPress.com hosting service is free, and it’s run by
some of the same people who developed the WordPress software, so you’re
in good hands.
• A third-party web host. You can install WordPress on almost any web host.
While this approach isn’t free, it gives you more features and control. It’s called
Page 17 has much more about the differences between these two approaches. But
that’s for the future. For now, all you need to know is that you can use the information in this book no matter which approach you use. Chapter 2 explains how to sign
up with WordPress.com, Chapter 3 details self-hosting, and the chapters that follow
try to pay as little attention to your hosting decision as possible.
That said, it’s worth noting that you’ll come across some features, particularly later
in the book, that work only with self-hosted installations. Examples include sites that
use plug-ins and those that need heavy customization. But, happily, the features
that do work on both WordPress.com-hosted sites and self-hosted sites work in
almost exactly the same way.

Throughout this book, and throughout the Missing Manual series, you’ll find sentences like this one: “Choose Appearance→Themes in the dashboard menu.” That’s
shorthand for a longer series of instructions that go something like this: “Go to the
dashboard in WordPress, click the Appearance menu item, and then click the Themes
entry underneath.” Our shorthand system keeps things snappier than these long,
drawn-out instructions.



About the Outline
This book is divided into five parts, each with several chapters:
• Part 1, Starting Out with WordPress. In this part of the book, you’ll start planning your path to WordPress web domination. In Chapter 1, you’ll plan the type
of website you want, decide how to host it, and think hard about its domain
name, the unique address that visitors type in to find your site on the Web.
Then you’ll see how to get a basic blog up and running, either on WordPress.
com (Chapter 2) or on your self-hosted site (Chapter 3).
• Part 2, Building a WordPress Blog. This part explains everything you need to
know to create a respectable blog. You’ll learn how to add posts (Chapter 4),
pick a stylish theme (Chapter 5), make your posts look fancy (Chapter 6), add
pages and menus (Chapter 7), and manage comments (Chapter 8).
NOTE Even if you plan something more exotic than JAWB (Just Another WordPress Blog), don’t skip Part 2.
The key skills you’ll learn here also underpin custom sites, like the kind you’ll learn to build in Part 4 of the book.

• Part 3, Supercharging Your Blog. If all you want is a simple, classy blog, you
can stop now—your job is done. But if you hope to add more glam to your site,
this part will help you out. First, you’ll learn that plug-ins can add thousands of
new features to self-hosted sites (Chapter 9). Next, you’ll see how to put video,
music, and photo galleries on any WordPress site (Chapter 10). You’ll also learn
how to collaborate with a whole group of authors (Chapter 11), and how to attract boatloads of visitors (Chapter 12).
• Part 4, From Blog to Website. In this part, you’ll take your WordPress skills
beyond the blog and learn to craft a custom website. First, you’ll crack open
a WordPress theme and learn to change the way your site works by adding,
inserting, or modifying the CSS styles and PHP commands embedded inside the
theme (Chapter 13). Next, in Chapter 14, you’ll apply this knowledge to create a
WordPress product-catalog site that doesn’t look anything like a typical blog.
• Part 5, Appendixes. At the end of this book, you’ll find three appendixes. The
first (Appendix A: “Migrating from WordPress.com”) explains how to take a
website you created on the free WordPress.com hosting service and move it
to another web host to get more features. The second (Appendix B: “Securing
a Self-Hosted Site”) explains the security basics you need to harden your site
against attackers. The third (Appendix C: “Useful Websites”) lists some useful
web links culled from the chapters in this book. Don’t worry—you don’t need to
type these into your browser by hand. It’s all waiting for you on the Missing CD
page for this book at http://www.oreilly.com/pub/missingmanuals/wpmm2e.




About the Online Resources
As the owner of a Missing Manual, you’ve got more than just a book to read. Online,
you’ll find example files as well as tips, articles, and maybe even a video or two.
You can also communicate with the Missing Manual team and tell us what you love
(or hate) about the book. Head over to www.missingmanuals.com, or go directly to
one of the following sections.

Web Links
Often, this book will point you to a place on the Web. It might be to learn more
about a specialized WordPress feature, or to get background information on another
topic, or to download a super-cool plug-in. To save your fingers from the wear and
tear of typing in all these long web addresses, you can visit the clickable list of links
on the Missing CD page at http://www.oreilly.com/pub/missingmanuals/wpmm2e.

Living Examples
This book is packed full of examples. But unlike many other types of computer books,
we don’t encourage you to try to download them to your own computer. That’s because once you place WordPress files on a local computer, they lose their magic. In
fact, without the WordPress software running on a web server, your website loses
all its abilities. You won’t be able to try out even a single page.
To get around this limitation, many of the finished examples from this book are
available for you to play around with at http://prosetech.com/wordpress. Although
you won’t be able to actually take charge of the example site (modify it, manage
comments, or do any other sort of administrative task), you can take a peek and
see what it looks like. This is a handy way to witness some features that are hard
to experience in print—say, playing an embedded video or reviewing pictures in an
image gallery.

If you register this book at oreilly.com, you’ll be eligible for special offers—like discounts on future editions of WordPress: The Missing Manual. If you buy the ebook
from www.oreilly.com and register your purchase, you get free lifetime updates for
this edition of the ebook; we’ll notify you by email when updates become available.
Registering takes only a few clicks. Type www.oreilly.com/register into your browser
to hop directly to the Registration page.

Got questions? Need more information? Fancy yourself a book reviewer? On our
Feedback page, you can get expert answers to questions that come to you while
reading, share your thoughts on this Missing Manual, and find groups for folks who
share your interest in creating their own sites. To have your say, go to www.missingmanuals.com/feedback.



To keep this book as up to date and accurate as possible, each time we print more
copies, we’ll make any confirmed corrections you suggest. We also note such changes
on the book’s website, so you can mark important corrections in your own copy of
the book, if you like. Go to http://tinyurl.com/7mujhnx to report an error and view
existing corrections.

Using Code Examples
In general, you may use the code in this book in your programs and documentation.
You don’t need to contact us for permission unless you’re reproducing a significant
portion of the code. For example, writing a program that uses several chunks of code
from this book does not require permission. Selling or distributing a CD of examples
from O’Reilly books does require permission. Answering a question by citing this
book and quoting example code does not require permission. Incorporating a significant amount of example code from this book into your product’s documentation
does require permission.
We appreciate, but do not require, attribution. An attribution usually includes the
source book’s title, author, publisher, and ISBN. For example: “ WordPress: The
Missing Manual, Second Edition by Matthew MacDonald (O’Reilly). Copyright 2014,
If you feel your use of code examples falls outside fair use or the permission given
above, feel free to contact us at permissions@oreilly.com.

Safari® Books Online
Safari® Books Online is an on-demand digital library that lets you search over 7,500
technology books and videos.
With a subscription, you can read any page and watch any video from our library. You
can access new titles before they’re available in print. And you can copy and paste
code samples, organize your favorites, download chapters, bookmark key sections,
create notes, print out pages, and benefit from tons of other timesaving features.
O’Reilly Media has uploaded this book to the Safari Books Online service. To have
full digital access to this book and others on similar topics from O’Reilly and other
publishers, sign up for free at http://safaribooksonline.com.




Starting Out with

The WordPress Landscape

Signing Up with WordPress.com

Installing WordPress on Your Web Host



The WordPress



ince you picked up this book, it's likely that you already know at least a bit
about WordPress. You probably realize that it's a brilliant tool for creating a
huge variety of websites, from gossipy blogs to serious business sites. However,
you might be a bit fuzzy on the rest of the equation—how WordPress actually works
its magic, and how you can use WordPress to achieve your own website vision.
In this chapter, you'll get acquainted with life the WordPress way. First, you'll take a
peek at the inner machinery that makes WordPress tick. If you're not already clear
on why WordPress is so wonderful—and how it's going to save you days of work,
years of programming experience, and a headful of gray hairs—this discussion will
fill you in.
Next, you'll consider the types of sites you can build with WordPress, and how much
work they need. As you'll see, WordPress began life as a blogging website, but has
since mutated into a flexible, easy-to-use tool for creating virtually any sort of site.
Finally, you'll face your first WordPress decision: choosing a home for your WordPress site. You'll discover you have two options. You can use WordPress's free hosting service (called WordPress.com), or you can install the WordPress software on
another web host, for a monthly fee. Both approaches work, but the choice to use
WordPress.com imposes a few limitations you should understand before you decide.



How WordPress Works
You probably already realize that WordPress isn't just a tool to build web pages.
After all, anybody can create a web page—you just need to know a bit about HTML
(the language that web pages are written in) and a bit about CSS (the language that
formats web pages so they look beautiful). It also helps to have a first-class web
page editor like Adobe Dreamweaver at your fingertips. Meet these requirements,
and you'll be able to build a static website—one that looks nice enough, but doesn't
actually do anything (Figure 1-1).


In an old-fashioned website, a web designer creates a bunch of HTML
files and drops them into a folder on a web server. When someone
visits one of those pages, his browser renders that same HTML file as
a web page. WordPress works a little differently—it builds its pages
in real time, as you'll see next.


Just in case your webmaster skills are a bit rusty, remember that a web server is the high-powered
computer that runs your website (and, usually, hundreds of other people's websites, too).

With WordPress, you strike up a different sort of partnership. Instead of creating a
web page, you give WordPress your raw content—that's the text and pictures you
want published as an article, a product listing, a blog post, or some other type of
content. Then, when a visitor surfs to your site, WordPress assembles that content
as a made-to-measure web page.
Because WordPress is a dynamic environment—it creates web pages on the fly—it
provides some useful interactive features. For example, when visitors arrive at a
WordPress blog, they can browse through the content in different ways—looking
for posts from a certain month, for example, or on a certain topic, or tagged with a
certain keyword. Although this seems simple enough, it requires a live program that
runs on a web server and assembles the relevant content in real time. For example, if
a visitor searches a blog for the words “tripe soup,” WordPress needs to find all the
appropriate posts, stitch them together into a web page, and then send the result
back to your visitor's web browser. More impressively, WordPress lets visitors write
comments and leave other types of feedback, all of which become part of the site's
ongoing conversation.

WordPress Behind the Scenes
In a very real sense, WordPress is the brain behind your website. When someone
visits a WordPress-powered site, the WordPress software gets busy, and—in the
blink of an eye—it delivers a hot-off-the-server, fresh new web page to your visitor.



Two crucial ingredients allow WordPress to work the way it does:
• A database. This is an industrial-strength storage system that sits on a web server;
think of it as a giant, electronic filing cabinet where you can search and retrieve
bits of content. In a WordPress website, the database stores all the content for its
pages, along with category and tag labels for those pages, and all the comments
that people have added. WordPress uses the MySQL database engine, because
it's a high-quality, free, open-source product, much like WordPress itself.


• Programming code. When someone requests a page on a WordPress site, the
web server loads up a template and runs some code. It's the code that does
all the real work—fetching information from different parts of the database,
assembling it into a cohesive page, and so on.
Figure 1-2 shows how these two pieces come together.


When a browser sends a request to a dynamic
website, that request kicks off some programming code that runs on the site's server. In
the case of WordPress, that code is known as
PHP, and it spends most of its time pulling
information out of a database (for example,
retrieving product info that a visitor wants to
see). The PHP then inserts the information into
a regular-seeming HTML page, which it sends
back to the browser.


The Evolution of Dynamic Sites
Dynamic websites are nothing new; they existed long before
WordPress hit the scene. In fact, modern, successful websites
are almost always dynamic, and almost all of them use
databases and programming code behind the scenes. The
difference is who's in charge. If you don't use WordPress (or a
site-building tool like it), it's up to you to write the code that
powers your site. Some web developers do exactly that, but
they generally work with a whole team of experienced coders.
But if you use WordPress to build your site, you don't need to
touch a line of code or worry about defining a single database
table. Instead, you supply the content and WordPress takes
care of everything from storing it in a database to inserting it
into a web page when it's needed.

Even if you do have mad coding skills, WordPress remains a
great choice for site development. That's because using WordPress is a lot easier than writing your own software. It's also a
lot more reliable and a lot safer, because every line of logic has
been tested by a legion of genius-level computer nerds—and
it's been firing away for years on millions of WordPress sites.
Of course, if you know your way around PHP, the programming
language that runs WordPress, you'll have a head start when
it comes to tweaking certain aspects of your site's behavior,
as you'll see in Chapter 13.
In short, the revolutionary part of WordPress isn't that it lets
you build dynamic websites. It's that WordPress pairs its smarts
with site-creation and site-maintenance tools that ordinary
people can use.

Chapter 1: The WordPress Landscape



WordPress Themes
There's one more guiding principle that shapes WordPress—its built-in flexibility.
WordPress wants to adapt itself to whatever design you have in mind, and it achieves
that through a feature called themes.
Basically, themes let WordPress separate your content (which it stores in a database)
from the layout and formatting details of your site (which it stores in a theme). Thanks
to this system, you can tweak the theme's settings—or even swap in a whole new
theme—without disturbing any of your content. Figure 1-3 shows how this works.


When you visit a page from a WordPress site, WordPress combines the
content (which it stores in a database)
with formatting instructions (which
are stored in the theme's template
files). The end result is a complete
web page you see in your browser.

If you're still not quite sure how WordPress helps you with themes, consider an
example. Imagine Jan decides to create a website so he can show off his custom
cake designs. He decides to do the work himself, so he not only has to supply the
content (the pictures and descriptions of his cakes), but he also has to format each
page the same way, because each page has two parts—a description of the cake
and a picture of it—and he wants his pages to be consistent. But, as so often happens, a week after he releases his site, Jan realizes it could be better. He decides to
revamp his web pages with a fresh, new color scheme and add a calorie-counting
calculator in the sidebar.
Applying these changes to a non-WordPress website is no small amount of work.
It involves changing the website's style sheet (which is relatively easy) and modifying every single cake page, being careful to make exactly the same change on each
(which is much more tedious). If Jan is lucky, he'll own a design tool that has its own
template feature (like Dreamweaver), which will save editing time. However, he'll still
need to rebuild his entire website and upload all the new web pages.



With WordPress, these problems disappear. To get new formatting, you tweak your
theme's style settings, using either WordPress's control panel (called the dashboard),
or by editing the styles by hand. To add the calorie counter, for example, you simply
drop it into your theme's layout (and, yes, WordPress does have a calorie-counting
plug-in). And that's it. You don't need to rebuild or regenerate anything, go through
dozens of pages by hand, or check each page to try to figure out which detail you
missed when you copied HTML from one page to another.


What You Can Build with WordPress
There are many flavors of website, and many ways to create them. But if you want
something reasonably sophisticated and you don't have a crack team of web programmers to make that happen, WordPress is almost always a great choice.
That said, some types of WordPress websites require more work than others. For
example, if you want to create an ecommerce site complete with a shopping cart
and checkout process, you need to ditch WordPress or rely heavily on someone
else's WordPress plug-ins. That doesn't necessarily make WordPress a poor choice
for ecommerce sites, but it does present an extra challenge. (In Chapter 14, you'll
take a closer look at what it takes to build a basic v site that uses a plug-in to go
beyond WordPress's standard features.)
In the following sections, you'll see some examples of WordPress in action. You'll
consider the types of sites that use WordPress most easily and most commonly. Along
the way, you should get a feel for how WordPress suits your very own website-to-be.

As you probably know, a blog is a wildly popular type of site that consists of separate, dated entries called posts (see Figure 1-4). Good blogs reflect the author's
personality, and are informal and overflowing with content.
When you write a blog, you invite readers to see the world from your viewpoint,
whether the subject is work, art, politics, technology, or your personal experience.
Blogs are sometimes described as online journals, but most blogs are closer to oldschool newspaper editorials or magazine commentary. That's because a journal
writer is usually talking to himself, while a half-decent blogger unabashedly addresses the reader.

Chapter 1: The WordPress Landscape




Paul Krugman of the New
York Times writes this traditional blog. Here's what
you see when you arrive
at http://krugman.blogs.
nytimes.com. Scroll down
and you see a dozen or so
of his most recent posts.

Blogs exhibit a few common characteristics. These details aren’t mandatory, but
most blogs share them.
• A personal, conversational tone. Usually, you write blogs in the first person
(“I bought an Hermès Birkin bag today” or “Readers emailed me to point out
an error in yesterday’s post”). Even if you blog on a serious topic—you might
be a high-powered executive promoting your company, for example—the style
remains informal. This gives blogs an immediacy and connection to your readers that they love.



• Dated entries. Usually, blog posts appear in reverse-chronological order, so the
most recent post takes center stage. Often, readers can browse archives of old
posts by day, month, or year (see “Recent Posts” in Figure 1-4). This emphasis
on dates makes blogs seem current and relevant, assuming you post regularly.
But miss a few months, and your neglected blog will seem old, stale, and seriously out of touch—and even faithful readers will drift away.


• Interaction through comments. Blogs aren’t just written in a conversational
way, they also “feel” like a conversation. Loyal readers add their feedback to
your thoughts, usually in the form of comments appended to the end of your
post (but sometimes through a ratings system or an online poll). Think of it this
way: Your post gets people interested, but their comments get them invested,
which makes them much more likely to come back and check out new posts.

Who's Blogging?
Technorati, a popular blog search engine, maintains a list of
the most popular blogs at http://technorati.com/blogs/top100
and compiles statistics about the blog universe. The last time it
asked bloggers why they blog, it found the following:
• 60 percent of bloggers write for the sense of personal
satisfaction they get by sharing their worldview with
• 18 percent of people blog professionally. They're
compensated for their work, although for many it's a
supplementary source of income, not their livelihood.
Professional bloggers may be part time or full time, and
they usually blog about technology or their own musings.
• 13 percent of bloggers are considered entrepreneurs. Their
goals are similar to those of corporate bloggers (see the
next item), but they blog for a company they own.

• 8 percent of bloggers work for and write under the
imprimatur of a company. They generally talk about
business or technology, and their goals are to share
expertise, to gain professional recognition, and to lure
new clients.
Equally interesting is the question of what bloggers blog about.
The answer is everything, from travel and music to finance and
real estate, from parenting and relationships to celebrities and
current events. To dig deeper, check out Technorati's Digital
Influencer's Report from 2013 at http://bit.ly/1fSbmAT. (Quick
takeaway: 64 percent of the bloggers surveyed are making
money, but for 80 percent of them, the financial rewards total
less than $10,000 per year.)

Some sites take the basic structure of a blog and apply it to different types of content. One popular example is the photo blog, which ditches text in favor of pictures
(see Figure 1-5). Similarly, you can find plenty of video blogs that feature a video
clip in every post.

Chapter 1: The WordPress Landscape




You can put photo blogs to a
variety of uses—everything from
serious photography to lowbrow
fun. Examples of the latter
include sites like http://failblog.
org and, shown here, http://
damnyouautocorrect.com, where
each page is a screen capture
from an iPhone conversation
gone horribly wrong.

In recent years, people have become increasingly interested in super-lightweight
blogs and blog-like tools. Examples include the micro-posts on Tumblr, the short
messages on Twitter, and the pictures on Instagram and Pinterest. As you'll see in this
book, you can create a basic microblog with WordPress, too. However, WordPress
makes the most sense when you want to create something a little less casual and a
little more permanent. For example, a collection of random selfies makes sense on
Instagram, but a series of lovingly arranged, captioned photographs documenting
your trip to Iceland fits nicely into a WordPress site that uses a photo theme.



Blogging with WordPress is a slam-dunk. After all, WordPress was created as a
blogging tool (in 2003), and has since exploded into the most popular blogging
software on the planet. In fact, if you plan to create a blog, there's really no good
reason not to use WordPress. Although there are several other blogging platforms
out there, and they all work reasonably well, none of them has the near-fanatical
WordPress community behind it, which is responsible for thousands of themes and
plug-ins, and might even help you solve hosting and configuration problems (just
ask your questions in the forums at http://wordpress.org/support).



Creating a Modern Blog
Perhaps the idea of writing a blog seems a bit boring to you.
If so, you're probably locked into an old-fashioned idea about
what a blog is.
Today's blogs aren't glorified online diaries. In fact, the
best way to create an un successful blog is to chronicle your
meandering, unfiltered thoughts on everything from the Tea
Party to toe jam. Even your friends won't want to sift through
that. Instead, follow these tips to make your blog truly legit:
• Pick a topic and focus relentlessly. People will seek out
your blog if it's based on a shared interest or experience.
For example, create a blog about your dining experiences
around town, and foodies will flock to your pages. Talk
up the challenges of taking care of a baby, and other new
parents will come by and commiserate. If you're having
trouble deciding exactly what you want to accomplish
with your blog and what topics are truly blog-worthy,
WordPress has a great reference with blog brainstorming
tips at http://learn.wordpress.com/get-focused.
• Add a clever title. Once you choose your topic, give your
blog a name that reinforces it, which will also help you stay
on topic. Paul Krugman, for example, calls his blog The
Conscience of a Liberal (Figure 1-4), despite the fact that
his name is well-recognized among his target audience.
• Find a new perspective. It's a rule of the Web that

everything has been blogged before, so find a unique
angle from which to attack your topic. For example, when
Scott Schuman began his now blazingly popular blog The
Sartorialist (www.thesartorialist.com), he didn't just slap
together an ordinary fashion blog. Instead, he created a
unique commentary on real-life fashion by using pictures
he snapped strolling the streets of New York.
• Don't be afraid to specialize. You won't pique anyone's
interest with yet another movie review site called My
Favorite Movies. But throw a different spin on the subject
with a blog that finds film flaws (In Search of Movie
Mistakes) or combines your experience from your day job
as a high-school science teacher (The Physics of Vampire
Movies), and you just might attract a crowd.
• Don't forget pictures, audio, and video. Bloggers
shouldn't restrict themselves to text. At a bare minimum,
blogs need pictures, diagrams, comics, or some other
visual element to capture the reader's eye. Even better,
you can weave in audio or video clips of performances,
interviews, tutorials, or related material. They don't
even need to be your own work—for example, if you're
discussing the avant-garde classical composer György
Ligeti, it's worth the extra five minutes to dig up a
performance on YouTube and embed that into your post.
(You'll learn how to do that in Chapter 10.)

Chapter 1: The WordPress Landscape



Other Types of WordPress Sites
Blogs are fantastic, exciting things, but they're not for everyone, even if you have
a streamlined tool like WordPress at your disposal. The good news is that, because
of its inherent flexibility, WordPress makes an excellent program for building other
kinds of websites, too. In fact, as long as you're willing to do a little theme customization, you can convert your WordPress pages into something that doesn't look
one whit like a traditional blog. The following sections show you some of the types
of sites you can create.
WordPress makes a great home for personal, blog-style writing, but it's an equally
good way to showcase the more polished writing of a news site, web magazine,
short-story collection, scholarly textbook, and so on. WordPress also allows multiple
authors to work together, each adding content and managing the site (as you'll
discover in Chapter 11).

Consider, for example, the Internet Encyclopedia of Philosophy shown in Figure
1-6 (and located at www.iep.utm.edu). It's a sprawling catalog of philosophy topics
amassed from about 300 authors and maintained by 25 editors, all with heavyweight
academic credentials. Created in 1995, the site moved to WordPress in 2009 to make
everyone's life a whole lot easier.


Although WordPress
powers this website, you'll
see few of the hallmarks
of a traditional blog. The
“posts” are actually long,
subdivided articles, without dates or comments.



The Internet Encyclopedia of Philosophy is an interesting example for the sheer
number and size of the articles it hosts. However, you'll also find WordPress at work
in massive news sites, including TechCrunch, TMZ, Salon, Boing Boing, ThinkProgress,
and the CNN site Political Ticker.



How to Find Out if a Website Uses WordPress
There are plenty of websites built with WordPress, even if it's
not always apparent. So what can you do if you simply must
know whether your favorite site is one of them?
You could ask the website administrator, but if you're in a
hurry, there are two easier ways. The first is the quick-anddirty approach: Right-click the page in your browser, choose
View Source to bring up the page's raw HTML, and then hit
Ctrl+F to launch your browser's search feature. Hunt for text
starting with “wp-”. If you find wp-content or wp-includes
somewhere in the mass of markup, you're almost certainly
looking at a WordPress site.

Another approach is to use a browser plug-in, called a sniffer,
that analyzes the markup. The advantage of this approach is
that most sniffers detect other types of web-creation tools and
programming platforms, so if the site isn’t based on WordPress,
you might still find out a bit more about how it works. One of
the most popular sniffers is Wappalyzer ( http://wappalyzer.
com), which works with the Firefox and Chrome browsers.

WordPress is particularly well suited to websites stuffed full of organized content.
For example, think of a website that has a huge archive of ready-to-make recipes
(Figure 1-7). Or consider a site that collects classified ads, movie critiques, restaurant
reviews, or custom products.

The dividing line between blogs and catalogs can be a fine one. For example, you can find plenty
of cooking-themed WordPress sites that sort recipes by category and by date in a blog-style listing. However,
most catalog sites go beyond the blog in some way, and require the advanced theme customization skills you’ll
develop in Part 4 of this book.

Because WordPress relies on a database, it’s a wizard at organizing massive amounts
of content. In a properly designed catalog site, people can find a review, product,
or whatever else they want in a number of ways, such as searching by keyword or
browsing by category.

Chapter 1: The WordPress Landscape




This WordPress site
features a huge catalog of
recipes and articles that
have cooking tips. What
makes the site distinctly
different from a blog is
the fact that it doesn't
organize recipes by date,
displayed one by one in
order. Instead, it orders
them in common-sense
categories, like Meat,
Seafood, and Mushrooms.

WordPress isn’t just a great tool for self-expression, it’s also an excellent way to do
business. The only challenge is deciding exactly how you want to use WordPress
to help you out.

The first, and simplest, option is to take your existing business website and augment
it with WordPress. For example, the Ford Motor Co. uses WordPress for its news site
http://social.ford.com, which invites customers to post feedback and share the hype
about new vehicles on Facebook and Twitter. But if you head to Ford’s main site,
www.ford.com, and you search for a local dealer or ask for a price quote, you’ll be
entirely WordPress-free. These parts of Ford’s site rely on custom web applications,
which Ford’s web developers created.



Other companies do use WordPress to take charge of their entire websites. Usually,
they’re smaller sites, and often the goal is simply to promote a business and share
its latest news. For example, you could use WordPress to advertise the key details
about your new restaurant, including its location, menu, and recent reviews. Or
imagine you need more detailed information for a tourist attraction, like the detailed
website for Perth Zoo (Figure 1-8).



The Perth Zoo website has
it all—detailed menus, information about animals,
a review of the zoo's
policies, and up-to-date
news. But there's a catch:
To make this website look
as beautiful as it does,
the designers needed
to combine WordPress
knowledge with some
traditional web design
skills (including a good
knowledge of HTML and

Chapter 1: The WordPress Landscape



What Makes a Catalog Site
Catalog sites are also known by many other names. Some
people describe them as content-based sites; others call them
CMS sites (for “content management system,” because they
manage reams of information). No matter what you call them,
the sites share a few key characteristics:
• They include a large volume of content. If you want to
create a recipe site with just four recipes, it probably
wouldn't be worth the WordPress treatment.
• The content can be divided into separate pages. With
a blog, the “pages” are actually blog posts. In a recipe
site, each page is a recipe. (And in the Encyclopedia of
Philosophy shown on page 12, each page is a lengthy
scholarly article.)
• Each page consists of text, images, and/or video. Usually,
pages are stuffed with text. Often, they're enriched with

pictures and video. That's where WordPress shines. It's
less adept at displaying reams of numeric data, like the
last 12 years' worth of sales at your chain of mattress
• Visitors browse the content by category. You categorize
pages by their subject matter. Visitors use those
categories to find exactly what they want—like a recipe
for a specific ingredient. Often, guests get to what they
want by clicking through a slick, multilayered menu.
These criteria encompass a surprisingly huge range of modernday websites. Examples include event listings for festivals, a
portfolio of your work, a list of products you sell, and so on.
Pretty much everywhere there's a mass of text or pictures that
needs to be categorized and presented to the world, WordPress
is there, making itself useful.

A greater challenge is when a business doesn't just want to advertise or inform with
its website, but it also wants to do business over the Web. For example, imagine
you create a site for your family-run furniture store, like the one shown in Figure
1-9. You don't just want to advertise the pieces you offer; you want to take orders
for them, too, complete with all the trappings typical of an ecommerce website
(such as a shopping cart, a checkout page, email confirmation, and so on). In this
situation, you need to go beyond WordPress's native features and add a plug-in to
handle the checkout process.
For some small businesses, an ecommerce plug-in offers a practical solution. But for
many others, this approach just isn’t flexible enough. Instead, most ecommerce sites
need a custom-tailored transaction-processing system that integrates with other
parts of their business (like their inventory records or their customer database). This
functionality is beyond the scope of WordPress and its plug-ins.

To see more examples of what you can do with WordPress, including plenty of business sites, visit the
WordPress showcase at http://wordpress.org/showcase.





On this furniture website,
you can view the chairs
for sale, their prices, and
their dimensions. All this
is possible with WordPress's standard features
and a heavily customized
theme. But if you want
to allow online ordering,
you need to use a plug-in
from a third party.

WordPress Hosting
If you've reached this point, it's safe to say you're on board with WordPress. Now
you need to decide exactly where you'll put your WordPress site.
The simplest (and cheapest) option is to sign up for the free WordPress.com service,
which is run by the fine folks at Automattic (founded by a guy named Matt Mullenweg, hence the “matt” in the company name). The deal is simple: They give your
website a home, some exposure, and a free web address that ends in .wordpress.
com (although you can buy a custom domain name if you want), and you accept a
few limitations—most notably, your website can't show ads or use other people's
plug-ins, and you can't edit your theme by hand.
NOTE The people at Automattic are also largely responsible for (but not completely in control of) the development of the WordPress software. That's because Automattic employs many of WordPress's lead developers.
However, WordPress is still a community-driven, open-source project.

Your other hosting option is to install WordPress on your web host's server and
build your site there. The drawback here is that you need to pay your web host.
And although you won't be on the hook for much coin—good plans run just a few

Chapter 1: The WordPress Landscape



dollars a month—you still need to open your wallet. Generally, WordPressers call
this approach self-hosting, even though someone else actually does the hosting. In
other words, you're not running a web server in your basement; you're contracting
with a web hosting company for some space on its servers.
NOTE Although the WordPress nomenclature is a bit confusing, the real story is simple. WordPress is the
software that powers all WordPress sites. (Sometimes, people call the software WordPress.org, because that's
the web address where you download the program.) On the other hand, WordPress.com is a free web hosting
service that uses the WordPress software. So no matter where you decide to host your site—through WordPress.
com or on your own web host—you'll be using the WordPress software.

Choosing Where to Host Your Site
If WordPress.com is so eager to give you a free, reliable web host, why wouldn't you
use it? Here are a few good reasons to consider self-hosting instead:
• You want to create a site that isn't a blog. In this chapter, you've seen plenty
of examples of websites, from webzines to recipe catalogs to slick business
sites. Many of those sites are more difficult to create with WordPress.com (if
not impossible). That's because WordPress.com prevents you from editing the
code in your theme, or from using a theme that isn't in WordPress.com's preapproved list of about 200 themes.
• You already have a website. With most third-party web hosts, you won't have
to pay extra to add a WordPress site. And if you already have a web presence,
it makes sense to capitalize on the domain name (that's your web address, like
www.PajamaDjs.com) and the web space you already have.
• You want complete control over your site's appearance. If you're the sort of
person who can't sleep at night unless you get the chance to tweak every last
WordPress setting, you definitely want the free rein of a self-hosted site. With
it, you can choose from thousands of site-enhancing plug-ins and a universe
of custom themes.
• You want to make money advertising. Ordinarily, WordPress.com doesn't
allow its sites to display ads or to participate in affiliate programs (where you
send traffic to a retailer, who shares any resulting revenue with you). However,
WordPress.com is in the midst of a pilot program called WordAds, which allows
a limited type of advertising, provided your site is accepted into the program.
You can learn more and apply at http://wordpress.com/apply-for-wordads.

Even though you can't run standard ads on WordPress.com, you can still make money there. WordPress.
com is perfectly fine with a website that promotes a particular product or business, includes a PayPal-powered
Donate button, or advertises your own personal fee-based services.



• You don't want your readers to see ads, ever. WordPress.com is a bit sneaky
in this regard. In some cases, it will insert an ad into one of your pages. This
usually happens when someone stumbles across your site from a search engine.
It doesn't happen if a visitor surfs from one WordPress.com site to another, or
if a visitor is logged in with a WordPress.com account. For these reasons, you
might never notice the ads that other people could see. If this behavior bothers
you, you can remove the ads from your site, but you need to pay WordPress.
com a yearly fee (currently, $30 per year).


NOTE WordPress.com isn't necessarily as free as you think. In addition to paying for ad-free pages, you
can opt (and pay) for a personalized web address, the ability to edit the fonts in your theme, and extra space for
big files and hosted video. You can get information about all these upgrades at http://support.wordpress.com/
upgrades. It's worth noting that self-hosters get virtually all these features through their own web hosts, so if
you plan to buy several upgrades, you should at least consider getting your own web host instead—it may end
up costing you less.

In general, self-hosting is a slightly more powerful and more expensive strategy than
hosting with WordPress.com. But there are reasons why people actually prefer to
use WordPress.com rather than self-host:
• No-headache maintenance. If WordPress.com hosts your site, all the website
maintenance is taken care of. You don't need to think about installing patches
or WordPress updates, or making backups of your site.
• Better discoverability. If your site is on WordPress.com, people can stumble
across it in two ways. First, they can browse the giant index of popular subject
tags at http://wordpress.com/tags, and pick one you use in your posts. Second,
if you write a particularly popular post, your site may appear in the “Blog of the
Day” list that WordPress.com features prominently on its front page (http://
wordpress.com), and attract a click-storm of new traffic.
• Reliability. It's not hard to find a good web host that has solid WordPress support. That said, no one serves as many WordPress sites as WordPress.com—it
uses over 1,000 web servers to hand out billions of WordPress pages every
month. That means that if a page on your WordPress site suddenly goes viral
with a burst of popularity, WordPress.com will handle the challenge, while a
less able web-hosting service could buckle.

Chapter 1: The WordPress Landscape



What WordPress.com Won't Allow
It probably comes as little surprise that there are some types
of websites that WordPress.com doesn't welcome. Here are
the problem areas:
• Spam. If you create a website for the sole purpose of
attracting clicks for another site, artificially inflating
another site's Google search ranking with spurious links,
promoting “get rich quick” schemes, or showing ads,
WordPress will wipe it off the Web in minutes.
• Copyright violation. If you create a site that includes
content owned by someone else and you don't have
permission to use it, WordPress has the power to yank
your site. Copyright (and other) complaints are made at
http://wordpress.com/complaints .

• Masquerading. It's not acceptable to create a blog where
you pretend to be someone else.
• Threats or criminality. If your blog threatens another
real-life person, incites violence, or promotes an
illegal scheme, you obviously aren't a nice person, and
WordPress won't want you.
You'll notice that there's one oft-censored site type missing
from this list: namely, those that include sex, erotica, or pornography. It turns out that WordPress.com is mostly OK with
that, but it will slap “mature” blogs with an adults-only warning, and it won't include them in its home page or tag directory.

WordPress.com Sites vs. Self-Hosted Sites
Struggling to keep all the details about WordPress.com and WordPress.org in mind
at once? Table 1-1 summarizes the key differences. Remember that the WordPress
program is packed with functionality, and the table leaves out the long list of features that work equally well in WordPress.com and on self-hosted WordPress sites.
TABLE 1-1 Comparing WordPress.com and self-hosted sites





Pay as little as possible.

The starting cost is free, but
various enhancements cost

You pay the cost of web
hosting. That's typically $5
to $10 per month, unless
your site is wildly popular, in
which case you need to pay
your host double or more to
get a plan that ensures good
performance during times of
high traffic (see the box on
page 51).

Forget all about web server


No, you need to back up
your content regularly, and
update plug-ins and themes
with new versions (but
fortunately both jobs are
pretty easy).





Use a custom website
address (like www.myName.

Yes, but it requires an
upgrade ($18 to $25 per

Yes, but you must buy it
through your web host or a
domain registrar.

Get good-looking, readymade themes.

Yes, you can choose from
about 200 themes (and the
list is growing).

Yes, you can choose from
more than 2,000 free themes
(and the list is growing).

Change the layout of your
theme and add new widgets.

Yes (although you're
limited to the widgets that
WordPress.com approves).

Yes (and you can get
more widgets by installing

Edit the styles (fonts and
formatting) in your theme.

Yes, but it requires an
upgrade ($30 per year).


Change the code in your
theme files.



Create a non-blog site.

Yes, if you can find a suitable
theme, but there are many


Show pictures and videos.

Yes, but it costs extra if you
want to host the video files
on your website, instead
of through a service like
YouTube or Vimeo.

Yes, but you'll probably still
need a hosting service like
YouTube or Vimeo for your

Make money with ads.

No, unless you're accepted
into WordPress's WordAds
program (which has its own


Keep ads off your site.

Yes, but it requires an
upgrade ($30 per year).

Yes (there are no ads, unless
you put them there).

Let multiple people post on
the same site.



Create multiple sites.

Yes (but if you buy any
upgrades, you need to buy
them separately for each


Create a multisite network
that allows other people to
create their own personal



Use WordPress plug-ins to
get even more features.


Yes, you can choose from
a staggeringly large and
ever-expanding collection of
about 30,000 plug-ins.

Get help with your problems.

Yes, through the forums at

Yes, through the forums
at http://wordpress.org/

Chapter 1: The WordPress Landscape




Overall, the best advice is this: If you're a keen WordPress fan with a bit of curiosity,
a smattering of computer experience, and a willingness to experiment (and if you've
picked up this book, you almost certainly fit that description), you'll be happiest
self-hosting WordPress.
However, if you don't have a web host and you're a bit overwhelmed, it's a perfectly
good idea to start with WordPress.com. You can always migrate to a self-hosted
WordPress site later on, and Appendix A, “Migrating from WordPress.com,” describes exactly how to do that. The only recommendation with this strategy is that
you buy your own domain name from the get-go, as described on page 24. That
way, should you move to a self-hosted WordPress site, you can keep the address
you used when you were at WordPress.com, and you won't lose the audience you
spent so long building up.


Managed Hosting


There is one other, relatively new type of WordPress hosting
that's geared to less experienced site developers who don't
want to mess with WordPress administration, but want more
features and flexibility than WordPress.com offers. It's called
managed hosting.

site recovery (repairing your site after a spammer hijacks it).
You might even get tools to promote your site and a techy support person to install your plug-ins for you. Plans for small- to
medium-sized sites start at around $30 per month, but heavily
trafficked sites can pay hundreds of dollars a month.

If you sign up for a managed hosting plan, your web hosting
company provides you with a domain name and some web
hosting space, just like you'd get with a self-hosted site. However, managed hosting companies also add WordPress-specific
services like automatic updates, daily backups, caching, and

You can learn more about managed hosting by checking out
some of the web hosts that provide it, such as WP Engine
( http://wpengine.com) and Synthesis ( http://websynthesis.



Signing Up with



n Chapter 1, you took a big-picture look at WordPress and the sites it can build.
Now you’re ready to partner with WordPress and start building your own web

But not so fast. Before you can create even a single WordPress-powered page, you
need to decide where to put it, and, as you found out in Chapter 1, WordPress gives
you two perfectly good choices:
• The WordPress.com hosting service. This is a wonderfully free and supremely
convenient service for web authors who want to build an ordinary blog and can
live with a few limitations.
• Self-hosting. This option requires you to set up WordPress on your own web
host, which is a little bit more work (but still not much hassle). Self-hosted sites
are more powerful and flexible than WordPress.com-hosted sites—they let you
show ads, use plug-ins, and create completely customized pages that go far
beyond ordinary blogs.
In this chapter, you’ll get started with the first choice: using WordPress.com. But
if you’d prefer to give self-hosting a whirl, skip this chapter and jump straight to
Chapter 3. No matter which route you take, the paths converge in Chapter 4, where
you’ll begin adding content, refining your site, and developing the skills of a true
WordPress wizard.




If you’re still divided between the convenience of WordPress.com and the flexibility of a self-hosted
site, you can review the key differences on page 20. Or you can leave both doors open: Start with a WordPress.
com website and buy a domain name (your own custom web address), as described in this chapter. That way,
you can switch to a self-hosted site in the future if you outgrow WordPress.com.

Choosing a Web Address
As you already know, a web address is a short bit of text, like www.SuperStyleFreak.
com, that someone types into a browser to get to your site.
The most essential part of a web address is the domain name (often shortened to
just domain), which points to the web server where your website exists. For example,
consider the website address http://WineSnobs.com/exotic-cocktails. The first part
of the address, http://, indicates that the URL points to a location on the Internet,
which uses a networking technology called HTTP. The second part of the address,
WineSnobs.com, is the domain name. And the last part, /exotic-cocktails, points to
a specific page on the WineSnobs.com domain. Clearly, the domain is the most important part of the equation, because it identifies the central hub for all your pages.
Before you sign up with WordPress.com, you need to give some serious thought
to the domain name you want to use. That’s because WordPress.com gives you a
choice: You can buy your own domain name, or you can use a WordPress.com freebie.
Here’s the catch: If you get a free domain name from WordPress.com, it will have
.wordpress.com appended to the end of it. That means you’ll end up with an address
like WineSnobs.wordpress.com. But if you pay WordPress.com a small yearly fee of
about $18, you can buy a custom domain name that doesn’t have this limitation—say,
WineSnobs.com. And while there’s nothing wrong with a web address that ends
in .wordpress.com, a custom domain name can be beneficial for several reasons:
• Names matter. A catchy web address is easier for visitors to remember, and
a clever name can attract more visitors to your site. If you’re willing to buy a
custom domain name, you’ll have more naming choices, and your web address
will probably be shorter and snappier.
• You may not want to advertise WordPress. In some circles, using WordPress
is a badge of honor. But in other fields, it could make your site seem less professional. For example, victoriassecret.wordpress.com doesn’t leave quite the
same impression as the real site address.
• Custom domain names are more portable. This is usually the most important
consideration. If you go with a free name and decide later to move your WordPress site to a different host, you’ll need to change your domain name. (For
example, you might go from WineSnobs.wordpress.com to www.WineSnobs.
com, assuming www.WineSnobs.com is even available when you make the
move.) Changing your domain name risks severing the relationships you built up
through your original .wordpress.com address. It also breaks any links on other



sites that point to your site, and it confuses the visitors who have bookmarked
your old site. And if all that’s not bad enough, you’ll lose the hard-earned Google
search ranking that helps your site show up in web searches, too.


When you’re just starting out, it’s easy to underestimate the likelihood of migrating
to a custom web host and the headache of changing your domain name. But life
happens, people change, and many die-hard WordPress.com bloggers eventually
move to a do-it-yourself web host so they have more flexibility in what they can
do on their site. For all these reasons, we strongly suggest that you buy a custom
domain name for your WordPress.com blog at the outset. If you do, you’ll be able
to keep your domain name forever, even if you switch to a different web host. You’ll
simply need to transfer your domain to your new host (as explained in Appendix A).

Keep in mind that using a custom domain name or a domain name that you own doesn’t avoid any
of the other limitations that hosting with WordPress.com imposes (see page 20). For example, you still won’t be
allowed to place ads on your site or to use plug-ins.

Before you continue, take a moment to determine your domain name strategy. If
you’re a technophobic sort and you positively, absolutely don’t plan to move to a
self-hosted site—ever—you can choose a good .wordpress.com address and forget
about the rest. However, paying a little extra for a custom domain name is almost
always worth the trouble. Think of it as a bit of added insurance for whatever the
future might hold.
Assuming you do want a custom domain name for your WordPress site, you can get
one in two ways. The most common method is to buy your domain name when you
sign up with WordPress.com, as you’ll learn to do in the next section. At the time
of this writing, WordPress.com charges $18 per year for most custom domains but
increases the price for some specialty domains (for example, .me and .co domains
cost $25 per year).
Another option is to use a domain name that you’ve already bought from a domain
registrar. For example, you might have registered a domain name in the past, just
to make sure no one else got hold of it. Or you might have bought a domain when
you signed up to host your site with another company. For instance, if you bought
the domain SuperStyleFreak.com a few months back, you can ask WordPress.com
to use this web address when you create your blog. If you opt for this arrangement,
you need to pay your original web host to maintain the domain registration (which
typically costs about $10 a year) and you need to pay WordPress.com to use the
domain (currently $13 per year). You also need to perform a bit of extra setup after
you sign up with WordPress.com. The whole process is described on page 44.

Chapter 2: Signing Up with WordPress.com



Creating Your WordPress.com Account
Once you’ve got a basic idea about the identity of your blog and you’ve picked
some potential names for the website address, you’re ready to create your site. The
following steps take you through the process:
1. In your browser, travel to http://wordpress.com , and click the “Sign up
now” link. (Or, for a shortcut, head straight to the sign-up page at http://
The all-in-one sign-up form appears (Figure 2-1).


If you’ve ever stumbled
through eight pages of
forms to buy something
online, you’ll appreciate
WordPress.com’s singlepage signup. You need to
supply just four critical
pieces of information: a
website address and your
user name, password, and
email address.

2. Fill in your email address.
WordPress uses your email address to send its activation message when you
finish signing up. If you don’t enter a valid email address, you won’t be able to
activate your account and start blogging.
3. Choose a user name.
You use your user name and password to log into WordPress when you want to
add new posts or manage your site. Sometimes, WordPressers use part of their
blog name for the user name (for example, if your blog address is lazyfather.
wordpress.com, your user name might be lazyfather).
WordPress has some rules about user names. You need at least four characters,
which can use a combination of numbers and lowercase letters only. If someone
already has the user name you want, a brief message appears under the user
name box stating, “Sorry, that user name already exists!” It’s up to you to pick
something unique before you continue.




Not only does your user name become part of the login process, it’s also the name WordPress uses
as your display name, which is the name that appears at the end of your blog posts and in the comments you
leave (among other places). However, you can easily change your display name to something more suitable, as
described on page 374.


4. Choose a password.
Take the time to pick a password that’s different from the passwords you use on
other sites, not found in the dictionary, and difficult to guess. If you’re not sure
how to do that—or why you should bother—check out the box below.

A WordPress Password Is More Than a Formality
WordPress websites are commonly attacked by hackers looking
to steal traffic or to stuff in some highly objectionable ads.
The best way to avoid this danger is with a strong password.
With enough tries, web evildoers can guess any password
using an automated program. But most human WordPress
hackers look for common words and patterns. If you use
your first name (ashley), a string of close-together letters on
the keyboard (qwerty, qazwsx), or a single word with a few
number-fied or symbol-fied characters (like passw0rd and
pa$$word ), be afraid. These passwords aren’t just a little bit
insecure, they regularly make the list of the world’s 25 most
stolen passwords. (For the complete list of bad passwords,
check out http://onforb.es/v2rdOb.)

That doesn’t mean you need a string of complete gibberish to
protect your site. Instead, you can deter casual hackers (who
are responsible for almost all WordPress attacks) by taking
a reasonably unique piece of information and scrambling it
lightly. For example, you can use a favorite musician (HERBeeHANcock88), a movie title (dr.strangel*ve), or a short sentence
with some vowels missing (IThinkThrforIM ).
It’s acceptable to write your password down on paper and
tuck it in a desk drawer—after all, you’re not worried about
family members or office colleagues, you’re concerned with
international spammers, who certainly won’t walk into your
office and rifle through your belongings. (However, it’s still a
bad idea to put your password in an email or text message.)

5. Type the website address you want into the Blog Address box.
If you want to use a free .wordpress.com domain, type in the first part of the
name (for example, “RebelPastryChef” for the domain RebelPastryChef.wordpress.com). Your address needs to have at least four characters.
If you want to buy a custom domain, which gives you the flexibility to move
to a self-hosted site later, click the drop-down arrow to the right side of the
Blog Address box. Then pick the top-level domain—that’s the final part of your
domain name after the period, such as .me, .com, .net, or .org. Once you do
that, type in the first part of the domain name, like “RebelPastryChef” to get
the domain name RebelPastryChef.me. (As you probably already know, capitalization is unimportant in a domain name, so there’s no difference between
RebelPastryChef.me and REBELpastrychef.ME, for instance.)
As explained earlier, if you already own a custom domain name, you can use
that for your new WordPress blog. To make this work, you need to go through
a process called mapping. The first step is to pick an ordinary .wordpress.com

Chapter 2: Signing Up with WordPress.com



website address. You then associate this to your custom domain name after you
finish the sign-up process, by visiting the WordPress.com store and following
the steps on page 44. In this situation, the .wordpress.com website address
that you pick isn’t terribly important, but you may as well try to get one that’s
similar to your domain name.
NOTE For almost all websites, the www prefix is an acceptable but optional part of the domain name.
In other words, RebelPastryChef.me and www.RebelPastryChef.me are equivalent. Some people think that it’s
simpler, cleaner, and more modern to leave out the extra letters at the beginning, and WordPress.com agrees. As
a result, if you register a domain through WordPress.com, the www prefix never appears. If you insist on typing
the www part into a browser, you’ll get to the right site, but WordPress will strip the prefix out of the browser’s
address bar (changing www.RebelPastryChef.me to RebelPastryChef.me, for example).


Domain Name Frustration
The only disadvantage to buying your own domain name is
that it can be hard to find one that’s both good and available.
You may think that most of the best .wordpress.com addresses
have been snapped up already, but that’s nothing compared
with the competition for top-level .com domains. So while it’s
easy enough to decide to buy your own domain name (which
is always a good idea), it’s a bit harder to actually find one.
Here are some tips that can help:
Incorporate your business name. Domains that are just
combinations of popular words ending in .com (like DeliciousChocolate.com, ThoroughbredHorses.com) are almost certainly
taken. Mix it up with your business name ( DelilasChocolates.
com, AcmeThroughbredHorses.com), and you stand a much
better chance.
Think quirky. If you’re creating a new blog, you can afford to
try out unusual-yet-catchy word combinations that capture

the spirit of your writing but have been overlooked by the
rapacious domain name sharks. Possibilities include ThatThingIsWeird.com, WhyCantISpell.com, and DieAutoTuneDie.com .
They may be a bit odd and a bit long, but they’re catchy choices,
for the right site.
Settle for a less common top-level domain. The top-level
domain is the final few letters of a domain name, after the
last period. The most popular top-level domain is .com, but
it’s also the most competitive. You’ll find many more options if
you’re willing to settle for .org (which was originally intended
for noncommercial websites but no longer has any restriction),
.net , or the relatively new and catchy .me. For example, at the
time of this writing, wickedcode.com is taken, but wickedcode.
me is available. But be careful—the last thing you want is a
potential visitor accidentally adding .com to the end of your
address and ending up at your competitor’s site.

6. Wait while WordPress checks to see if your domain name is available.
A few seconds later, it reports the answer (Figure 2-2). If your first choice isn’t
free, try a variation or change the top-level domain using the drop-down list on
the right. Finding a good domain name requires equal parts effort, creativity,
and compromise.





Top: Money can’t buy you
lazydad.com; it’s already
in someone else’s hands.
Below the gentle rejection,
WordPress suggests some
names that aren’t taken,
like lazy-father.com (with
a hyphen).
Bottom: Change the
top-level domain to .me,
and you get happier news:
your site can still grab the
domain lazydad.me.

7. Scroll down to the table at the bottom of the page, which describes the
different types of WordPress.com accounts (Figure 2-3).
WordPress.com gives you the choice of three account types:
• WordPress.com Beginner. This gets you a free WordPress.com blog, with
all the essential features. If you’re not sure which account to choose, this
one is the best starting point. If you still need a bit more, you can buy individual upgrades (like the highly recommended Custom Domain upgrade,
for a reasonable $18 a year).
• WordPress.com Premium. Formerly called the WordPress Value Bundle,
this option includes the same world-class free blogging engine as the
WordPress.com Beginner account and a handful of small upgrades. While
several of these enhancements are worthwhile, the overall package doesn’t
quite justify its $99 price tag for most people (see the box on page 33 for
a more detailed analysis).
• WordPress.com Business. This choice has the same features as a WordPress.com Premium account, with a few more frills thrown into the mix, like
the ability to get live chat technical support. Unfortunately, you’ll pay for
these modest improvements with a hefty $299 a year fee.

Chapter 2: Signing Up with WordPress.com




Businesses don’t need a Business account. WordPress.com has the same rules for all account types,
and these rules let you describe and promote your business on your blog. However, if you’re trying to make money
by showing ads, you’ll run afoul of the WordPress.com rules no matter which account type you choose.


WordPress’s Premium
and Business accounts
bundle together several
upgrades, each of which
is available separately for
a modest yearly fee, into
an even cheaper package.
The only catch is that
you probably don’t need
all the upgrades these
bundles include.

8. Click the Create Blog button. Or if you’re buying one of the two enhanced
types of WordPress.com accounts, click the corresponding Upgrade button instead.
TIP WordPress is flexible. You can start with a WordPress.com Beginner account and upgrade to an enhanced
account later (for the same price as WordPress offers at signup). Or, you can buy a WordPress.com Beginner account and add just the individual services you need, whenever you need them. You make these purchases in the
WordPress.com store, as outlined on page 42.

The initial stage of your account setup is complete. What WordPress does next
depends on whether you chose to buy a domain name.
9. If you chose a free .wordpress.com domain in step 5, WordPress invites you
to do a bit of blog customization (Figure 2-4).
To help you get a jump-start on your blog, WordPress leads you through a series
of pages that request more information. Although this step is optional, you can
save time later by supplying three key details now: the title you want to use for
your blog, a descriptive tagline that will be displayed just under your title, and
a theme that will set the visual style of your entire site.





The more information
you provide now, the
less customization you’ll
need to do later. As you
step through this series of
pages, WordPress collects
the title and tagline for
your blog (shown here),
lets you pick the theme
you want, and invites you
to spread the word on
Facebook and Twitter.

TIP The best starting theme for learning WordPress is the clean and streamlined Twenty Twelve theme. It
starts simple and has room for plenty of customization. It’s also the theme you see in the first examples of this
book. (Don’t be put off by the out-of-date sounding name, which simply reflects when WordPress first released
the theme. Twenty Twelve remains a popular classic to this day.)

10. If you picked a custom domain name (in step 5), WordPress ends the signup process by presenting you with a domain registration form (Figure 2-5).
Fill in your contact details and click Register Domain.
This registration information includes your name, postal address, and email
address. WordPress submits this information, on your behalf, to the Domain
Name System (DNS)—a key part of Internet bookkeeping that tracks who owns
each piece of web real estate.

Chapter 2: Signing Up with WordPress.com




Here’s the information
you need to register
lazyfather.net. Use the
checkbox at the bottom
of the screen to keep this
information hidden from
spammers’ prying eyes,
a good use of the $8 it




Premium and Business Accounts
Should I pay for an upgraded WordPress.com account with
more features?
Just before you sign up, WordPress.com attempts to seduce
you with its Premium and Business accounts. These bundles
combine several WordPress upgrades, each of which normally
costs a yearly fee, into a slightly cheaper package.
But before you plunk down any cash, you need to review
whether these bundles are worthwhile. The most popular
package, WordPress.com Premium, combines five upgrades
and adds email tech support. One upgrade is the highly recommended custom domain option (normally $18/year). Two
more upgrades are good, but not essential, enhancements.
They include the Custom Design upgrade, which gives you the
ability to edit the styles in your chosen theme (page 457) and
the No Ads upgrade, which prevents WordPress from showing
any advertisements on your site. (Even without the No Ads
upgrade, your visitors may not see ads, because WordPress
uses them only occasionally and never shows them to people
logged into WordPress.com.) Altogether, these improvements
total about $78 a year, if you were to purchase them separately.
The final two upgrades included with WordPress.com Premium
are additional space (for hosting very big files) and VideoPress

support (for video files). These upgrades may appeal to you
if you plan to show videos on your site, but most people find
it cheaper and easier to host videos using a free service like
YouTube, by simply embedding a YouTube video window on
their WordPress pages (see page 350 to learn how). VideoPress
is a more specialized option that may appear if you plan to show
content that isn’t suitable for YouTube—for example, videos
that run longer than YouTube’s 15-minute limit, or videos that
visitors can download. You’ll learn more about VideoPress on
page 358. If you don’t need these features, the $100-a-year
cost isn’t much of a bargain.
The WordPress.com Business account has the same features
as a WordPress.com Premium account, with even more space,
the ability to get live chat technical support, and unlimited
premium themes. Most premium themes run between $20
and $80, so the WordPress.com Business account may make
sense if you plan to create several sites, or if you just want to
experiment with many theme options. That said, WordPress.
com has a solid selection of free themes, so it’s worth waiting
to see if these can satisfy your site before you shell out the
pricey $300-a-year fee.

Domain name registration is public, which means that anyone with an Internet
connection can look up your domain and find out that you own it. (Interested
parties also get your phone number and email address.) Usually, this isn’t a
problem, but it does provide an opening for spammers to hassle you. If you
don’t want your public details exposed, don’t try to fake them with incorrect
information. Instead, tick the box that says “Make my personal information
private for this registration.” It costs an extra $8, but it gives you guaranteed
anonymity—at least until you start posting.
Finally, WordPress asks you to pay up. Fill out your payment information and click
the “Purchase and Register Domain” button. WordPress will email you a receipt.

Chapter 2: Signing Up with WordPress.com




WordPress doesn’t provide an email service. So if you buy the domain lazyfather.net, you can’t get email
at joe@lazyfather.net. However, WordPress does let you forward email from your custom domain to another
email address. For example, it can automatically redirect mail sent to the custom domain joe@lazyfather.net to
a personal account like joe_symes23@gmail.com. If you want to use WordPress.com’s redirection service, you
can find instructions at http://support.wordpress.com/email-forwarding.

11. Check your email for an activation message from WordPress. The message
includes a button named Confirm Email Address or Log In. Click the button
to activate your site.
Clicking the button launches your web browser and sends you to http://wordpress.com, the central administration station for all the blogs you create with
WordPress.com. You’ll learn your way around in the next section.

Managing Your New Site
Once you complete the sign-up process and activate your account, you’re ready to
do just about everything else.
The easiest starting point is the http://wordpress.com home page, where you can
read other people’s blogs and manage your own. Once you get there, type in the
user name and password you picked when you signed up, and then click Sign In.
You’ll find yourself in WordPress.com’s central hub (Figure 2-6).





The http://wordpress.
com website provides a
central hub for following
the WordPress.com community and working on
your own blogs. The site
has four main areas, and
you move from section to
section using the buttons
at the top of the page.

Initially, WordPress starts you at the Reader page, where you can keep track of your
favorite blogs and hunt for new ones (page 39). But the best jumping-off point for
a newly minted WordPress.com administrator like yourself is the My Blogs page.
There, you’ll see a list of all the blogs you’ve created so far, which at this point is just
one (Figure 2-7). Next to each blog are a set of handy management links, as well as
a shortcut for adding a new post to your blog.

Chapter 2: Signing Up with WordPress.com




Right now, you’ve created
just one WordPress.com
blog. In this example,
it’s named My Blog and
it lives at the WordPress.
com address lazyfather.


Adding More Sites
There’s no need to limit yourself to a single WordPress.com
site. In fact, every WordPress.com user is allowed to create an
unlimited number of sites.
To add a new site, you use the My Blogs page, which lists all
the WordPress sites you created so far. To add a new one, click
the Create a New Blog button. You’ll have to supply the same
information you entered when you created your first blog,
including a website address (a free .wordpress.com domain or
a custom domain you purchase) and a blog name. You won’t
need to supply a new user name or password, because you
already have a WordPress.com account.


If you’ve invested in some WordPress.com upgrades, adding
sites can get expensive. That’s because you need to buy each
upgrade separately for every site that uses it. So if you create
two sites and you want to fine-tune the CSS style rules for
each, you need to buy two Custom Design upgrades for a total
of $60 per year.
You can’t delete any of your WordPress.com sites from the
My Blogs tab. Instead, you need to visit the dashboard, the
administrative hub you’ll explore in Chapter 4. Once you’re in
the dashboard, you can remove the current site by choosing
Tools→Delete Site from the left-side menu.


To visit your newly created WordPress.com blog, click its name on the My Blogs
page. WordPress opens a new browser tab to show you the current state of your
mostly blank site (Figure 2-8).



When you create a new
site, WordPress.com adds
a single dummy post with
some basic instructions
in it. Although it doesn’t
look like much, this
shell of a site has all the
infrastructure you need to
build a genuinely useful
WordPress site, which
you’ll learn to do starting
in Chapter 4.

When you visit your site, take a moment to review the URL that appears in the
browser’s address box. If you chose to go with a free .wordpress.com domain (like
lazyfather.wordpress.com), this is the address you’ll see there. If you purchased a
custom domain, your new domain won’t be working just yet, but WordPress.com will
assign you a similar temporary .wordpress.com domain. For example, if you bought
mysticalpeanuts.net, WordPress.com will start your site out at mysticalpeanuts.
wordpress.com (or, if that’s not available, it adds the top-level domain into the name
to come up with a slightly more awkward version of the address, like mysticalpeanutsdotcom.wordpress.com).
Most of the work you’ll perform with your WordPress site takes place at the dashboard, an administrative web interface that you can use to add posts, configure styles
and settings, and much more (see Figure 2-9). To get there, click the Dashboard
link that appears under your site on the My Blogs page. Incidentally, almost all the
other links there also take you to the dashboard; they simply navigate to a specific
section of it. For example, if you click Posts you’ll wind up at the Posts section of

Chapter 2: Signing Up with WordPress.com



the dashboard, which you’ll study in detail in Chapter 4. The only exception is the
Stats link, which shows you the visitor traffic and other statistics for your WordPress.
com sites (just as if you clicked the Stats link at the top of the page, just between
Reader and My Blogs).
NOTE You’ve just learned the simplest way to visit the dashboard for your site: Log into WordPress.com,
click My Blogs, and then click the Dashboard link. However, there’s a shortcut that lets you jump straight to the
dashboard without going through WordPress.com. Just type in the web address for your blog, with /wp-admin
added at the end. For example, to manage lazyfather.wordpress.com, you’d go to lazyfather.wordpress.com/wpadmin. (WordPress will ask you to sign in with your user name and password if you aren’t already logged in.)


In the dashboard view,
a menu of commands
runs down the left side
of the screen, arranged in
groups. You use the different parts of this menu
to accomplish different
tasks, from creating new
posts to reviewing spam
comments. You’ll spend
plenty of time touring the
dashboard in the chapters
to come.

Exploring the WordPress.com Community
Once you have your very own WordPress site, you’re also a member of the WordPress.
com community. Warm and fuzzy feelings aside, the connections and exposure you
get through the community can have real benefits, particularly if your WordPress.
com site is a straight-up, traditional blog. These benefits include the following:



• Ideas. No site exists in a vacuum, especially not a blog. By looking at other
people’s work, you can tune in to a powerful source of inspiration for both content
and style. On the content side, you can discover trending topics and popular
subjects (using the Freshly Pressed tab and Popular Topics link described in the
next section, for example). Then, you can join in on the conversation by giving
your own spin on hot topics on your blog. On the style side, you can see how
other people polish themes and perfect their layouts, and you can use that
insight to improve your own site.


• Promotion. As in the real world, one of the most successful ways to make friends,
attract attention, or score a new job is by networking with other, like-minded
people. When you find other blogs that tackle the same issues as yours, you
can exchange links and create a blogroll that connects their sites to yours (page
228). Or you can increase your exposure by commenting on someone else’s
posts (on their blog) or publishing a full reply post (on your blog). Eventually,
these practices can attract many more visitors to your site.
With that in mind, you’re ready to survey the field. Start at the WordPress.com front
page (http://wordpress.com). If you aren’t already logged in, fill in your user name
and password and then click Sign In.
You start at the Reader page. However, unless you’ve already subscribed to someone else’s blog, you won’t see any content there. Instead, you have to search for
what you want.
There are several ways to track down WordPress.com content that might interest you:
• Browse the recommended blogs. On the Reader page, click the “blogs we
recommend” link that appears in the first bullet point. You can then click a category that interests you (like Popular Culture & Entertainment or Photography
to see a short list with some of the best blogs on the subject. Click a blog’s
name to view it in a separate tab. WordPress.com is willing to recommend only
a very small set of blogs, so this approach won’t get you very deep into the
WordPress.com community.
• Read the Freshly Pressed page. The best place to get a sense of the chatter
on WordPress.com is the Freshly Pressed page. It shows a cross-section of the
day’s most attention-grabbing posts (Figure 2-10). Click a post that interests
you to read the full article and continue on to the blog that hosts it.
• Hunt for interesting posts by keyword. When WordPress bloggers create
a new post, they add a few descriptive words, called tags, to classify it. Tags
give you a way to home in on posts that interest you (as you’ll see on page 114,
when you start posting). Tags also give you a way to find blogs that discuss
your favorite topics. Begin by looking at the Tags box in the right-side column
of the Reader page. Click one of the tag words, or type in a subject of your own
in the search box to find more blogs.

Chapter 2: Signing Up with WordPress.com




WordPress’s everchanging Freshly Pressed
list shows popular, recent
posts. If you see a post
that piques your interest,
click its title. You could
also click the tag word to
search for more posts on
the same subject.

• Go tag surfing. You can browse some of the posts that use the most popular
tags by clicking the Explore link in the top-right corner of the Tags box. When
you do, WordPress shows a display that shows hot tags, sized to reflect their
current popularity (Figure 2-11).

When you browse through WordPress.com, you don’t see the many sites created with WordPress software
but hosted on sites other than WordPress.com. Although there’s no central repository of self-hosted WordPress
sites, you can browse a showcase with some examples at http://wordpress.org/showcase.

When you browse a WordPress.com blog (and you’re signed in under your WordPress.com account), a black toolbar appears at the top of the page (Figure 2-12).
On the left side is the name of the blog you’re currently viewing and two important
buttons: Follow and Like. If you like the post you’re reading, you can click the Like
button (which adds it to a list of your favorite posts). Or, if you decide the content
is so good that you want to come back to this site and read more, you can click the
Follow button (which adds the site to your personal watch list of blogs).





This grouping of tags
shows the most popular
topics of the moment. The
bigger tags (like Music
and News) have more
recent posts. Click a tag
that interests you to see a
list of recent posts on that


The WordPress toolbar
takes only a few pixels of
space, but it’s stocked with
useful commands. Hover
over the WordPress icon
on the left, and you’ll see
a menu that lets you jump
to different parts of the
WordPress.com site. Hover
over your user name on
the right, and you’ll see
a menu that lets you edit
your profile, manage your
blogs, and sign out. Or,
use the Favorite and Like
buttons to track interesting

Chapter 2: Signing Up with WordPress.com



Usually, you’ll choose to click Like on a post if you want to refer to it later—perhaps
to follow an ongoing conversation in the Comments section. You’ll choose Follow to
keep watching the blog for new content. To review your liked posts and read your
followed blogs, return to http://wordpress.com and click the Reader tab. Now you’ll
see the most recent posts from all the sites you follow, amalgamated into a single
reverse-chronological list.

Visiting the WordPress.com Store
As you’ve already seen, when you sign up with WordPress, you can buy a custom
domain name or a Premium account bundle. But what happens if you want to start
simple (and cheap) but add more features in the future? The answer is the WordPress.com store, which is just a click away on the dashboard. It offers a long list of
blog enhancements, each for a small yearly fee.
Getting to the store is easy. Once you load up the dashboard, click the Store link
in the menu on the left. WordPress shows you the long list of upgrades it offers
(Figure 2-13).


To add an upgrade to
your site, click the Buy
Now button underneath
it. Some options provide
a Try Now button, which
lets you use the upgrade
for free for two weeks,
and then charges you
automatically. Either way,
you’ll need to fill in your
payment information (using a credit card, a PayPal
account, or a digital wallet of Bitcoins).

In the following sections, you’ll see how to use the store to deal with two more complex setup scenarios. First you’ll learn how to buy a custom domain for an existing
WordPress.com site. Next you’ll see how to take a domain you already own and use
it with an existing WordPress.com site.


Buying a Domain after Signup
Imagine you build a thriving blog using a free .wordpress.com address (say, HelloPickles.wordpress.com), but then decide you really want a custom domain name
(like HelloPickles.net). Using the store, you can buy one for your existing blog, so
you don’t need to create a whole new blog under a new name. Here’s how:


1. Go to the dashboard.
You can get there by visiting the My Blogs page and clicking the Dashboard link,
or go there directly using your blog address and tacking /wp-admin onto the end.
2. Click Store in the menu on the left.
WordPress shows a list of all the upgrades you can buy.
3. In the “Add a Domain” box, click Buy Now.
WordPress displays a list of all the domains your site currently uses. Unless
you already bought a custom domain name through WordPress.com, the list
includes just one address: the .wordpress.com address you picked when you
created your site (Figure 2-14).


Currently, this site uses
the free domain lazyfather.wordress.com.

4. Click the “Register a new Domain Name” button.
This tells WordPress you want to look for a new address.
5. Type the domain you want into the domain search box, and then click Go.
WordPress checks to see if the domain you want is available. If it isn’t, try typing something else.
6. If the domain is available, click Register Now to make it yours.
WordPress brings you to the standard domain registration page, where you fill
in your personal details (as you saw back in Figure 2-5).

Chapter 2: Signing Up with WordPress.com



7. When you finish, click Register Domain and follow the instructions to pay.
When you add a custom domain name, WordPress won’t leave your current
audience in the cold. Instead, it’s smart enough to reroute people visiting
your old .wordpress.com address to your new domain. That means that if you
started with HelloPickles.wordpress.com, and you then buy the custom domain
HelloPickles.net, WordPress will automatically redirect people who type in HelloPickles.wordpress.com to your blog’s new domain, HelloPickles.net, just as
you would want. (Really, there’s no difference between the two addresses. They
are simply two names that point to the same site—your blog.)

Buying a custom domain for an already-created site is a useful technique if you think that you could
be outgrowing WordPress.com, and you want to prepare your site for a possible move to self-hosting. Because
WordPress automatically redirects visitors from your old .wordpress.com domain to your new custom domain, it
gives everyone a chance to get used to your new address. And when you do decide to move, you can take your
new domain with you (page 561).

Using a Domain Name You Already Own
Life is easiest if you buy your custom domain name from WordPress.com, but sometimes that isn’t possible. For example, you might have already bought the domain
name from a domain registrar. (You may have even bought it years ago.) Because
it isn’t currently possible to transfer a domain you own from another web host to
WordPress.com, you need to use another trick, called mapping.
Technically, mapping is a technique that, in this case, connects your custom domain
name to your WordPress.com blog. That way, when someone types in the custom
domain name (say HelloPickles.net), that person ends up at your WordPress.com
blog. And if that person types in your former .wordpress.com address (say, HelloPickles.wordpress.com), they’re redirected to your custom domain, which is what you
want. It’s exactly as if you had bought the custom domain name from WordPress.
com when you signed up.
Mapping is relatively easy, but it’s not free. WordPress charges a mapping fee (currently $13 a year), which you pay in addition to the annual fee you pay to keep the
domain name registered through your original domain registrar.
Mapping requires you to complete two setup operations: one with the web host that
registered the domain name, and one with WordPress. But before you get started
with either operation, you need to decide exactly how you want to link your custom
domain name with your WordPress site. You have two options:
• Use your whole domain. For example, you might create a blog at www.
WineSnobs.com. If you map this address to a WordPress.com address, you
need to keep your entire website on WordPress.com. This makes sense if you
purchased a domain name from another company but you haven’t actually
bought any web space from that company.



• Use a subdomain. Technically, a subdomain takes your domain name (say,
www.WineSnobs.com), removes the optional www part, and adds a different
prefix (like blog.WineSnobs.com). The goal is to create a separate web address
for your WordPress site, so you can put something else at your main domain
name (in this case, www.WineSnobs.com). Of course, your main site won’t be
a WordPress site, and you’ll need to pay your web host for some web space.


NOTE If all this talk about subdomains sounds familiar, it’s because the WordPress.com service uses
subdomains itself to give everyone a unique spot on the wordpress.com server. For example, add the prefix
GettingBloggedDown and you get the subdomain GettingBloggedDown.wordpress.com.

There’s also a third option—use a subdirectory in your domain (for example, www.
WineSnobs.com/blog)—but WordPress.com doesn’t currently support that technique.
Before you can map your domain, you have to do a little extra configuration with
your web host. These setup steps differ depending on whether you want to map the
full domain name or you want to map just a subdomain, so follow the instructions
in the appropriate section below.
If you’re mapping an entire domain name, you have to change your web domain’s
name servers. These are the high-powered computers that direct traffic on the Internet, and that tell browsers where to go to find your site. Right now, your domain
name uses the name servers at the company that registered your domain name, or
at your original web host (not WordPress.com). You need to change that so your
domain uses the WordPress.com name servers.

Making the change is simple enough—it usually involves changing just two pieces
of text—the name server addresses. However, you may need to dig around on your
web host’s administration page before you find exactly where these settings are
(they’re usually in a section called “Domain Name Servers” or “DNS Settings”). If in
doubt, contact your web host.
For example, if you’re using the web host www.brinkster.com, the name servers
would be set to this:

No matter what web host you’re currently using, you must change the name servers to this:

NS1 and NS2 are the two computers that direct your visitors to the WordPress.com
site they want to read.

Chapter 2: Signing Up with WordPress.com




Does your domain registrar provide an email address that you want to keep using? For example, maybe
you want WordPress.com to put a blog on www.WineSnobs.com, which you originally registered with the wellknown web hosting company GoDaddy, but you still want to receive email at rachel@WineSnobs.com. To pull
this off, you need to carry out the extra configuration step covered at http://tinyurl.com/ext-email.
If you’re mapping a subdomain, you need a slightly different configuration. Instead
of changing your name servers, you must add a CNAME record. Although it sounds
intimidatingly techy, all a CNAME record does is redirect traffic from your subdomain
to your WordPress.com blog.

Every web host has a different process for defining a CNAME record, but it usually
involves logging in, heading to an administration section with a name like “DNS
Management” or “Name Server Management,” and then adding the CNAME record.
Each record requires two pieces of information. The first is the subdomain prefix
(for example, that’s blog if you’re creating the subdomain blog.WineSnobs.com).
The second is your current WordPress.com address, like WineSnobs.wordpress.com,
which is often called the destination.

If you can’t find or figure out your web host’s domain management tools, make time for a quick
support call. Changing name servers and adding subdomains are two common tasks that domain registrars and
web hosts deal with every day.
Name server changes require time to take effect. Once you make your changes, the
settings need to be spread to various traffic-directing computers across the Internet.
It will take at least 24 hours, and possibly two or three days, before the change takes
effect and you can tell WordPress.com to start using your domain. Unfortunately,
there’s no high-tech way to monitor the process.

Once your name server changes have taken effect, you can add the domain by following the next set of steps. If you’re not sure whether you’ve waited long enough,
don’t worry—there’s no harm in trying. If the name server changes haven’t taken
effect, WordPress will let you know when you get to step 4 below, and you’ll need
to try again later.
1. Go to the dashboard.
You can get there by visiting the My Blogs page and clicking the Dashboard link,
or go there directly by appending /wp-admin to the end of your blog address.
2. Click Store in the menu on the left.
WordPress shows a list of all the upgrades you can buy.
3. In the “Add a Domain” box, click Buy Now.
WordPress shows a list of all the domains your site currently uses.



4. Click the “Map a Domain Name you own” button.
5. Type the domain you already own into the text box and then click Go.


WordPress checks to see if the domain name exists. Because WordPress has no
way of knowing that you own the domain, it will warn you that the blog is taken.
6. Click the long-winded “Yes, I already own this domain name. Map it to my
WordPress.com blog” button.
WordPress will ask you for your payment details. Once you supply that, the
mapping is complete. Congratulations—you can now get to your WordPress
site by using your custom domain name.

Chapter 2: Signing Up with WordPress.com



Installing WordPress
on Your Web Host


There’s nothing wrong with WordPress.com—it’s cheap, relatively powerful, and has
a thriving community of blogs. But the most serious WordPress fans aren’t satisfied
unless they can run WordPress on their own web hosts.
This approach, called self-hosting, gives you a world of new opportunities. You can,
for example, choose from a dizzying range of plug-ins to add new features to your
site. You can put a WordPress blog in the same domain as your traditional website
(for example, you can have a site at www.HandMadePaintBrushes.com and a blog at
www.HandMadePaintBrushes.com/news). You can slap ads on your blog, and—most
usefully of all—create a site that doesn’t look like a blog at all.
This chapter assumes that you know, deep down in your heart, that you are a WordPress self-hoster. You aren’t willing to settle for a merely convenient WordPress.com
blog when you can design exactly what you want with a self-hosted WordPress site.
In the following pages, you’ll learn how to get started.

Preparing for WordPress
Before you dive into a self-hosted WordPress setup, you need to tick off a few
requirements. The first is setting up an account with a web host. (If you’ve already
done that, you can safely skip ahead to the next section, starting on page 51.)
If you’re just starting out, choosing a good web host may seem more daunting
than it actually is. Technically, your host needs to meet two requirements to run
WordPress: First, it needs to be able to run PHP (version 5.2.4 or greater) programs,



which power WordPress. And second, it needs to recognize MySQL (version 5.0 or
greater), which is the database that stores WordPress content.
Virtually every web host meets these requirements. In fact, choosing a WordPressfriendly host is hard simply because so many hosts offer essentially the same thing.
Other selling points that hosts advertise—the amount of disk space or bandwidth
you get, for example—are less important. Even popular WordPress sites are unlikely
to approach anywhere near the web space and bandwidth limits most web hosts
offer, unless you plan to host huge video files (and even then, you’ll probably find it
far easier to host your videos with a video-hosting service like Vimeo or YouTube).

Disk space is useful for storing weekly or daily backup copies of your site. But with most web hosts
offering gigabytes upon gigabytes of space, you’re unlikely to hit a limit, even with a discount-priced hosting

Here’s the bottom line: WordPress has become so super-popular that virtually
all web hosts embrace it, even in their cheapest web hosting plans. And because
WordPress is so popular, many hosts specifically advertise “WordPress support”
or “one-click WordPress installation,” which lets you set up WordPress with an
autoinstaller (page 55).
The most important considerations in choosing a host aren’t the amount of web
space or bandwidth you get. Instead, they are reliability, security, and support—in
other words, how often your website will be down due to technical troubles, how
quickly you can get an answer to your questions, and whether your host will be in
business several years into the future. These attributes are more difficult to assess,
but before you sign up with a host, you should try contacting its support office
(both by email and phone). Don’t trust website reviews (which are usually paid for),
but do look up what other people say about the hosts you’re considering on the
popular forum Web Hosting Talk (http://bit.ly/vQ7tkH). Hawk Host, StableHost,
SpeedySparrow, and MDDHosting are just four examples of web hosts frequently
praised on these boards.
You can also choose a WordPress-recommended host (see the short list at http://
wordpress.org/hosting), but keep in mind that hosts pay to be on this exclusive list.
They’re perfectly good hosts, but you can find equally excellent options on your
own, and possibly save a few dollars.
TIP To budget for WordPress, assume you’ll pay $5 to $10 a month for web hosting. Then add the cost of a
custom domain name (that’s the web address that leads to your site), which you can typically find for a paltry
$12 or so per year.




Web Hosts with Premium Performance
Although there are plenty of decent, cheap hosting options
available for WordPress, they aren’t the equal of premium
hosting plans that cost several times more. The key difference
is performance. If your site is large, complex, and heavily trafficked, you might find that its pages become sluggish during
busy times. This happens because WordPress must do a fair
bit of work to assemble tailor-made content for every request.
The cheapest way to address this problem is with a caching
plug-in, as described on page 316. Depending on the scale and
popularity of your site, this may be a perfect solution. But if
your visitors still find your site slow, you might need to consider
switching web hosts or upgrading to a more expensive plan
from the host you already have.

The next step up in the hosting world is semi-dedicated hosting
or virtual private hosting. Either way, the idea is the same—to
move your site off the heavily trafficked web servers that host
hundreds or thousands of other people’s sites, and put it on
a computer that hosts fewer sites. That way, the server can
dedicate more resources to handling your site and serving your
visitors. The drawback is cost. While basic WordPress hosting
can be had for as little as $5 a month, virtual private hosting
hovers around $20 a month and can climb far above that.
If you’re just starting with WordPress, you won’t yet know how
well a particular web hosting plan will meet your needs. But
if you pick a well-respected web host, you can start out with
a cheap plan and upgrade to something with more muscle if
you need it.

Deciding Where to Put WordPress
When you sign up for a web hosting account, you typically get a domain name
(that’s the web address a visitor types into a browser to get to your site) and some
space for your web pages. But before you can create your first WordPress site, you
need to think a bit about how your web hosting account and your WordPress site
will fit together.
You can choose one of three basic strategies for installing WordPress on your web
hosting account:
• Put WordPress in the root folder of your site. This is the best approach if you
want to let WordPress run your entire site. For example, imagine you sign up
for a site with the domain www.BananaRepublican.org and you put WordPress
in the root folder of that site. Now, when visitors type that address into their
browsers, they go straight to your WordPress home page.
• Put WordPress in a subfolder of your site. This is the choice for you if your
web presence will include both traditional web pages (for example, something
you’ve handcrafted in a web editor like Dreamweaver) and a WordPress site.
Often, people use this choice to add a WordPress blog to an existing website.
For example, if you bought the domain www.BananaRepublican.org, you might
direct blog readers to the subfolder www.BananaRepublican.org/blog to see
your WordPress masterpiece. To set this up, you need to create a subfolder (in
the web address above, it’s named blog) and put WordPress there.

Chapter 3: Installing WordPress on Your Web Host



• Put WordPress in a subdomain of your site. This is another way to handle
websites that have a WordPress section and a non-WordPress section. The
difference is that instead of using a subfolder for the WordPress part of your
site, you use a subdomain. To create a subdomain, you take your domain (say,
www.BananaRepublican.org), remove the www part, if it has one (now you’ve
got BananaRepublican.org), and then put a different bit of text at the front,
separated by a period (as in social.BananaRepublican.org). For example, you
could have a traditional website at www.BananaRepublican.org and a newsstyle WordPress site with user feedback at social.BananaRepublican.org, just
like the automotive giant Ford does (page 14).
To use either of the first two approaches, you don’t need to do anything extra
before you start installing WordPress. The WordPress autoinstaller will take care
of everything.
But if you take the third approach and install WordPress on a subdomain, you need to
create the subdomain before you go any further. The following section explains how.

Creating a Subdomain (if You Need One)
If you’re planning to put WordPress in the root folder or in a subfolder of your website, skip this section—it doesn’t apply. But if you’re planning to host WordPress on
a separate subdomain, you need to lay a bit of groundwork, so keep reading.
Creating a subdomain is a task that’s quick and relatively straightforward—once
you know how to do it. Unfortunately, the process isn’t the same on all web hosts,
so you may need to contact your host’s support department to get the specifics.
If your host uses the popular cPanel administrative interface (and many do), the
process goes like this:
1. Using your browser, log in to the control panel for your web host.
Look for the Subdomains icon (usually, you’ll find it in a box named “Domains”).
If you can’t find the Subdomains box, try searching with the cPanel’s Find box.
Type in the first few characters (that’s “subd”) and it should appear at the top
of the page.
2. When you find the Subdomains icon, click it.
This loads the Subdomains page (Figure 3-1).
3. Choose the domain you want from a list of all the domains you own.
Some people have a web hosting account with just one domain, but others
own dozens.
4. In the Subdomain box, type in the prefix you want to use for the subdomain.
For example, if you want to create the subdomain blog.reboot-me.com on the
domain reboot-me.com, you need to type blog in the Subdomain box.





Here’s how you fill in
the information for a
subdomain named blog.
reboot-me.com. Just click
Create to seal the deal.
The list below the button
shows that there are two
other subdomains in this
account: blog.prosetech.
com and fds.reboot-me.

5. In the document Root box, pick the folder where you want to store the files
for this domain.
Your web host will suggest something based on your subdomain (for example, it
might be public_html/blog if you named the subdomain blog). You can use that
if you’re not sure what you want, or you can edit it to something you like better.
6. Click the Create button to create your subdomain.
After a brief pause, you’ll be directed to a new page that tells you your subdomain
has been created. Click Go Back to return to the Subdomains page.
You’ll see your new subdomain in the list on the Subdomains page. Right now,
it has no web files, so there’s no point in typing the address into a browser.
However, when you install WordPress, you’ll put its files in that subdomain.
After you finished admiring your work, look for a Home button to take you back
to cPanel’s main page.
If you need to delete a subdomain, find it in the list and then click the Remove link.
Now, if you try to access your site by typing the subdomain into a web browser,
you’ll get an error message.

Chapter 3: Installing WordPress on Your Web Host




When you remove a subdomain, WordPress doesn’t delete the folder you created for it (see step 5 in
the preceding list). You can either add a new subdomain that points to this folder, or use cPanel’s file management
features to delete the folder (if you don’t need it anymore).

Understanding the Administrator Account
Before you install WordPress, you need to decide what user name and password
you’ll use to manage your website. When you self-host, you’re responsible for every
file and folder on the site, and you have the ability to do anything from adding new
posts to deleting the entire site. You do all this through an all-powerful administrator account.
Hackers, spammers, and other shady characters are very interested in your WordPress administrator account. If they get hold of it, they’re likely to sully it with lurid
ads (see Figure 3-2), phony software offers, or spyware.


If you don’t look twice,
you could almost miss
it. This church runs a
WordPress blog that’s
been hacked by spammers. In a Google search
results page, the site title
and description promotes
cheap Viagra. Awkward.

Your best protection against these attacks is to follow two rules when you create
your administrator account:
• Make your user name non-obvious (that means you should prefer AngryUnicorn
to admin, user, or wordpress).
• Choose a strong, non-obvious password that includes a combination of letters
and numbers (like bg8212beauty rather than bigbeauty). For guidelines on
creating a secure password, see the box on page 27.
Once you decide where you want to install WordPress and you pick a good user
name and password for your administrator account, you’re ready to press on.



Installing WordPress with an Autoinstaller


The easiest way to install WordPress is to use an autoinstaller, a special tool that
installs programs on your site. Most web hosts offer an autoinstaller as part of their
There are several autoinstallers in the world. Two of the most popular are Softaculous
and Fantastico, both of which you’ll learn to use in this section. Other autoinstallers
you might come across include Installatron and SimpleScripts.

In an effort to please everyone, some web hosts support more than one autoinstaller. If that’s the
case for you, you can use either one. However, we prefer Softaculous, because it offers handy backup features
that Fantastico doesn’t. Page 60 has the scoop on those.

All autoinstallers work in more or less the same way: You sign in to your web hosting
account and click the autoinstaller icon to see a catalog of the add-on software your
host offers. Look for WordPress, and then start the installation. You need to supply
the same basic pieces of information during the installation—most significantly,
the website folder where you want to install WordPress, and the user name and
password you want to use for the WordPress administrator account (which your
autoinstaller will create).
The following sections explain how to use Softaculous (first) and Fantastico (second).
If your web host uses another autoinstaller, the steps are similar and you can follow
along with a few adjustments.

Installing WordPress with Softaculous
How do you know if your host offers Softaculous? You could ask, but it’s probably
quicker to look for yourself:
1. Log in to the control panel for your web host.
2. Look for a Softaculous icon.
Some control panels pile dozens of icons onto the same page. To look for Softaculous, you can use your browser’s Find feature. Just press Ctrl+F (Command+F
on a Mac) and type in “Softaculous.” Figure 3-3 shows a successful search.
If you can’t find a Softaculous icon, you might luck out with one of the autoinstallers listed above. Try searching for a Fantastico, Installatron, or SimpleScripts icon. If you find Fantastico, you can use the steps on page 65. If you find
another autoinstaller, try following the steps listed here—just mentally replace
“Softaculous” with the name of your autoinstaller.

Chapter 3: Installing WordPress on Your Web Host




Here, the Google Chrome
browser matches your
search term by highlighting the Softaculous icon.

TIP If you’re super-savvy, you may already know that some control panels have their own Find feature,
which is even more convenient than your browser’s Find function. To use it, look for a Find box on the web page
itself (not in your browser’s toolbar or menus). If you find one, type in the autoinstaller’s name (for example,
“Softaculous”). And if you can’t find any autoinstaller, try typing in “WordPress.” Sometimes, this finds the
autoinstaller’s setup script even if you don’t know the autoinstaller’s name.

3. Click the Softaculous icon.
Softaculous shows a large, colorful tab for each program it can install (Figure





Along the left, Softaculous lists all the installation scripts it supports.
But you won’t need to
hunt for the script that
installs WordPress, because it usually appears
in the top position on the
Softaculous home page,
due to its popularity.

4. Hover over the WordPress box and click Install.
This takes you to an all-in-one installation page that collects all the information
WordPress needs (Figure 3-5).
5. Pick a domain name and a directory.
You can choose from any of the domain names you registered with your web
host or any subdomain you created within that domain (page 52). This example
uses prosetech.com.
If you want to put your WordPress installation at the root of the domain (or in
an existing subdomain), then leave the directory box blank.
If you want to create a subdomain, then here’s where you fill in the name of
the folder for Softaculous to create. This example uses a folder named magicteahouse, which means the WordPress site will be created at http://prosetech.
com/magicteahouse. Remember, it doesn’t matter that the folder doesn’t exist
yet, because Softaculous will create it.

Chapter 3: Installing WordPress on Your Web Host




Here’s the page of
information Softaculous
needs before it installs



6. Optionally, change your database name and prefix.
The database name is the name of the MySQL database that stores all the content for your WordPress site. The actual name doesn’t matter much, as long as
it’s different from any other database you’ve already created. You can name
the database after your site (like magicteahousedb) or use the auto-generated
name Softaculous suggests (like wp224).


The database prefix is a short bit of text that’s added to the beginning of the
name of every table inside your database. Some people believe that by changing
this prefix, you can get a little bit of extra security, because some WordPress
attackers assume you’re using the standard wp_ prefix. Other than that, it’s
not important.
7. Choose a site name and description.
The site name is the title you want to give your WordPress site (like “Magic Tea
Emporium”). It shows prominently on every page of your site.
The description should be a short, one-sentence profile of your site. It appears
in smaller text, just underneath the title on every page of your site.
Don’t worry about the Multisite feature just yet—you’ll consider that in Chapter 12.
8. Choose a user name, password, and email address for your administrator
Remember, a good password is all that stands between you and a compromised
WordPress site that’s showing banner ads for timeshares. Here, Softaculous’s
neglect is nearly criminal. The default administrator name it plops in (admin) is a
bad choice because it’s obvious and therefore open to attack, and the password
it suggests (pass) is downright dangerous. Do yourself a favor and follow the
rules set out in the box on page 27 to defend your site properly.
The administrator email address is your email address. When you finish the
install, Softaculous emails you a page with all the important details, including
the administrator user name and password you picked.
9. Optionally, switch on the Limit Login Attempts checkbox (that installs the
Limit Login plug-in along with the WordPress software.
Limit Login Attempts is a security-conscious plug-in that temporarily closes
down the administrative section of your site if it detects a potential intruder
attempting to guess your user name and password. This plug-in is a good safeguard, but it’s not immediately necessary for a new site. You’ll learn more about
the Limit Login Attempts plug-in on page 567, as part of a basic WordPress
security walkthrough.

Chapter 3: Installing WordPress on Your Web Host



10. Click the plus-sign (+) box next to Advanced Options.
This reveals a few Softaculous settings for managing updates and backups. The
update settings aren’t of much use. You can tell Softaculous not to email you
about new WordPress updates (Disable Update Notifications) or you can ask
Softaculous to install updates automatically (Auto Upgrade). But you’re best
to avoid both settings, because WordPress already has the built-in smarts to
install important updates automatically (page 79), and you don’t want more
drastic changes to take place without your supervision.
The backup settings (described next) are more useful. Switch them on, and
Softaculous automatically backs up your WordPress site, without requiring any
work from you. (Technically, Softaculous works its magic using cron, a scheduling tool that most web hosts support.)
11. If you want to use automatic backups, pick a backup frequency from the
Automated Backups list, and then choose the number of old backups you
want to keep from the Backup Rotation list.
Automated Backup tells Softaculous how often to perform backups (daily,
weekly, or monthly).
Backup Rotation tells Softaculous how many old backed-up versions of your site
to keep. For example, if you choose to keep four backups and you use a weekly
backup schedule, then on the fifth week Softaculous will discard the oldest
backup to make way for the next one. You can choose Unlimited to keep every
backup you make, but be careful—Softaculous stores its backups on your web
server, and daily backups of a large site can eventually chew up all your space.

A regular backup schedule is a must for any WordPress site. However, you don’t need to use Softaculous.
Your web host may provide its own backup service, and there are plenty of WordPress plug-ins that can perform
regular backups (as you’ll see on page 313). If you need more time to think about your backup strategy, skip the
Softaculous settings for now, and review your options in Chapter 9. You can always edit your Softaculous settings
and switch on automatic backups afterward, as explained in the next section.

12. Click Install to finish the job.
Softaculous creates the folder you picked, copies the WordPress files there, and
creates the MySQL database. After a few seconds, its work is done and you see
a confirmation message (Figure 3-6).





When Softaculous finishes
creating your WordPress
site, it gives you its
address and the address
of its administration
page—the latter is the
address you type into
your browser to get
to the dashboard that
controls your site. (You’ll
explore the dashboard in
Chapter 4.)

Managing a Softaculous-Installed Site
Softaculous keeps track of the WordPress sites it installs. You can return to Softaculous to review this information and perform some basic management tasks on
your sites. Here’s how:
1. Log in to the control panel for your web host.
2. Find the Softaculous icon, and then click it.
This loads the familiar Softaculous page (Figure 3-4). This time, turn your attention to the menu that runs down the left side of the page.
3. Find the big WordPress icon. Click it, taking care not to click the Install or
Demo buttons.
This brings you to the overview page shown in Figure 3-7.
If you accidentally click the Install button inside the Softaculous icon, the
program assumes you want to install another WordPress site, and it opens the
installation page. To get to the overview shown in Figure 3-7, you need to click
the Overview button in the horizontal strip of buttons that appears just above
the installation information.

Chapter 3: Installing WordPress on Your Web Host




On this web hosting
account, Softaculous has
helped install WordPress
in three places. Next to
each site are the icons
that let you perform
common tasks (such as
updating, deleting, or
backing up your site).

4. Next to your site, click one of the icons in the Options column to perform
a management task:
• Clone creates an exact copy of your site, but in another folder. You could
use this if you want to try out some extensive modifications before you
make them a permanent part of your site.
• Backup lets you perform an immediate backup (rather than the more common scheduled backups, which Softaculous carries out automatically at a
set time). When you click Backup, Softaculous asks you what you want to
back up (Figure 3-8).
• Edit Settings lets you change several of the details you supplied when you
created the site. Don’t change anything unless you know exactly what you’re
doing—changing the database name or WordPress folder at this point can
confuse WordPress and break your installation. However, the Edit Settings
page is useful if you want to alter the automatic backup settings you specified when you installed WordPress (see step 11 on page 60).



• Remove deletes your site. This removes all the WordPress files, the subfolder (if you installed WordPress in a subfolder), and the WordPress databases.
Once you take this step and confirm your choice, there’s no going back.



A WordPress site stores its
text content in a database
and stashes other supporting resources (like picture
files) in the website
directory. So a proper full
backup includes a copy of
both your database and
your website directory.
Make sure to select both
checkboxes before you
click Backup Installation.


Backups take place on your web host’s web server, in the background. That means you can leave
Softaculous and close your browser, and the program still makes scheduled backups. Softaculous will send you
an email when it finishes a backup (using the administrative email address you supplied when you first installed
the WordPress site).

5. Optionally, you can browse directly to your site by clicking its URL.
Or click the head-and-torso Admin icon to visit the WordPress dashboard—the
administrative back end that controls your site. This interface (which is part of
WordPress, not Softaculous) is where you manage your content, style your
site, and take care of many more fine-grained configuration tasks. As with all
WordPress sites, the administration page is your WordPress site’s address with
/wpm2_admin tacked onto the end (for example, www.reboot-me.com/blog/
Once your site is established, you probably won’t visit Softaculous very often. But if
you want to practice installing WordPress, fiddle with different installation choices,
or just make a quick backup, it’s a handy place to be.

Chapter 3: Installing WordPress on Your Web Host



Managing Softaculous Backups
Like every good web administrator, you need to regularly back up your site so you
can recover from unexpected catastrophes (like the sudden bankruptcy of your web
hosting company, or a spammer who defaces your site).
As you’ve already learned, Softaculous offers two backup options. You can set up
scheduled backups, which take a snapshot of your site every day, week, or month.
It’s no exaggeration to say that every site should have a scheduled backup plan in
place (if you don’t want to use Softaculous, consider one of the plug-ins described
on page 313). Immediate backups are a complementary tool. They let you grab a
quick snapshot of your site at an important juncture—say, before you install a new
version of WordPress.
Either way, Softaculous stores the backed-up data for your site in a single large .gz
file (which is a type of compressed file format often used on the Linux operating
system). The filename includes the backup date (like wp.1.2014-08-20_05-30-16.
tarr.gz). Softaculous stores backup files in a separate, private section of your web
hosting account. Usually, it’s in a folder named softaculous_backups.
For extra protection, you should periodically download your latest backup to your
computer. This ensures that your site can survive a more extensive catastrophe that
claims your entire web hosting account.
Although you can browse for your backups on your web host using an FTP program,
the easiest way to find them is to head back to Softaculous. Then click the large
backup icon in the top-right corner of the page (Figure 3-9), which takes you to the
Softaculous backup page (Figure 3-10).

An FTP program is a tool that can talk to a computer and exchange files with it over the Internet.
Using an FTP program, you can browse the files on your website and download them to your computer.


Click here to see all the backups Softaculous has made at
your behest.





If you’re the prostech.com
administrator, there’s one
back-up file waiting for
you. You should download
it to your computer for


If you asked Softaculous to keep an unlimited number of backups (page 60), you will eventually need
to delete some of your oldest backups to free up more space. Otherwise, there’s no reason to worry about the
modest amount of space that a few WordPress backups will occupy.

If disaster strikes, you can restore your site using the backup. From the Softaculous
backups section, find the most recent backup, and then click the restore icon that
appears next to it, which looks like a curved, up-pointing arrow (see Figure 3-10).
You can also restore your site on a new web server—one that has Softaculous,
but doesn’t have your backup file. First, upload your backup file to the softaculous_backups folder using an FTP program. (Ask your web hosting company if you
have trouble finding that folder.) Then, when you launch Softaculous and go to the
backups section, you’ll see your backup file waiting there, ready to be restored.

Installing WordPress with Fantastico
Fantastico is another popular autoinstaller. Like Softaculous, it replaces the aggravating manual installation process WordPress users once had to endure (in the
brutish dark ages of a few years back) with a painless click-click-done setup wizard.
Here’s how to use it:
1. Log in to the control panel for your web host.
2. Look for a Fantastico icon.
Remember, many control panels have a search feature that lets you type in the
name of the program you want, rather than forcing you to hunt through dozens
of icons (as shown in Figure 3-3).

Chapter 3: Installing WordPress on Your Web Host



3. Click the Fantastico icon.
Fantastico’s menu page appears, with a list of all the software it can install.
Usually, you’ll find WordPress near the top of the list, along with other sitebuilding tools (Figure 3-11).


WordPress is just one of
many programs an autoinstaller like Fantastico
can install.

4. Click WordPress.
Fantastico displays basic information about WordPress, including the version
you’re about to install and the space it will take up. Autoinstallers always use
the latest stable version of WordPress, so you don’t need to worry about these
5. Click the New Installation link.
Now Fantastico starts a three-step installation process.
6. Pick a domain name and a directory (Figure 3-12).
This is where you decide where to put WordPress and all its files. As you learned
earlier (page 51), you have three basic options:
Make WordPress run your entire website, you must install it in the root folder
of your web hosting account. To do that, choose the domain name you registered
for your website (in the first box) and leave the directory box blank.
Install WordPress in a subfolder, choose your domain name in the first box,
and then fill in the name of the subfolder. The example in Figure 3-12 uses the
domain reboot-me.com and a folder named blog. Remember, the autoinstaller



will automatically create the folder you specify here. (And if there’s already a
WordPress site in that folder, you’ll overwrite the old site with the new one.)


Install WordPress in a subdomain, you must have already created the subdomain (by following the steps on page 52). If you have, you can choose the
subdomain name from the first box, and leave the directory box blank.


Fantastico lets you fill in
all the key details about
your WordPress site-to-be
on a single page.

7. Choose a user name and password for your administrator account.
Pick a name that’s not obvious and a password that’s difficult to crack (page
27). Doing otherwise invites spammers to hijack your blog.
8. Fill in the remaining details in the “Base configuration” section.
The administrator nickname is the name that WordPress displays at the end of
all the posts and comments you write. You can change it later if you like.
The administrator email address is your email address, which becomes part of
your WordPress user profile. It’s also the email address you’ll use for administration—for example, if you forget your administrator password and you need
WordPress to email you a password reset link.

Chapter 3: Installing WordPress on Your Web Host



The site name is the title you want to give to your WordPress site (“Wasted
Minutes” per Figure 3-12). It shows prominently on every page of your site.
The description is a short, one-sentence summary of your site. WordPress
displays it in smaller text just underneath the title on every page of your site.
9. Click the Install WordPress button.
The next screen summarizes the information you just typed in (Figure 3-13).
For example, it displays the exact location of your new site and the name of the
MySQL database that will hold all its content. You might want to double-check
this info for accuracy, and then write down the details for safekeeping.


Here, Fantastico tells you
what it’s about to do. To
hold all the data for this
WordPress site, Fantastico
will create a MySQL database named rebootme_
wrdp1 (the name is based
on the domain name
and it will create the
site at www.reboot-me.

10. Click “Finish installation” to move to the final step.
Now Fantastico does its job—creating the folder you picked (in this case, blog),
copying the WordPress files to it, and creating the MySQL database. When it
finishes, you’ll see a confirmation message. It reminds you of the administrator
user name and password you supplied, and lists the administration URL—the
address you type into your browser to get to the dashboard that controls your
site. As with all WordPress sites, the administration page is your WordPress
site’s address with /wpm2_admin tacked onto the end (for example, www.
You can return to Fantastico to manage your WordPress installations anytime. However, Fantastico doesn’t have the management features of Softaculous. Fantastico
offers no way to modify, clone, or back up an existing WordPress site. Instead, it
provides two links for each WordPress site you install: “Visit site” (which takes you
there) and Remove (which deletes the site permanently).




Multiply the Fun with Multiple WordPress Sites
Most of the time, you’ll install WordPress once. But you don’t
need to stop there. You can create multiple WordPress websites
that live side-by-side, sharing your web hosting account.
The most logical way to do this is to buy additional web domains. For example, when you first sign up with a web hosting
company, you might buy the domain www.patricks-tattoos.
com to advertise your tattoo parlor. You would then install
WordPress in the root folder on that domain. Sometime later,
you might buy a second domain, www.patrickmahoney.me,
through the same web hosting account. Now you can install
WordPress for that domain, too. (It’s easy—as you’ll see when
you install WordPress, it asks you what domain you want
to use.) By the end of this process, you’ll have two distinct
WordPress websites, two yearly domain name charges, but
only one monthly web hosting fee.

Interestingly, you don’t actually need to have two domains to
have two WordPress sites. You could install separate WordPress
sites in separate folders on the same domain. For example,
you could have a WordPress site at www.patrickmahoney.
me/blog and another at www.patrickmahoney.me/tattoos .
This is a relatively uncommon setup (unless you’re creating a
bunch of WordPress test sites, like we do for this book at http://
prosetech.com/wordpress). However, it is possible, and there’s
no limit. That means no one is stopping you if you decide to
create several dozen WordPress websites, all on the same
domain. But if that’s what you want, you should consider the
WordPress multisite feature, which lets you set up a network of
WordPress sites that share a common home but have separate
settings (and can even be run by different people). Page 399
explains how that feature works.

Installing WordPress by Hand
If you don’t have the help of an autoinstaller like Fantastico or Softaculous, don’t
panic. Before these tools were widespread, WordPress was known for a relatively
easy installation process. In fact, WordPress promoted it—heavily—as the “famous
5-minute install.” And while that’s wildly optimistic (unless you’re a seasoned webmaster, it’ll take far longer), WordPress is still known for being easier to set up than
most other blog software and content-management systems.
Here’s an overview of what you need to do to get WordPress up and running the
old-fashioned way:
1. Create a MySQL database for WordPress to use.
2. Upload the WordPress files to your web host.
3. Run the installation script to get everything set up.
In the following sections, you’ll tackle each of these tasks.

Before you go down the WordPress self-installation route, make sure that it’s truly necessary. The
overwhelming majority of web hosts now provide some sort of WordPress installation feature that you can use
instead. And although installing WordPress by hand isn’t a Mensa-level challenge, it’s an unnecessary slog if your
web host provides an easier approach.

Chapter 3: Installing WordPress on Your Web Host



Creating a MySQL Database
As you learned on page 5, WordPress stores all the details of your website—from
your posts to your comments—in a database. MySQL is the name of the database
software that manages your WordPress content, storing and fetching it. In fact, before you can install WordPress, you need to have a blank MySQL database waiting
for it. Here’s how to create one:
1. Use your browser to log in to the control panel for your web host.
2. Look for an icon that has something to do with databases or MySQL. Examples include “MySQL Administration,” “MySQL Databases,” or “Database
Manager.” When you find it, click it.
You’ll see a new page with information about all the MySQL databases currently
stored on your site, if any. Figure 3-14 shows an example.


If your web host uses the
cPanel interface, you’ll
manage databases on a
page like this. It’s divided
into several sections. For
a WordPress installation,
the three important ones
are Create New Database
(shown here at the top),
Add New User (near the
bottom), and, not shown,
Add User to Database (it’s
all the way at the bottom
of the page).



3. Create a new database.
You need to choose an appropriate name for your database. It should consist of
lowercase letters and numbers, with no special characters in it. In Figure 3-14,
you’re about to create a new database named wordpress (one named wrdp1
already exists).


The full database name has two parts: the site login (the user name you use
to log into your web hosting account) and the database name you picked. For
example, the full names for the databases in Figure 3-14 are rebootme_wordpress and rebootme_wrdp1.
TIP Make a note of the full two-part name of the database (like rebootme_wordpress), because you’ll need
to tell WordPress about it when you install WordPress.

Once you type in a name, click a button that’s named something like Create
Database or New. If your web host runs the standardized cPanel control panel,
the next step is to click the Go Back button to return to the database management page. (If your host uses a different control panel, look for similarly named
4. Add a new database user.
Right now, no one has control over your database. To be able to use it, you
need to appoint yourself its administrator by creating an administrator account.
You do that by adding a new user (you) and giving yourself across-the-board
permission to manage the database. That way, you can log into the database
and have free rein to store and retrieve information.
To add a new user in cPanel, scroll down the page to the Add New User section
and type in a user name and password for yourself. Click the Create User button
to make it official. Then click Go Back to return to the database management
5. Register your user name with the database.
Although it may sound strange, you, as the new database user, can’t do anything yet, because you haven’t given yourself permission to use the database.
To fix this, you need to give yourself access to the WordPress database you
created in step 3.
In a cPanel control panel, scroll to the bottom of the page, to the “Add User to
Database” section, which contains two drop-down lists. In the first one, pick
the user name you just added; in the second, pick the name of the database
you created. Then click Add to seal the deal.
This is also the point where you tell the database exactly what this user is allowed
to do. Because you’re the uber-powerful database administrator, this account
should be able to do everything, from adding and deleting tables of information
to searching and changing the data inside them. To make that happen, pick All
Chapter 3: Installing WordPress on Your Web Host



Privileges and then click Make Changes (Figure 3-15). Now you can have your
way with your brand-new database.


Here, the user rebootme_user is linked to
the rebootme_wordpress database (top).
After clicking Add, you need to set the
user’s security privileges. Checking the
topmost All Privileges box is a quick way
to check all the boxes.

Uploading the WordPress Files
Now you have a perfectly configured MySQL database waiting for someone to come
along and use it. But before you can get WordPress up and running, you need to
transfer the program to your website. This is a two-step process: First you download
the latest version of WordPress, and then you upload it to your site. Here’s how:
1. In your browser, go to http://wordpress.org/download , and then click the
Download WordPress button.
This downloads the latest version of WordPress as a compressed ZIP file, which
virtually all computers support. (If you look closely, you’ll see an alternate link for
downloading WordPress as a compressed .tar.gz file, but you don’t need that.)



2. Inside the ZIP file is a folder named “wordpress.” You need to extract that
folder to a convenient place on your hard drive, like the desktop.


For example, on a Windows computer you can drag the wordpress folder out
of the ZIP file and onto the desktop, automatically unzipping its contents in
the process. (You don’t need much free space. Altogether, the WordPress files
take up only a few megabytes of storage.) On Mac OS X, double-click the ZIP
file to extract its contents.
Using either method, you end up with a folder named wordpress, which will
have several subfolders and several dozen files in it, but you don’t need to
worry about those.
NOTE No matter where you put the wordpress folder, it will be a temporary storage location. After all, the
WordPress files can’t do much trapped on your computer. Your ultimate goal is to upload all these files to your web
host, where they can work their magic. Once you do that, you can delete the WordPress files from your desktop.

3. Figure out the FTP address you need to use.
You could ask your web host, but the address is almost always ftp:// followed
by your domain name, as in ftp://reboot-me.com. The initial ftp:// is critical—it
indicates that you’re making a connection for transferring files, not visiting a
website (in which case you’d use an address starting with http://).
4. Load your FTP program and navigate to your site.
FTP is a standard that lets computers pass files from one to the other. You’ll
use it to upload the WordPress files to your website.
In the old days of the Web, uploaders used specialized FTP programs to transfer
files. Many people still use dedicated FTP programs, and you can, too. However,
the latest versions of Windows and Mac OS X have built-in FTP functionality, so
you don’t need a separate program.

Depending on your web host, you may be able to upload files from your browser using your site’s
control panel. However, browser-based file management is usually awkward and can trigger a triple-Tylenol
headache if you need to upload a large batch of files, like the contents of the wordpress folder and its subfolders.
FTP is easier.

To open an FTP connection in any modern version of Windows, start by firing
up the Windows Explorer file manager. (Right-click the Start button, and click
a menu command that has a name like Open Windows Explorer.) Then, type
the FTP address into the Windows Explorer address bar.
To open an FTP connection in Mac OS X, start out at the desktop and hit
Command+K to launch the Connect to Server window. Then, type in the FTP
address and click Connect.

Chapter 3: Installing WordPress on Your Web Host



5. When your FTP program asks, enter your user name and password in the
boxes provided.
This is the same user name and password you use to connect to your host’s
control panel to manage your website.

Having trouble keeping track of all the different login identities you need to self-host WordPress? There
are three altogether: one for your web host’s control panel, one for your database, and one for your WordPress
administrator account.

Once you log in through the FTP panel, you’ll see your site’s folders and files—the
ones on your web server—listed; you can copy, delete, rename, and move them
in much the same way you can for local folders and files.
6. Browse to the root folder of your website.
This is the heart of your site—the place people go when they type in your web
address. It may be a folder named public_html or webroot. Or, you may start
off in the right place when you log in. If you already have a traditional website
on your domain, you’ll know you’re in the root folder when you see your web
pages there. And if you’re still in doubt, it may be worth a quick call to your web
host’s support center to make sure you’re in the right spot.
7. Open another file-browsing window to view the wordpress folder on your
This is the place where you unzipped the WordPress files in step 2.
8. Copy the files from the wordpress folder to your website.
There are two ways to do this. If you want WordPress to take over your entire
site (see page 55), you must select all the files in the wordpress folder (including
subfolders). Then, copy all these files over to your root web folder. This is the
strategy to use if you want people to go straight to your WordPress content
when they type in your domain name (like www.reboot-me.com).
NOTE If you’re putting WordPress in your root web folder, make sure you don’t have another default page
there. A default page is the page your website sends to a visitor when he types in your domain name (for example,
www.reboot-me.com) rather than specifying a site page (like www.reboot-me.com/mypage.html). WordPress has
its own default page, index.php, but you don’t want another default page trying to take over. Possible default
pages include anything that starts with “index” (index.html, index.shtml, index.html) and “default” (default.
asp, default.aspx).

If you want to create a subfolder on your website for WordPress, you follow a
slightly different procedure. First, rename the wordpress folder on your computer
to the name of the folder you want to create on your website. For example, if
you want to create a subfolder named blog, rename the wordpress folder blog.



Now you need to select and copy a single item—the blog folder that holds all
the WordPress files.


Either way, you upload the files in the same way you copy them on your computer. For example, you can drag the selected files from your computer and
drop them on the FTP window (Figure 3-16). Or you can copy the selected
files (that’s Ctrl+C on Windows and Command+C on a Mac), switch to the FTP
window, and then paste them (with Ctrl+V or Command+V).


Here, the folder named
“blog” sits on your
desktop and contains all
the WordPress files (bottom image). A quick drag
of the mouse transfers
WordPress to your
website (top image).

At this point, all the WordPress scripts and templates should be on your web server,
although they aren’t actually switched on yet. Before you continue to the final step,
it’s a good idea to make sure you uploaded the software successfully. To do that,
try requesting WordPress’s readme.html file, which should be in the folder you just
uploaded. For example, if you put WordPress at www.reboot-me.com/blog you can
request www.reboot-me.com/blog/readme.html. When you do, you’ll see a WordPress page with some very basic information about the setup process. If you get a
“webpage not found” error, you’ve accidentally uploaded your files to a different
location, so you need to take some time to sort it all out.

Chapter 3: Installing WordPress on Your Web Host



Running the Install Script
This is the final set of steps. Think of it as activating the WordPress site you just
1. To start the installation, type the web address where you installed WordPress into your browser, and then add /wpm2_admin/install.php to the end.
So if you installed WordPress at www.reboot-me.com/blog, you would request
www.reboot-me.com/blog/wpm2_admin/install.php. At this point, WordPress
warns you that it can’t find a configuration file (Figure 3-17). Don’t worry; you’ll
create one.


There’s no configuration
file for WordPress, so you
need to create one and
provide all the configuration details.

2. Click “Create a Configuration File.”
On the next page, WordPress reminds you about the information you’ll need to
complete this process (that’s the database details from the previous section).
3. Once you work up your confidence, click the “Let’s go” button.
WordPress displays a page requesting your database information (Figure 3-18).
4. Fill in your database details.
First, you need to supply the database name (which you created on page 70),
and the user name and password for the database administrator (which you
picked on page 71).
You also need to supply the location of the database. Ordinarily, that’s localhost,
which indicates that the database is on the same server as the WordPress installation file, which is almost always what you want. (If not, you need to contact
your web host to get the correct database location.)
Lastly, you need to pick a table prefix—a few characters that WordPress will
add to the name of every table it creates in the database. The standard prefix,
wp_ , is perfectly fine, but you may get marginally better security by choosing
something less common.





WordPress needs to know
where your database is,
and what user name and
password it should use
to access it. You need to
fill in the information
for Database Name, User
Name, and Password. You
can leave the other settings (Database Host and
Table Prefix) with their
standard values.

5. Once you enter all these details, click Submit.
If WordPress manages to contact your database, it gives you a virtual thumbsup and offers to start the installation.
6. Click “Run the install” to start the WordPress installation.
The next page collects some essential information about your WordPress site.
7. Fill in your site’s particulars (Figure 3-19).
The site title is the heading that crowns your WordPress site.
The user name and password are what you use to log in to the WordPress
dashboard, configure things, and write new posts. Choose a not-so-obvious
user name and a crack-resistant password (page 27).
The email address you type in will appear in your WordPress profile, and WordPress uses it if you forget your password and need to reset it.
Leave the “Allow my site to appear in search engines” checkbox turned on,
unless you’re trying to keep a low profile. (But keep in mind that even if your
site isn’t listed in a Google search, there are still plenty of ways for people to
stumble across it. The only way to keep out strangers is to create a private site,
as discussed on page 397.)

Chapter 3: Installing WordPress on Your Web Host




This WordPress site is
named Wasted Minutes.
The administrator’s user
name, angry_unicorn, is
far less predictable than
common (but less secure)
choices like admin, user,
wp, wp_admin, and
so on.

8. Click Install WordPress to finish the job.
This is the point where the WordPress installation script really gets to work,
configuring your database and loading it up with its first bits of WordPress content. When the process is finished, you’ll see a confirmation page (Figure 3-20).
Before you close the page, why not visit your site and verify that it’s working?
As always, you can add /wpm2_admin to the end of your site address to get
to the administration dashboard.





WordPress has finished
installing your site. This
confirmation screen
reminds you of the user
name you picked as
the administrator, but
it doesn’t repeat your
password. Click Log In to
go to the dashboard and
start managing your site.

Keeping WordPress Up to Date
No WordPress website should be left unprotected. If your site doesn’t have the latest WordPress updates, it can become a target for hackers and spammers looking
to show their ads or otherwise tamper with your site.
Fortunately, WordPress’s creators are aware of the threat that outdated software
can pose, and they designed the program for quick and painless upgrades. WordPress installs minor updates automatically, and it’s quick to notify you about major
updates so you can install them yourself. The following sections explain how these
two updating mechanisms work.

Minor Updates
Since version 3.7, WordPress has included an autoupdate feature that downloads
and installs new security patches as soon as they become available. So if you install
WordPress 4.0 and the folks at WordPress.org release version 4.0.1, your site will
grab the new fix and update itself automatically.
The autoupdate feature is a fantastic safety net for every WordPress site. However,
it has an intentional limitation. It performs only minor updates, which are usually
security enhancements or bug fixes. It doesn’t attempt to install major releases—you
need to do that yourself.

To spot the difference between a minor update and a major one, you need to look at the WordPress
version number. Major releases change one of the first two digits in the version number (for example, 4.0.8 to
4.1.0 is a major update). Minor releases change the minor version number, which is the digit after the second
decimal point (for example, 4.0.8 to 4.0.9).

Chapter 3: Installing WordPress on Your Web Host



Major Updates
A major update is a WordPress release that adds new features. Typically, WordPress
puts out a major release every four months. You can find a list of recent and upcoming major releases at http://wordpress.org/news/category/releases.
You don’t need to go out of your way to keep track of WordPress releases. Whenever
you travel to the dashboard—the administrative interface described in the next chapter—WordPress checks for new versions of the program and lets you know if it finds one.
To get to the dashboard, take your WordPress site address (like http://prosetech.
com/magicteahouse and add /wpm2_admin to the end (as in http://prosetech.com/
magicteahouse/wpm2_admin). Initially, you start at the dashboard home page. If
WordPress detects that there’s a newer version available, it tries to grab your attention by adding a notification box to the top of this page (Figure 3-21).


There’s a new version of
WordPress available, and
your site isn’t using it. To
get the latest new features,
click the “Please update
now” link. This takes you to
the Updates section of the
dashboard (Figure 3-22).

The Updates page is an all-in-one glance at everything that’s potentially old and out
of date on your site, including two types of WordPress extensions that you’ll learn
about later in this book: themes and plug-ins. Usually, the Updates page simply tells
you that all is well. But when updates are available, you’ll see something else. First,
WordPress adds a black number-in-a-circle icon to the Updates command in the
dashboard menu. The actual number reflects the number of website components
that need updating. In Figure 3-22 that number is 3, because you need to update
WordPress and two themes.

Themes and plug-ins are two ways you can enhance and extend your site. But if they contain flaws,
hackers can use those flaws to attack your site. You’ll learn more about themes in Chapter 5 and plug-ins in
Chapter 9.

To install an update, use the buttons on the Updates page. If there’s a new WordPress
update, then click the Update WordPress button. If there’s a newer theme or plugin, then turn on the checkbox next to that theme or plug-in, and then click Update
Themes or Update Plugins.




The Update page explains
that two components
need updating: the WordPress software and the P2
theme you installed on
your site.

WordPress updates are impressively easy. There’s no need to enter more information
or suffer through a long wait. Instead, you’ll see a brief summary that tells you what
happened (Figure 3-23). Your site will carry on functioning exactly as it did before.


Breathe easy: WordPress
is up to date once more.


Despite the rapid pace of new releases, WordPress’s essential details rarely change. New versions
may add new frills and change WordPress’s administrative tools, but they don’t alter the fundamental way that
WordPress works.

Chapter 3: Installing WordPress on Your Web Host



Building a WordPress

Creating Posts

Choosing and Polishing Your Theme

Jazzing Up Your Posts

Adding Pages and Menus

Comments: Letting Your Readers Talk Back



Creating Posts



ow that you’ve signed up for a WordPress.com account (Chapter 2), or installed the WordPress software on your web host (Chapter 3), you’re ready
to get started publishing on the Web. In this chapter, you’ll go to your fledgling WordPress site and start posting content, which can be anything from bracing
political commentary to cheap celebrity gossip. Along the way, you’ll learn several
key WordPress concepts.
First, you’ll get comfortable in WordPress’s dashboard—the administrative cockpit
from which you pilot your site. Using the dashboard, you’ll create, edit, and delete
posts, all without touching a single HTML tag (unless you really want to).
Next, you’ll learn how to classify your posts by using categories and tags, so you can
group them in meaningful ways. WordPress calls this art of organization taxonomy,
and if you do it right, it gives your readers a painless way to find the content they want.
You’ll also take a hard look at the web address (URL) that WordPress generates for
every new post. You’ll learn how to take control of your URLs, making sure they’re
meaningful, memorable, and accessible to search engines. You’ll also learn how to
shorten the web address of any post, which is handy if you need to wedge a link
to your post into a small place (like a Twitter message, Facebook post, or a bit of
bathroom graffiti).

Introducing the Dashboard
The dashboard is the nerve center of WordPress administration. When you want to
add a new post, tweak your site’s theme, or review other people’s comments, this
is the place to go.


The easiest way to get to the dashboard is to take your WordPress website address
and add /wp-admin (short for “WordPress administration”) to the end of it. For
example, if you host your site at http://magicteahouse.net, you can reach the site’s
dashboard at http://magicteahouse.net/wp-admin. When you do, WordPress asks
for your user name and password. Once you supply them, you’ll see a page like the
one in Figure 4-1.


Getting your bearings in
the dashboard is easy
enough. At the top is a
thin toolbar with some
handy shortcuts—for
example, if you point to
“+ New” without clicking,
a menu pops up with
commands for quickly
creating new posts and
other types of content.
Along the left edge of
the dashboard is the
all-important WordPress
menu—a strip of commands that let you move
to different parts of the
dashboard so you can
use different WordPress

When you finish working at the dashboard, it’s a good idea to log out. That way,
you don’t need to worry about a smart-alecky friend hijacking your site and adding
humiliating posts or pictures while you’re away from your computer. To log out, click
your user name in the top-right corner of the toolbar, and then click Log Out (on a
self-hosted site) or Sign Out (on a WordPress.com site).
There’s another way to go backstage with your site. When WordPress creates a new
site, it adds a small section of timesaving links named “Meta.” The exact location of
this section depends on the theme your site uses, but you’ll usually find it at the bottom of a sidebar on the left or right side of your home page (Figure 4-2). Inside the
Meta section, you can click the “Log in” link to go directly to the dashboard. (If you’re
already logged in, you’ll see a Site Admin link instead, which does the same thing.)





The Meta section of your
home page has links
that can take you to the
dashboard, show you
the feeds that publish
your content (page 433),
and transport you to the
WordPress.org site. It’s a
holdover from the earliest
days of WordPress.


The Dashboard in WordPress.com
Self-hosted sites and WordPress.com sites share a very similar
dashboard. Most of the commands (in the menu on the left) are
identical. In the rare cases that they aren’t, this book makes a
note of the discrepancy.
The toolbar at the top of the dashboard is less consistent.
WordPress.com sites have a set of shortcuts similar to what’s

in Figure 4-1, but in a subtly different arrangement from a
self-hosted WordPress installation. This isn’t a problem either,
because the toolbar simply duplicates some of the features
already in the WordPress menu. It’s up to you to discover
these shortcuts and decide whether you want to use them
from the toolbar at all.

Chapter 4: Creating Posts




Although the Meta section is helpful when you first start out, you definitely don’t want these administrative links in a finished site. Page 157 explains how to remove them, once you’re accustomed to breezing
in and out of the dashboard on your own.

The Menu
To browse around the dashboard, you use the menu—the panel that runs down the left
side of the dashboard. It has a link to every administrative feature WordPress offers.
WordPress groups the menu commands into submenus. To see a submenu, hover
over one of the menu headings (like “Posts”) and it pops open (Figure 4-3).


WordPress’s menu packs a lot of features into a small strip of web
page real estate. Initially, all you see are first-level menu headings.
But point to one of the items without clicking, and WordPress opens
a submenu. (The exception is the Comments heading, which doesn’t
have a submenu. You just click it to review comments.)

When you click a menu command, the rest of the dashboard changes to reflect the
task you picked. For example, say you choose Posts→Add New. (In other words,
you mouse over to the left-side menu, hover over “Posts” until its submenu appears,
and then click the “Add New” command.) Now, the dashboard shows an HTML-savvy
editor where you can write your post.
You can also click a menu heading directly (for example, “Posts”). If you do, you go
to the first item in the corresponding submenu, as shown in Figure 4-4.





If you click the heading Posts, you actually go to the submenu item
Posts→All Posts. And if you lose your bearings in the dashboard, just
look for the bold text in the menu to find out where you are. In this
example, that’s All Posts.


If you resize your web browser window to be very narrow, the menu shrinks itself to free up more
space, removing the menu names (like Posts, Media, and Links), and leaving just the tiny menu icons. Hover over
one of these icons, and the submenu appears, but with a helpful difference: Now WordPress displays the menu
name as a title at the top.

The Home Page
Your starting place in the dashboard is a densely packed home page. You can get
back to this page at any time by choosing Dashboard→Home from the menu.
If you just created a new self-hosted WordPress site, you’ll see a welcome box filling
the top part of the dashboard (Figure 4-5). It provides links that lead to some of
the more important parts of the dashboard, where you can edit settings and add
new posts.

Chapter 4: Creating Posts




Although the links in the
welcome box work perfectly well, it’s probably
a better idea to get used
to finding what you need
on the dashboard. Before
you continue, scroll
down past the welcome
box or click the Dismiss
link to remove the box
altogether, so you can
see the rest of the home
page. (If you want it back
later on, use the Screen
Options button described
on page 124.)

The dashboard home page may seem like a slightly overwhelming starting point,
because it’s crowded with boxes. Each one handles a separate task, as detailed in
Figure 4-6. Sometimes, you’ll also see boxes with important news (for example, an
announcement about an update to the WordPress software).


At the top of the dashboard home page, the “At
a Glance” box displays
your site’s vital signs—including how many posts,
pages, and comments
it has. To the right is a
Quick Draft box that lets
you create a new post in
a hurry. Below that, you’ll
find boxes with information about recent posts
(articles you’ve written),
recent comments (that
other people have left in
response to your posts),
and links to WordPress



Don’t be surprised to find that your brand-new WordPress site has some content
in it. WordPress starts off every new site with one blog post, one page, and one
comment, all of which are dutifully recorded in the Right Now box. Once you learn
to create your own posts, you’ll see how to delete these initial examples (page 104).


NOTE WordPress continually evolves. When you use the latest and greatest version, you may find that minor
details have changed, such as the exact wording of links or the placement of boxes. But don’t let these details
throw you, because the underlying WordPress concepts and procedures have been surprisingly steady for years.

Dashboard Practice: Changing Basic Settings
Now that you understand how the dashboard works, why not try out a basic task?
The following steps show you how to change a few useful WordPress settings, which
are worth reviewing before you start posting. And, best of all, they’ll help you get
used to clicking your way through the dashboard menu to find what you need.
1. In the dashboard menu, choose SettingsÆGeneral.
The rest of the dashboard loads up a page of tweakable settings (Figure 4-7).


Point to the dashboard’s
Settings menu item
without clicking to reveal
a submenu, and then click
General. That brings you
to the page of options
shown here (partially,
with some options

Chapter 4: Creating Posts



2. If you like, change some settings.
Here are some suggestions:
Site Title and Tagline. In a basic WordPress site, every page has a header
section at the top. WordPress puts the site title and tagline there (Figure 4-8).
The site title also shows up at the top of the browser window (or tab), and, if
a visitor decides to bookmark your site, the browser uses the site title as the
bookmark text. You shouldn’t change these details often, so it’s worthwhile to
double-check that you’ve got a clear title and catchy tagline right now.
Timezone. This tells WordPress where you are, globally speaking. (For example,
UTC-5 is the time zone for New York.) If WordPress doesn’t have the right time
zone, it will give posts and comments the wrong timestamp. For example, it
might tell the world that a comment you left at 8:49 PM was actually recorded
at 3:49 AM. If you’re not sure what your time zone offset is, don’t worry, because
WordPress provides a list of cities. Pick the city you live in, or another city in
the same time zone, and WordPress sets the offset to match.
Date Format and Time Format. Ordinarily, WordPress displays the date for
every post you add and the time for every comment made. These settings
control how WordPress displays the date and time. For example, if you want
dates to be short—like “2014/12/18” rather than “December 18, 2014”—the Date
Format setting is the one to tweak.
Week Starts On. This tells WordPress what day it should consider the first day
of the week in your country (typically, that’s Saturday, Sunday, or Monday).
This setting changes the way WordPress groups posts into weeks and the way
it displays events in calendars.


A WordPress header includes
the site’s title and tagline.
The title (Magic Tea House)
appears in a large font. The
tagline, a one-sentence
description (Tea Emporium
and Small Concert Venue), sits

3. Click Save Changes to make your changes official.
WordPress takes a fraction of a second to save your changes and then shows
a “Settings saved” message at the top of the page. You can now move to a
different part of the dashboard.




There are plenty more WordPress settings to play around with in the Settings submenu. As you explore
various WordPress features in this book, you’ll return to these settings to customize them.


One More Task: Choosing a Starter Theme
Every WordPress site has a theme that sets its layout and visual style. As you begin
to refine your site, you’ll take a closer look at themes, starting in Chapter 5. But before you even get to that point, you need to pick a good starter theme for your site.
WordPress includes a few themes with every new installation. Somewhat awkwardly,
it names each theme after the year it released the theme. At the time of this writing,
a WordPress installation includes the Twenty Twelve, Twenty Thirteen, and Twenty
Fourteen themes.
It’s natural to assume that the best theme is the latest one, and that later themes
should replace earlier ones in new sites. However, the creators of WordPress actually
take a different approach. They aim to have each new theme showcase a popular
style, while admitting that no single theme will suit everyone. The Twenty Fourteen
theme, for example, is a dark, slick, image-heavy production that suits online magazines and photo blogs. By comparison, Twenty Twelve is a clean, streamlined theme
that’s perfect for a basic blog or a solid foundation for more ambitious customizations.
You can learn the fundamentals of WordPress using any theme. However, you’ll have
an easier start using a clean and simple one like Twenty Twelve rather than a heavy
one like Twenty Fourteen. (You’ll also have an easier time following along with the
examples in this chapter, which use Twenty Twelve.)
To start yourself out right, here’s how to change your site’s theme to Twenty Twelve:
1. In the dashboard, click AppearanceÆThemes.
If you’re working with a self-hosted site, you’ll see a small gallery of preinstalled
If you’re working with a WordPress.com site, you’ll see a much larger gallery
with all the themes you can choose.
2. In the “Search themes” text box on the right, type “twenty twelve.”
As you type, WordPress filters the list of themes to show those that match your
search text (Figure 4-9).
3. Hover over the Twenty Twelve box and click Activate.
WordPress applies this theme to your site immediately. Click your site name
(near the top-left corner of the page) to view your site and see the results.

Chapter 4: Creating Posts




When you finish typing
in the search box, you’ll
see a single entry for the
Twenty Twelve theme.

Adding Your First Post
Comfortable yet? As you’ve seen, the WordPress dashboard gives you a set of relatively simple and anxiety-free tools to manage your website. In fact, a good part of
the reason why WordPress is so popular is because it’s so easy to take care of. (And
as any pet owner knows, the most exotic animal in the world isn’t worth owning if
it won’t stop peeing on the floor.)
But to really get going with your website, you need to put some content on it. So
it makes perfect sense that one of the first dashboard tasks that every WordPress
administrator learns is posting.

Creating a New Post
To create a new post, follow these steps:
1. In the dashboard menu, choose PostsÆAdd New.
The Add New Post page appears, complete with a big fat box where you can
type in your content (Figure 4-10).




Figure 4-10 is cropped so that it doesn’t show the dashboard menu on the left. Rest assured that the
dashboard menu is there. We’ve trimmed this detail on many of the pictures in this book so you can focus on the
task at hand (and so we don’t need to make our pictures micro-small).



The minimum ingredients
for any post are a descriptive title and a block of
text. To the right is the
all-important Publish box,
which holds buttons that
let you preview a post,
publish it, or save it as a
draft for later.

You can save time by using the toolbar at the top of the WordPress screen. If
you run WordPress on your own web host, click New→Post. If you signed up
with WordPress.com, click the WordPress “W” icon (in the left-hand corner)
and then click New Post.
2. Start by typing a post title into the blank box at the top of the page (right
under Edit Post).
A good post title clearly announces what you’re going to discuss. Often, visitors
will come across your post title before getting to your post text. For example,
they might see the title in a list of posts or on a search engine results page. A
good title communicates your subject and entices the reader to continue on
to the post. A lousy title might be cute, clever, or funny, but fail to reflect what
the post is about.
Here are some good post titles: “Obama Struggles in Recent Poll,” “Mad Men Is
Officially Off the Rails,” and “My Attempt to Make a Chocolate-Bacon Soufflé.”

Chapter 4: Creating Posts



And here are weaker titles for exactly the same content: “Polls, Polls, and More
Polls,” “Mad Men Recap,” and “My Latest Kitchen Experiment.”
3. Click in the big box under the post title (or just press the Tab key). Now type
in the content for your post (Figure 4-10).
A basic blog post consists of one or more paragraphs. After each paragraph,
press the Enter key (once) to start the next paragraph. WordPress automatically
adds a bit of white space between paragraphs, so they don’t feel too crowded.
Resist the urge to sign your name at the end, because WordPress automatically
adds this information to the post.
TIP Paragraphs and line breaks give your web page two different looks. When you start a new paragraph
by pressing Enter, WordPress includes some extra blank space between paragraphs. When you add a line break,
the adjacent lines remain relatively close together. (For example, you’d use line breaks to separate lines in a
mailing address or a poem.) When you want a line break instead of a new paragraph (to avoid getting the space
between paragraphs), hold down the Shift key while you press Enter.

If you want fancier formatting for your post, the toolbar that sits above the
content box lets you add lists, subheadings, pictures, and more. You’ll take a
closer look at these features on page 172.
NOTE Don’t worry if you’re not yet feeling inspired. It’s exceptionally easy to delete blog posts, so you can
add a simple post just for practice and then remove it later (see page 104).

4. Double-check your post.
A post with typographic errors or clumsy spelling mistakes is as embarrassing
as a pair of pants with a faulty elastic band. Before you inadvertently reveal
yourself to the world, it’s a good idea to double-check your writing.
If you use a browser with a built-in spell checker, which includes Internet Explorer 10 and any modern version of Firefox and Chrome, you get automatic
spell checking. You’ll see red squiggly lines under your mistakes, and you can
right-click misspelled words to choose the right spelling from a pop-up menu.
5. When you finish writing and editing, click Preview.
Your post preview opens in a new browser tab or new browser window. It
shows you a perfect rendition of what the post will look like on your site, with
the current theme.




In some cases, your browser may block the preview because this feature uses a pop-up window. If
your browser displays a warning message and no preview window, you may need to lower your browser’s pop-up
security settings. Although every browser is different, you usually accomplish that by clicking the pop-up warning
icon and choosing an “Allow pop-ups” option.


6. If you like what you saw in the preview window, click Publish.
In a self-hosted site, a message box will appear at the top of the page, confirming
that your post has been published. In a WordPress.com site, a side panel pops
into view, with a message that tells you how many posts you’ve written to date.
The moment you publish a post, it becomes live on your site and visible to the
world. WordPress.com shows you the results right away; if you run a self-hosted
WordPress site, you need to click the “View post” link to see the published post
(Figure 4-11).
If you’re not quite done but you need to take a break, click Save Draft instead of Publish. WordPress holds onto your post so you can edit and publish
it later. Returning to a draft is easy—in the dashboard home page (that’s
Dashboard→Home), find the Recent Drafts box and click your post in the list
to resume editing it. Afterward, you can continue postponing the moment of
publication (click Save Draft again), you can publish it like a normal post (click
Publish), or you can discard it altogether (click Move to Trash).

Why Your Post Might Look a Little Different
If you try out these steps on your own WordPress site (and you
should), you might not get exactly the same page as shown
in Figure 4-11. For example, the date information, the author
byline, and the link that lets you jump to the previous post
may be positioned in different spots or have slightly different
wording. If you created your site on WordPress.com, you’ll get
social media sharing buttons at the bottom of your post, which
make it easier for your readers to talk about you on Facebook
and Twitter. And there are other differences in the formatting
and arrangement of your site, if you care to dig around.
You might assume that these alterations represent feature
differences—for example, things that WordPress.com sites

can do that self-hosted WordPress sites can’t. But that isn’t the
case. Instead, this variability is the result of different themes,
plug-ins, and WordPress settings.
The best advice is this: Don’t get hung up on these differences.
Right now, the content of your site is in your hands, but the
other details (like the placement of the sidebar and the font
used for the post text) are beyond your control. In Chapter 5,
when you learn how to change to a new theme or customize
a current one, these differences will begin to evaporate. And
by the time you reach the end of Part 2 in this book, you’ll be
able to customize a self-hosted WordPress site or a WordPress.
com site to look the way you want it to.

Chapter 4: Creating Posts




Here’s the finished post,
transplanted into the
stock layout of your
WordPress site. The two
circled sections represent
the content you contributed. WordPress has
added plenty of details,
like the category and date
information below your
post. You’ll learn to take
charge of these details in
this chapter and the next.

Browsing Your Posts
Adding a single post is easy. But to get a feel for what a real, thriving blog looks like,
you need to add several new posts. When you do, you’ll find that WordPress arranges
your posts in the traditional way: one after the other, in reverse-chronological order.
To take a look, head to the home page of your blog (Figure 4-12). To get there, just
enter your WordPress site address, without any extra information tacked onto the
end. Or, if you’re currently viewing a post, click the Home button in the menu bar
(just under the header section and the stock picture).





When you visit the home
page of a blog, you start
out with a reverse-chronological view that puts
the most recent post first.
If you don’t like to scroll,
the sidebar on the right
gives you several other
ways to browse posts.

The number of posts you see on the home page depends on your WordPress settings. Ordinarily, you get a batch of 10 posts at a time. If you scroll to the bottom
of the home page, you can click the “Older posts” link to load up the next 10. If you
want to show more or fewer posts at once, choose Settings→Reading and change
the “Blog pages show at most” setting to the number you want.

Chapter 4: Creating Posts



WordPress.com sites include an infinite scroll feature. When it’s switched on, you
won’t see the “Older posts” link. Instead, WordPress loads new posts as you scroll
down, creating an ever-expanding page (until you reach the very first post on the
site). To turn this feature off, choose Settings→Reading and then turn off the checkbox next to “Scroll infinitely.”
You don’t need to read every post in a WordPress site from newest to oldest. Instead,
you can use one of the many other ways WordPress gives you to browse posts:
• By most recent. The Recent Posts list lets you quickly jump to one of the five
most recently created posts. It’s the first set of links in the sidebar on the right.
• By month. Using the Archives list, you can see a month’s worth of posts. For
example, click “June 2014” to see all the posts published that month, in reversechronological order. Some WordPress blogs also include a calendar for post
browsing, but if you want that you’ll need to add it yourself (see page 164 to
learn how).
• By category or tag. Later in this chapter, you’ll learn how to place your posts
in categories and add descriptive tags. Once you take these steps, you’ll have
another way to hunt through your content, using either the Categories list in
the sidebar or the category and tag links that WordPress adds to the end of
every post.
• By author. If your site has posts written by more than one person, WordPress
automatically adds a link with the author name at the bottom of every post.
Click that link and you’ll see all the posts that person has created for this site, in
reverse-chronological order (as always). You can’t use this feature just yet, but
it comes in handy when you create a blog that has multiple authors, as you’ll
learn to do in Chapter 11.
• Using a search. To search a blog, type a keyword or two into the search box,
which appears at the top right of your site, and then press Enter. WordPress
searches the title and body of each post and shows you a list of matching posts.

Delayed Publishing
Sometimes, you might decide your post is ready to go, but you want to wait a little
before putting it on the Web. For example, you might want your post to coincide
with an event or product announcement. Or maybe you want your post to appear
at a certain time of day, rather than the 2:00 a.m. time you wrote it. Or maybe you
simply want to add a bit of a buffer in case you get new information or have a lastminute change of heart.




How Do I Change My Home Page?
I don’t like the look of my home page. Is there anything I can
do to change it?
The home page is the first thing visitors see on your website. For
that reason, it’s no surprise that it’s one of the things WordPress
authors want to tweak first. Here are some of your options:
• Change the number of posts. Want to see more (or
fewer) than 10 posts at a time? On the dashboard,
choose SettingsÆReading. In the “Blog pages show at
most” box, type in a different number, and then click
Save Changes.
• Show post summaries. Ordinarily, WordPress shows
the entire post on the home page. If you like to write
thorough, detailed posts with plenty of text and pictures

(or if you’re just incurably long-winded), you would
probably prefer to show a brief summary instead. You’ll
learn how to pull off this trick on page 198.
• Show a static page. If you’d rather show a custom home
page that you’ve designed, instead of a list of recent
posts, you need to create a static page. You’ll learn how
to do that—and use it for your home page—in Chapter 7.
These are just a few examples. As you read this book, many
more options will open up. For example, in Chapter 10 you’ll
learn how to create a home page that uses image thumbnails
(page 343). And when you consider the advanced themeediting techniques in Chapter 14, you’ll see how to create a
home page that displays a list of categorized links to just the
posts you want.

In all these situations, you can choose to save your post as a draft (click Save Draft)
and publish it later. That gives you complete control over when the post appears,
but it also forces you to make a return trip to your computer. A different approach
is to use delayed publishing, which allows you to specify a future publication time.
Before that time arrives, you may return and edit your post (or even cancel it). But
if you do nothing, the post will magically appear, at exactly the time you specified.
To use delayed publishing, follow these steps:
1. Before you start, make sure WordPress has the right time settings (page 92).
If WordPress thinks you’re in a different time zone, its clock won’t match yours,
and when you tell it to publish a post at a certain time, it will actually appear a
few hours before or after you expect.
2. To write your post, choose PostsÆAdd New in the dashboard.
Write your post in the usual way.
3. In the Publish box, click the Edit link next to “Publish immediately.”
A new group of settings drops into view (Figure 4-13).
4. Use the provided boxes to pick a forthcoming date and the exact time when
the post should go live.
Here, WordPress uses a 24-hour clock, so put in 14:00 for 2:00 p.m.

Chapter 4: Creating Posts




WordPress lets you schedule content for future publication down to
the minute.

5. Click OK to apply your changes.
At this point, the Publish button turns into a Schedule button.
6. Click the Schedule button to commit to publishing the post.
WordPress will wait until the time you specify, and then publish your work.
If you decide you don’t actually want to publish the post at the time you set,
you can edit the post (as described on page 102) and put the scheduled time
to a very distant future date. Or you can delete the post altogether (page 103).

You can use the same technique to create a post with an older publication date. To do that, just type in
a date and time that falls in the past. Although this trick is less useful than delayed publishing (because no one
wants to make her content look old), it’s occasionally useful. For example, it’s handy if you publish several posts
at the same time and you want to change their order or spread them out.

Editing a Post
Many people assume that posting on a blog is like sending an email message: You
compose your thoughts, write your content as best you can, and then send it out
to meet the world. But the truth is that you can tinker with your posts long after
you publish them.
WordPress gives you two easy ways to edit a post. If you’re logged in as the site
administrator and you’re viewing a post, you’ll see an Edit button or an Edit link
somewhere on the page (its exact position depends on your theme). Click that link,
and WordPress takes you to the Edit Post page, which looks almost identical to the
Add New Post page. In fact, the only difference is that the Publish button has been
renamed “Update.” Using the Edit Post page, you can change any detail you want,


from correcting a single typo to replacing the entire post. When you finish making
changes, click the Update button to commit your edit.


Another way to pick a post for editing is to use the dashboard. First, choose Posts→All
Posts, which shows you a list of all the posts you’ve published (Figure 4-14). Find
the post you want to edit, hover over it, and then click the Edit link to get to the Edit
Post page, where you can make your changes.


The Posts page lists
your posts in reversechronological order,
starting with the most
recent, and including any
drafts. When you point to
a post (without clicking),
you see links that let
you edit, delete, or view
the post.

Along with the Edit link, the Posts page includes a Quick Edit link. Unlike Edit, Quick
Edit keeps you on the Posts page but pops open a panel that lets you edit some of
the post details. For example, you can use Quick Edit to change a post’s title, but
you can’t use it to change the actual text.
Being able to edit in WordPress is a nearly essential feature. Eventually, even the
best site will get something wrong. There’s no shame in opening up an old post to
correct an error, clean up a typing mistake, or even scrub out a bad joke.

Unlike some blogging and content management systems, WordPress doesn’t display any sort of
timestamp or message about when you last edited a post. If you want that, you’ll need to add it as part of your
edit. For example, you might tack an italicized paragraph onto the bottom of a post that says, “This post edited
to include the full list of names” or “Updated on January 25th with the latest survey numbers.”

Deleting a Post
As you’ve just seen, you can edit anything you’ve ever written on your WordPress
website, at any time, without leaving any obvious fingerprints. You can even remove
posts altogether.

Chapter 4: Creating Posts



The trick to deleting posts is to use the Posts page (Figure 4-14). Point to the post
you want to vaporize, and then click Trash. Or, on the Edit Post page, click the “Move
to Trash” link that appears in the Publish box.
TIP Now that you know how to remove a post, try out your new skill with the “Hello world!” example post
that WordPress adds to every new blog. There’s really no reason to keep it.

Trashed posts aren’t completely gone. If you discover you removed a post that you
actually want, don’t panic. WordPress gives you two ways to get your post back.
If you realize your mistake immediately after you trash the post, look for the message
“Item moved to Trash. Undo.” It appears in a box at the top of the Posts page. Click
the Undo link, and your post returns immediately to both the Posts list and your site.
If you want to restore a slightly older trashed post, you need to dive into the Trash.
Fortunately, it’s easy (and not at all messy). First, click Posts→All Posts to get to the
Posts page. Then click the Trash link that appears just above the list of posts (Figure
4-15). You’ll see every post that’s currently in the trash. Find the one you want, hover
over it, and then click Restore to resurrect it (or click Delete Permanently to make
sure no one will find it again, ever).


Three links at the top of the list
of posts let you choose what
content you see: All (every
published post and draft),
Published (only published
posts), and Trash (posts you

NOTE Of course, removing posts from your blog and scrubbing content from the Web are two vastly different
things. For example, if you post something impolite about your boss and remove it a month later, the content
can live on in the cache that search engines keep and in Internet archival sites like the Wayback Machine (http://
web.archive.org). So always think before you post, because WordPress doesn’t include tools to reclaim your job
or repair your online reputation.

Creating a Sticky Post
As you know, WordPress orders posts by date on the home page, with the most
recent post occupying the top spot. But you might create an important post that
you want to feature at the top of the list, regardless of its date. For example, you
might write up a bulletin that announces that your business is temporarily closing for
renovations, or answers frequently asked questions (“No, there are no more seatings



available for this Sunday’s Lobster Fest”). To keep your post at the top of the list so
it can catch your readers’ eyes, you need to turn it into a sticky post.


NOTE WordPress displays all your sticky posts before all your normal posts. If you have more than one
sticky post, it lists the most recent one first.

You can designate a post as sticky when you first write it (on the Add New Post page)
or when you edit it later (on the Edit Post page). Either way, you use the Publish
box. Next to the label “Visibility: Public,” click Edit. A few more options will drop
into view (including the private post options you’ll explore on page 395). To make
your post sticky, turn on the checkbox next to “Stick this post to the front page,”
and then click Publish or Update to confirm your changes.
The only caveat with sticky posts is that they stay sticky forever—or until you “unstick”
them. The quickest way to do that is to choose Posts→All Posts, find the sticky post
in the list, and then click the Quick Edit link underneath it. Turn off the “Make this
post sticky” checkbox and then click Update.

The Path to Blogging Success
There’s no secret trick to building a successful blog. Whether
you’re recording your thoughts or promoting a business, you
should follow a few basic guidelines:
• Make sure your content is worth reading. As the oftreported slogan states, content is king. The best way to
attract new readers, lure them in for repeat visits, and
inspire them to tell their friends about you, is to write
something worth reading. If you’re creating a topical
blog (say, putting your thoughts down about politics,
literature, or gourmet marshmallows), your content needs
to be genuinely interesting. If you’re creating a business
blog (for example, promoting your indie record store or
selling your real estate services), it helps to have content
that’s truly useful (say, “How to Clean Old Records” or “The
Best Chicago Neighborhoods to Buy In”).

• Add new content regularly. Nothing kills a site like stale
content. Blogs are particularly susceptible to this problem
because posts are listed in chronological order, and each
post prominently displays the date you wrote it (unless
you remove the dates by editing your theme files; see
Chapter 13).
• Keep your content organized. Even the best content can
get buried in the dozens (or hundreds) of posts you’ll
write. Readers can browse through your monthly archives
or search for keywords in a post, but neither approach is
convenient. Instead, a good blog is ruthlessly arranged
using categories and tags for the posts (see the next

Chapter 4: Creating Posts



Organizing Your Posts
WordPress gives you two complementary tools for organizing your posts: categories
and tags. Both work by grouping related posts together. In the following sections,
you’ll learn how to use them effectively.

Understanding Categories
A category is a short text description that describes the topic of a group of posts.
For example, the Magic Tea House uses categories like Tea (posts about teas for
sale), Events (posts about concert events at the tea house), and News (posts about
other developments, like renovations or updated business hours).
Categories are really just text labels, and you can pick any category names you
want. For example, the categories Tea, Events, and News could just as easily have
been named Teas for Sale, Concerts, and Miscellaneous, without changing the way
the categories work.
In a respectable WordPress site, every post has a category. (If you don’t assign
a category, WordPress automatically puts your post in a category named Uncategorized, which presents a bit of a logical paradox.) Most of the time, posts should
have just one category. Putting a post in more than one category is a quick way to
clutter up the structure of your site, and confuse anyone who’s browsing your posts
one category at a time.

A good rule of thumb is this: Give every post exactly one category. If you want to add more information to make it easier for people to find posts that are related to each other, add tags (page 114). (The exception
is if you use multiple categories to “flag” posts for special features. For example, you’ll see a theme trick on
page 192 that uses a category to denote featured posts. In this sort of example, some posts may appear in two
categories—one “real” category used for classification and browsing, and another category you use to tap into
the special feature.)

You don’t need to create all your categories at once. Instead, you can add them
as needed (for example, when you create a new post that needs a new category).
Of course, you’ll have an easier time organizing your site if you identify your main
categories early on.
It’s up to you to decide how to categorize posts and how many categories you want.
For example, the Magic Tea House site could just as easily have divided the same
posts into more categories, or into different criteria, as shown in Figure 4-16. The
box on page 109 has some tips for choosing good categories.





Here are two ways to organize the
same 17 posts. Neither is necessarily better than the other, but the
grouping on the bottom makes
it easier to promote the teas that
the Magic Tea House sells. It also
assumes the site will feature
regular articles about teas, and
that concerts are a common type
of event. If that’s not the case,
it’s probably not worth having
separate categories named Tea
Facts and Concerts.

Categorizing Posts
You can easily assign a category to a post when you first add the post. Here’s how:
1. Choose PostsÆAdd New to start a new post.
Or you can start editing an existing post (page 102) and then change its category. The Add New Post and Edit Post pages work the same way, so it’s easy.
2. Look for the Categories box.
You’ll find it near the bottom-right corner of the page, under the Publish and
Format boxes (Figure 4-17).
If the category you want exists, skip to step 5.
If your post needs a new category, one that you haven’t created yet, continue
on to step 3.

Chapter 4: Creating Posts




The Categories box has two tabs. The one you
usually see, All Categories, lists all your post
categories in alphabetical order. If you’ve created quite a few categories, you might find it
faster to choose one from the Most Used tab,
which lists the categories you use most often.

3. At the bottom of the Categories box, click Add New Category.
This expands the Categories box so you can enter category information.
4. Enter the category name in the box underneath the Add New Category link,
and then click Add New Category.
Don’t worry about the Parent Category box underneath—you’ll learn to use that
on page 110, when you create subcategories.
Once you add your category, it appears in the Categories box.
5. Find the category you want to use in the list, and then turn on the checkbox
next to it.
When you add a new category, WordPress automatically turns on its checkbox,
because it assumes this is the category you want to assign to your post. If it
isn’t, simply turn off the checkbox and pick something else.



You can add a post to more than one category, but it’s best not to unless you’re
a pro. Doing so is likely to mask a poor choice of categories, and it makes it hard
to change your categories later on.


6. Carry on editing your post.
That’s it. When you publish your post, WordPress assigns it the category you
chose (Figure 4-18). If you didn’t choose any category, WordPress automatically
puts it in a category named (paradoxically) Uncategorized.
TIP Ordinarily, the category named Uncategorized is WordPress’s default category—that means WordPress
uses it for new posts unless you specify otherwise. However, you can tell WordPress to use a different default
category. Simply choose Settings→Writing and pick one of your categories in the Default Post Category list.


How to Choose Good Categories
To choose the right categories, you need to imagine your site,
up and running, several months down the road. What posts
does it have? How do people find the content they want? If
you can answer these questions, you’re well on the way to
choosing the best categories.
First, you need to choose categories that distribute your posts
well. If a single category has 90 percent of your posts, you
probably need new—or different—categories. Similarly, if a
category accounts for less than 2 percent of your posts, you
may have too many categories. (Although there are exceptions—perhaps you plan to write more on that topic later, or
you want to separate a very small section of special-interest
posts from the rest of your content.)
You may also want to factor in the sheer number of posts you
plan to write. If your site is big and you post often, you may
want to consider more categories. For example, assuming the
Magic Tea House has a couple of dozen posts, a category split
like this works fine: Tea (70 percent), Concerts (20 percent),
News (10 percent). But if you have hundreds of posts, you’ll
probably want to subdivide the big Tea group into smaller

It also makes sense to create categories that highlight the
content you want to promote. For example, if you’re creating
a site for a furniture store, you’ll probably create categories
based on your products (Couches, Sofas, Dining Room Tables,
and so on). Similarly, the Magic Tea House can split its Tea
category into Our Teas and Tea Facts to better highlight the
teas it sells (Figure 4-16).
Finally, it’s important to consider how your readers will want
to browse your information. If you’re a lifestyle coach writing articles about personal health, you might decide to add
categories like Good Diet, Strength Training, and Weight Loss,
because you assume that your readers will zero in on one of
these subjects and eagerly devour all the content there. Be
careful that you don’t split post categories too small, however,
because readers could miss content they might otherwise
enjoy. For example, if you have both a Good Diet Tips and
Superfoods category, a reader might explore one category
without noticing the similar content in the other. This is a
good place to apply the size rule again—if you can’t stuff both
categories full of good content, consider collapsing them into
one group or using subcategories (page 110).

Chapter 4: Creating Posts




This post is in the Tea
category. Click the link (the
word “Tea,” under the post),
and you’ll see all the posts
in that category.

Using Subcategories
If you have a huge site with plenty of posts and no shortage of categories, you may
find that you can organize your content better with subcategories.
The idea behind subcategories is to take a large category and split it into two or
more smaller groups. However, rather than make these new categories completely
separate, WordPress keeps them as subcategories of the original category, which
it calls the parent category. For example, the Magic Tea House site could make Tea
a parent category and create subcategories named Black Tea, Green Tea, Rooibos,
and Herbal Tea.
Done right, subcategories have two potential benefits:
• You can show a category tree. A category tree shows the hierarchy of your
categories. In a complex site with lots of categories, most readers find that this
makes it easier to browse the categories and understand how the topics you
cover are related. You’ll learn how to build a category tree in just a moment.
• Visitors can browse posts by subcategory or parent category. That means
that people using the Magic Tea House site can see all the tea posts at once
(by browsing the Tea category) or they can drill down to the subcategory of
tea that interests them the most.
You can create subcategories using the Categories box—in fact, it’s just as easy as
creating ordinary categories (Figure 4-19). The only requirement is that you create
the parent category first. Then enter the subcategory name, pick the parent category
in the Parent Category list, and then click Add New Category.



Yes, you can create subcategories inside of subcategories. But doing so can complicate life and make
it more difficult to fit a proper category tree in your sidebar. If possible, stick with one level of subcategories.



To add a post subcategory, you need to supply one extra piece of information: the parent category, which you select from a drop-down list.

WordPress displays categories hierarchically in the Categories box. That means that
you’ll see your subcategories (like Green Tea) displayed underneath the parent category (Tea). However, there’s an exception—when you first add a new subcategory,
WordPress puts it at the top of the list, and it stays there until you refresh the page
or add a new category. Don’t let this quirk worry you; your new category is still
properly attached to its parent.

When you assign post to a subcategory, make sure you pick the subcategory only, not the parent
category. That means that if you want to add a post about green tea, you should turn on the checkbox next to
the Green Tea box, but not the Tea box. Because Tea is the parent category, people who browse the Tea category
will automatically see your Green Tea posts.

When you start adding subcategories to your site, you’ll probably be disappointed
by how they appear in the Categories list, the category-browsing links that appear
in the sidebar alongside your posts. The standard list of categories is a flat, onedimensional list in alphabetical order. You can’t see the relationships between parent
categories and subcategories (Figure 4-20, left).

Chapter 4: Creating Posts




Ordinarily, the Categories list ignores subgroups (left). But fear
not: With a simple configuration change you can get a more
readable tree (right).


The Categories list shows only the categories you currently use. So if you create a new category but
don’t assign it to a post, you won’t see it in the Categories list.

Fortunately, it’s easy to change the standard list of categories into a tree of categories, by borrowing a theme-altering trick you’ll explore in more detail in the next
chapter. Technically, the Categories list is known as a widget. Like all widgets, it can
be moved, removed, and reconfigured. Here’s how:
1. On the dashboard, choose AppearanceÆWidgets.
The Widgets page shows you all the individual ingredients that WordPress puts
into the sidebar on your site.
2. In the Main Sidebar box, find the Categories widget.
This is the widget that creates the list of categories that appears next to your
3. Click the down-pointing arrow on the right side of the widget.
This expands the Categories widget, so you can see its settings.
4. Turn on the checkbox in the “Show hierarchy” settings and then click Save.
Now return to your site and admire the result (Figure 4-20, right).
NOTE No matter what setting you tweak, WordPress always orders categories alphabetically. If you want
to put a specific category on top, you need to put in some extra work and create a menu (page 218).

Managing Categories
As you’ve seen, you can create a category whenever you need one, right from the
Add New Post or Edit Post page. However, the WordPress dashboard also includes



a page for managing categories. To get there, choose Posts→Categories, and you’ll
see a split page that lets you add to or edit your categories (Figure 4-21).



The Categories page
includes a section on
the left for adding new
categories and a detailed
list of all your categories
on the right. The categories list works in much
the same way as the list
of posts on the Posts
page. Point to a category
without clicking, and you
get the chance to edit or
delete it.

The Categories page lets you perform a few tasks that aren’t possible from the
lowly Categories box:
• Delete categories you don’t use. When you take this step, WordPress reassigns any posts in the category to the default category, which is Uncategorized
(unless you changed the default in the SettingsÆWriting page).
• Edit a category. For example, you might want to take an existing category and
rename it, or make it a subcategory by giving it a parent.
• Enter extra category information. You already know that every category
has a name and, optionally, a parent. In addition, categories have room for
two pieces of information that you haven’t used yet: a slug and a description.
The slug is a simplified version of the category name that appears in the web
address when you use pretty permalinks (page 115). The description explains
what the category is all about. Some themes display category descriptions in
their category-browsing pages.
Chapter 4: Creating Posts



Understanding Tags
Like categories, tags are text labels that add bits of information to a post. But unlike
categories, a post can (and should) have multiple tags. For that reason, the process of
applying tags is less strict than the process of putting your post in the right category.
Tags are often more specific than categories. For example, if you write a review of
a movie, you might use Movie Reviews as your category and the movie and director’s name as tags.
Follow these guidelines when you use tags:
• Don’t over-tag. Instead, choose the best five to 10 tags for your content. If you
use WordPress.com and you create a post with 15 tags or more, it’s much less
likely to appear in the WordPress.com tag cloud (page 41), which means new
visitors are less likely to stumble across your blog.
• Keep your tags short and precise. Pick “Grateful Dead” over “Grateful Dead
• Reuse your tags on different posts. Once you pick a good tag, put it to work
wherever it applies. After all, tags are designed to help people find related
posts. And never create a similarly named tag for the same topic. For example,
if you decide to add the tag “New York Condos,” and then you use the tags “NY
Condos” and “Condo Market,” you’ve created three completely separate tags
that won’t share the same posts.
• Consider using popular tags. If you’re on WordPress.com, check out popularly
used tags (page 39) and consider using them in your posts, when they apply.
If you’re trying to attract search engine traffic, you might consider using hot
search keywords for your tags (page 448).
• Don’t duplicate your category with a tag of the same name. That’s because
WordPress treats categories and tags in a similar way, as bits of information
that describe a post. Duplicating a category with a tag is just a waste of a tag.

Here’s some advice to help you get straight about categories and tags. Think of the category as the
fundamental grouping that tells WordPress how a post fits into the structure of your site. Think of a tag as a
searching convenience that helps readers hunt for content or find a related post.

Tagging Posts
Adding a tag to a post is even easier than assigning it to a category. When you create a post (in the Add New Post page) or edit a post (in the Edit Post page), look
for the Tags box, which appears just under the Categories box.
The Tags box gives you three ways to add tags:
• Type a tag into the text box, and then click the Add button. Repeat.



• Type all your tags into the text box at once. Make sure you place a comma
between each tag, as shown in Figure 4-22.


• Click the “Choose from the most used tags” link and pick from the tags you
used for other posts.


Left: Right now, this post has
one tag, Kuala Lumpur. It’s
about to get three more.
Right: Now the post has four
tags. If you change your mind,
you can remove a tag by clicking the ° icon that appears
next to it.

When you publish a post, the byline will list the post’s category and all its tags (Figure 4-23). You can follow these links to browse similarly tagged posts. Many blogs
also use a tag cloud, a cluster of tag links, sized in proportion to how often you use
them (in other words, in proportion to how many posts feature that tag). The default
WordPress site layout doesn’t use a tag cloud, but you can add one easily using the
Tag Cloud widget. You learn how on page 165.


The exact look of a post byline
depends on your theme, but
most list the categories and
tags you added to a post.

As with categories, tags have their own management page, which you can see by
choosing Posts→Tags. There you can add tags, remove tags, and edit the tag slugs,
which appear in the web addresses when you use pretty permalinks (page 117).

How to Get High-Quality Web Addresses
Every post you put on a WordPress site has its own unique web address, or URL. So
far, you haven’t really thought about what those URLs look like. After all, nobody
needs to type in a web address to read a post. Instead, people can simply visit the
front page of your site and click through to whatever content interests them.

Chapter 4: Creating Posts



However, seasoned web designers know that web addresses matter—not just for the
front page of your site, but for each distinct bit of content. One reason is that search
engines pay attention to the keywords in a URL, so they treat something like http://
wastedminutes.com/best_time_wasters differently from http://wastedminutes.com/
post/viewer.php?postid=3980&cat=83. All other factors being equal, if someone
searches for “time wasters” in Google, the search engine is more likely to suggest
the first page than the second.
Another important detail is the lifetime of your URLs. Ideally, a good web address
never changes. Think of an address as a contract between you and your readers.
The promise is that if they bookmark a post, the web address will still work when
they return to read it, even months or years later (assuming your entire site hasn’t
gone belly-up in the interim). WordPress takes this principle to heart. In fact, it calls
the unique web address that’s assigned to every post a permalink, emphasizing its
permanent nature.
As you’ll soon see, WordPress will happily give your posts meaningful web addresses
that last forever, but you might need to help it out a bit. Before you can do that, you
need to understand a bit more about how the WordPress permalink system works.
The details differ depending on whether you’re using WordPress.com or you’ve
installed WordPress on your web host. The following sections lay out the essentials.

Permalinks in WordPress.com
On a WordPress.com site, permalinks always follow this structure:

For example, if you create a blog named lazyfather.wordpress.com on November
27, 2014, WordPress will automatically create a post named “Hello world!” that has
a permalink like this:

The year, month, and day numbers are set when you create the post. The last
part—the post name—is based on the title of the post. WordPress changes spaces
to hyphens and ignores funky characters (like @, #, and $). If you create two posts
with the same name on the same day, WordPress adds a number to the end of the
second post title. (If you create a post with the same name but on a different day,
no problem, because the first part of the web address is already different.)
WordPress’s URL-generating strategy is a pretty good starting point. However, you
can change the address for any post when you create it. This is a great feature if you
think your post title is ridiculously long or if you have an idea for an address that’s
more likely to net you some serious search engine traffic. Page 119 explains how to
change a post’s permalink.



Permalinks on a Self-Hosted Site
Here’s the good news: If you use the self-hosted version of WordPress, you can
choose the permalink style. And here’s the bad news: If you don’t change it yourself,
you’ll be stuck with distinctly old-fashioned web addresses.


With the default permalink style, WordPress creates short but rather cryptic web
addresses that use the post ID. They follow this structure:

For example, if you create a WordPress blog at lazyfather.com/blog, the first “Hello
world!” post gets a permalink like this:

The post ID is a unique, sequential number that WordPress gives to every new post.
So it’s no surprise that the first post has a post ID of 1.
This permalink style is short, but it has no other benefits. The permalinks are meaningless to other people and search engines, because it’s impossible to tell what a
given post is about. Can you tell the difference between http://lazyfather.com/
blog/?p=13 (a post about cute family pets) and http://lazyfather.com/blog/?p=26
(a post about the coming Mayan apocalypse)? The post ID is essentially a secret
code that doesn’t mean anything to anyone except the web server database that
holds the collection of correspondingly numbered posts.
Even if you love the convenience of short web addresses (and who doesn’t?), you
almost certainly want to use a more descriptive permalink style. Fortunately, WordPress makes it easy. Just follow these steps:
1. In the dashboard, choose SettingsÆPermalinks.
The Permalinks Setting page appears.
2. Choose a new permalink style.
Your choices are listed under Common Settings:
• Default. This is the WordPress.org standard: brief but obscure permalinks
that use the post ID, like http://magicteahouse.net/?p=13.
• Day and name. This style is the same as the WordPress.com standard.
Permalinks include several pieces of information, including the year, month,
and date, separated by slashes. At the end is the much more descriptive
post name (a simplified version of the post title), as in http://magicteahouse.
• Month and name. This style is similar to “Day and name,” except that it
leaves out the date number, giving you a slightly more concise permalink,
like http://magicteahouse.net/2014/07/announcing-teas-from-kualalumpur.

Chapter 4: Creating Posts



• Numeric. This is a nicer looking version of the default style. It uses the
post ID, but without including the ?p= characters. Instead, it adds the text
/archives, as in http://magicteahouse.net/archives/13. However, this type
of permalink is still as clear as mud.
• Post name. This style omits all the date information, using just the post
name, as in http://magicteahouse.net/announcing-teas-from-kuala-lumpur.
The advantages of this system are that the permalinks it creates are concise
and easy to remember and understand. They don’t emphasize the date
the content was created, which is important if you have timeless content
that you want to refer to months or years later. One disadvantage is that if
you give more than one post the same name, WordPress needs to tack a
number onto the end of the permalink to make it unique.
• Custom structure. This is an advanced option that lets you tell WordPress
exactly how it should cook up permalinks. The most common reason to
use a custom structure is because you want the post category to appear
in your permalink (as explained in the box on page 119).
TIP If you don’t want to emphasize dates and you’re willing to put in a bit of extra work to avoid duplicate
titles, the “Post name” style is a great choice. If you’re concerned about clashing titles, “Month and name” is
safer, and if you want to emphasize the exact date of your posts—for example, if you write time-sensitive or
news-like content—“Day and name” is a good choice.


Understanding Permalink Codes
When you choose a permalink style other than Default, you’ll
notice that WordPress automatically inserts the matching codes
in the “Custom structure” box. For example, if you choose “Day
and name,” these codes appear:



Then it replaces the %monthnum% code with the two-digit
month number:

Think of this as a recipe that tells WordPress how to build the
permalink. Each code (that’s the bit of text between percentage
signs, like %year% and %monthnum%) corresponds to a piece
of information that WordPress will stick into the web address.

It carries on until the permalink is complete:

In this example, four codes are separated by three slashes.
When WordPress uses this format, it starts with the site address
(as always) and then adds the requested pieces of information, one by one. First it replaces the %year% code with the
four-digit year number:

You don’t need to understand WordPress’s permalink codes in
order to use different permalink styles. However, you do need
to understand them if you want to create your own recipe for
generating permalinks, as described in the box on page 119.



3. Click Save Changes.
WordPress applies the permalink change to your entire site. That means that
WordPress updates any posts you already published to the new style. If you’re
switching from the standard style to another style, this never causes a problem,
because the ID-based links continue to work. (That’s because no matter what
permalink style you use, WordPress continues to give each post a unique post
ID, which it stores in its database.) However, if you switch to a second permalink style (for example, “Day and name”) and then to a third style (say, “Month
and name”), the outlook isn’t so rosy. Anyone who bookmarked a “Day and
name”–style URL will find that it no longer works.



If you want to tweak the way your WordPress site generates permalinks (and if you’re using the
self-hosted version of WordPress, you almost certainly do), it’s best to make that change as soon as possible.
Otherwise, changing the permalink style can break the web addresses for old posts, frustrating readers who have
bookmarked them. Think twice before tampering with the URL structure of an established site.


Create Permalinks That Include the Category
If you’re ambitious, you can make deeper customizations to
the way WordPress generates post permalinks. To do that, you
need to choose the Custom Structure permalink type, and then
fill in your permalink “recipe” with the right codes.
WordPress recognizes 10 codes. More than half are date-related:
%year%, %monthnum%, %day%, %hour%, %minute%, and
%second%. Additionally, there’s a code for the category slug
(%category%) and the author (%author%). Finally, every permalink must end with either the numeric post ID (represented
by %post_id%) or post name (%postname%), because this is
the unique detail that identifies the post.
Often, WordPress gurus use a custom permalink structure that
adds category information. They do so because they feel that
the permalinks are aesthetically nicer—in other words, clearer
or more meaningful—or because they think that this increases

the chance that search engines will match their post with a
related search query.
Here’s an example of a custom permalink structure that creates
category-specific permalinks:

Now WordPress creates permalinks that include the category
name (in this case, Tea) and the post name (The Origin of
Tea), like this:

This type of URL doesn’t work well if you assigned some of your
posts more than one category. In such a case, WordPress picks
one of the categories to use in the web address, somewhat unpredictably. (Technically, WordPress uses the category that has
the lower category ID, which is whichever one you created first.)

Changing a Post’s Permalink
Most WordPress fans prefer pretty permalinks— web addresses that include the
post title. If you use WordPress.com, your posts always use pretty permalinks. If
you use a self-hosted WordPress site, you get pretty permalinks in every permalink
style except Default and Numeric.

Chapter 4: Creating Posts



However, pretty permalinks aren’t always as pretty as they should be. The problem
is that a post title doesn’t necessarily fit well into a web address. Often, it’s overly
long or includes special characters. In this situation, you can help WordPress out
by explicitly editing the slug—the version of the post name that WordPress uses in
your permalinks.
You can change the slug when you add or edit a post. Here’s how:
1. Find the permalink line, which appears just under the post title text box.
WordPress creates the slug automatically, once you type in the post title and
start entering the post content. After that point, the slug doesn’t change, even
if you edit the title, unless you edit it explicitly.
2. Click the Edit button next to the permalink line (Figure 4-24).
WordPress converts the portion of the permalink that holds the slug into a text
box. You can then edit to your heart’s content, so long as you stay away from
spaces and special characters, which aren’t allowed in URLs. The best permalinks are short, specific, and unlikely to be duplicated by other posts. (Although
WordPress is smart enough to refuse to use a slug you assigned to another post.)

If you see a Change Permalinks button next to the permalink where the Edit button should be, you
don’t have pretty permalinks turned on. To fix the problem, follow the steps on page 117.

3. Click OK to make your change official.


Here, you’re cutting
the unwieldy slug
“announcing-teas-fromkuala-lumpur” down
to size.




WordPress is very conscientious about dealing with old permalinks. If visitors try to find a post using
an old permalink that has since changed, WordPress automatically forwards them to the right post and correct
web address. This trick makes sure that old bookmarks and search engines that link to your site keep working.


Getting a Shorter Version of Your Web Address
Pretty permalinks are memorable and, if you don’t include the date information,
fairly simple. However, they can still be inconveniently long for certain situations.
Sometimes, you might need a shorter address that points to a post—one that’s easier
to jot down or fit in the confines of a Twitter message. And although you can cut a
permalink down to size when you create a post, it still might not be short enough.
WordPress is ready to help. It gives you two ways to reach every post you create: a
permalink (like the ones you’ve been using so far), and a leaner URL called a shortlink. Shortlinks work just as well as permalinks, and you can use both types of link
at once, depending on what you need, without confusing WordPress.
Shortlinks look different depending on whether you’re using a self-hosted WordPress
site or WordPress.com. In a self-hosted site, the shortlink uses the Default permalink
style. It’s your site address, with the numeric post ID:

WordPress.com takes a different approach. It uses its own URL-shortening service,
called WP.me, to ensure that you get a micro web address like this:

Even though it points to what seems like a completely different website, this shortlink
redirects visitors to the right blog post on the right WordPress.com site. Best of all,
the entire shortlink requires a mere 22 characters, which is just about as short as
they come.
WordPress doesn’t offer the shortlink option until you publish your post. In fact, to
get it, you need to start editing your post (page 102). Once you’re there, click the Get
Shortlink button that appears in the permalink line (or just underneath it, depending
on how much room WordPress has). WordPress pops open a new window with the
shortlink for your post (Figure 4-25).

Chapter 4: Creating Posts




Here’s the post’s shortlink, ready for copying.


Making Your Shortlinks Even Smaller
If you have a self-hosted WordPress site, the shortlink
might not be as short as you want. It works great if you use
WordPress to run your entire site and you have a nice, short
domain name. But if you have a long domain name with your
WordPress content in a subfolder, you end up with a not-soshort shortlink, like this:

It might occur to you to use the WP.me service to get an
even shorter web address, but unfortunately it’s limited to
WordPress.com sites. However, there are other URL-shortening
services that will take your address and spit out a tinier
version. Popular shortener sites include http://bit.ly (which
Twitter uses for automatic URL-shrinking), http://tinyurl.com,
and http://tiny.cc .


For example, if you plug your web address into bit.ly, you get
a new one, like this:

Weighing in at a mere 20 characters, this address is even
shorter than the ones WP.me creates. If someone types that URL
into a browser, they’ll go first to the bit.ly web server, which
will quickly redirect the browser to the original web address.
The end result is that your post appears almost immediately.
Using any of these URL-shortening services is easy. Just go to
the website, paste in your web address—either the permalink
or shortlink, it doesn’t matter—and then copy the new condensed address.


Browsing Categories and Tags Using a Web Address
Earlier, you saw how the Categories widget lets you retrieve a list of posts for any
category. For example, click the Herbal Tea link and—presto!—you see the posts
about brewing your favorite dried leaves.


WordPress works this category-browsing magic using a specific form of web address.
If you understand it, then you can use category web addresses yourself, wherever
you need them. First, you start with the site address:

Then, you add /category/ to the end of the address, like this:

Finally, you add the bit that identifies the category you want to use. If you use the
default permalink style on a self-hosted site, you get awkward category web addresses that incorporate the category ID:

But if you use pretty permalinks, life is much better. Then, instead of embedding
the category ID, category web addresses use the much more readable category
slug, like this:

WordPress cooks up the slug based on your category name, using the same process
it follows to pick the slug for a new post. First, WordPress replaces every uppercase
letter with a lowercase one. Next, it replaces spaces with hyphens (-). Lastly, it strips
out forbidden special characters, if you used them. As a result, the category Herbal
Tea gets the slug herbal-tea.
Remember, you can modify the slug for every category using the Categories page
(page 113). For example, you can shorten the address shown above by replacing
herbal-tea with the simpler slug herbal.
Tags work the same way as categories, except the /category/ portion of the web
address becomes /tag/. So, to browse the posts that use a specific tag, you need
an address like this:

You can tweak tag slugs in the Tags page. However, it’s far less common to tailor
tag slugs than it is to edit post and category slugs.

Dashboard Tricks to Save Time and Effort
As you’ve learned, the dashboard is the key to unlocking your WordPress site. So
far you’ve used it to work with posts: creating them, changing them, and deleting
them. You also managed categories and tags, and tweaked a variety of WordPress

Chapter 4: Creating Posts



settings. But you’re far from exhausting the dashboard—in fact, you’ll spend the
better part of this book exploring its nooks and crannies.
Now, here are a few tips that can improve your dashboard skills. You’ll learn to customize the dashboard display, get help, and work with lists—basics that will prepare
you for the administrative tasks to come.


Being in Two Places at Once
One potential problem with the dashboard is that it lets you
view only one page at a time. This limitation can become
awkward in some situations. For example, imagine you’re in
the middle of creating a post when you decide you want to
review a setting somewhere else in the dashboard. You could
save the post as a draft, jump to the settings page, and then
return to continue with your post. And, for many people, this
approach works just fine. But if you’re the sort of power user
who’s comfortable with browser shortcuts, there’s another
approach that may appeal: opening more than one browser
page at a time, with each positioned on a different part of
the dashboard.
It all works through the magic of the Ctrl-click—a nifty browser
trick where you hold down the Ctrl key (Command on a Mac)
while clicking a link. In modern browsers, this causes the target

of the link to open in a new tab. This trick doesn’t work with
all websites, particularly those that use JavaScript routines in
the place of ordinary links. But in the WordPress dashboard,
it flows without a hitch.
For example, imagine you’re at the Add New Post page and
you want to review your post display settings. To open the settings page in a new tab, hover over Settings in the dashboard
menu and Ctrl-click the Reading link. Keep in mind, however,
that if you change something in one tab that affects another,
you might not see the results of your change right away. For
example, if you add a category on the Categories page while
the Add New Post page is open, you won’t see it in the Add
New Post page unless you refresh the page. (But don’t forget
to click Save Draft first if you want to keep your post!)

Customizing a Dashboard Page
When you navigate to a dashboard page, you don’t always see all the settings you
can adjust. WordPress tries hard to offer you real power and flexibility without
overloading your brain with features and settings.
However, you’ll sometimes need to adjust one of WordPress’s hidden settings. (Or
you’ll want to hide some of the settings WordPress does show, just to clear away the
visual clutter.) Either way, the secret is the Screen Options button, which controls
exactly what WordPress displays on the page.
If you haven’t noticed the Screen Options button yet, that’s because it’s carefully
tucked away in the top-left corner of the dashboard (circled in Figure 4-26). However, you’ll see it on nearly every dashboard page. When you click Screen Options,
a new panel pops into existence at the top of the page (Figure 4-27). To collapse
the panel, click the Screen Options button again.





Almost every dashboard
page sports the Screen
Options and Help buttons
shown here. They’re
the key to unearthing
WordPress’s hidden
options—and figuring out
how they work.


Here are the screen options for the Add New Post
page. Using them, you
can manage two things:
the controls WordPress
displays on the page
(using the checkboxes
under “Show on screen”),
and the way WordPress
presents those controls
(using the settings under
Screen Layout).

To understand how the Screen Options box works, you need to understand that
every checkbox in it corresponds to a gray panel that WordPress can either show
or hide. For example, in Figure 4-28, the Format, Categories, Tags, and Featured
Image checkboxes are turned on, and so the Format, Categories, Tags, and Featured
Image panels appear on the page. (So does the Publish panel, which doesn’t have a
corresponding checkbox, because WordPress won’t let you hide it.)
But the Screen Options box in Figure 4-28 also includes several unchecked boxes,
such as Excerpt, Send Trackbacks, Custom Fields, and so on. Many of these correspond to panels with less commonly adjusted settings. They’re hidden (by default),
because WordPress assumes you don’t need them and don’t want to be distracted
with more details. But if you turn on one (or more) of these checkboxes, the corresponding panels appear on the page.

As you work through this book, you’ll find that you sometimes do need to dip into the screen options
to display panels that WordPress ordinarily hides. Now that you know how the Screen Options button works, you’ll
be ready.

Chapter 4: Creating Posts



Not only can you show and hide the panels in a dashboard page, but you can also
move them around. Just click a title at the top of the panel (like “Categories”) and
drag it to a new place on the page. WordPress automatically rearranges the other
panels to make room. This is a great way to make sure that the options you use most
often are right at your fingertips. (Watch out, though: If you click the title of a panel
and don’t drag it somewhere else, WordPress collapses that panel so that only the
title remains visible. Click the title again to expand it.)
Finally, there’s one really useful dashboard customization trick that can help when
you create or edit a huge post. If you click the bottom-right corner of the post editor and drag down (Figure 4-28), you can make the editing box as big as you want.


Need more space to edit a long
post without scrolling? Click
here and drag down.

Getting Help
Soon you’ll be a WordPress administration guru. But in the meantime, you’ll occasionally face perplexing settings in the WordPress dashboard. The Help button
isn’t perfect, but it can be useful sometimes.
You’ll find the Help button right next to the Screen Options button, in the top-right
corner of nearly every dashboard page. When you click it, a small panel with help



information drops into view. To collapse the panel, click the Help button again. Figure
4-29 shows the help for the Add New Post page.



WordPress’s help box
is packed with terse
but potentially helpful
information. Click a
link on the left side to
choose your topic. (This
example shows Publish
Settings.) On the right are
additional links that can
take you to WordPress’s
official documentation (be warned, it’s
sometimes out of date)
or the forums (where you
can ask friendly strangers
for help).

Taking Charge of the List of Posts
You’ve already seen the Posts page, which lists the posts on your site. However, as
your site grows larger, it becomes increasingly difficult to manage everything on
one page, and in a single table. To get control of your posts, you need to develop
your searching and filtering skills.
First, it’s important to realize that the Posts page doesn’t list everything at once.
Instead, it shows up to 20 posts at a time—to get more, you need to click the arrow
buttons that show up in the bottom-right corner of the list. Or you can adjust the
20-post limit: just click the Screen Options button, change the number in the Posts
box, and then click Apply.
NOTE If you allow more posts on your Posts page, you’ll get a slower-to-load page and a longer list to
scroll through. Of course, there’s nothing wrong with bumping up the limit for certain tasks (say, to 100), and
then changing it back when you finish.

Changing the number of posts is one way to fit more posts into your list, but it isn’t
much help if you want to home in on a specific batch of posts that might be scattered throughout your site. In this situation, WordPress has another set of tools to
help you out: its filtering controls. Using the drop-down lists at the top of the table
of posts (Figure 4-30), you can choose to show only posts that were made during

Chapter 4: Creating Posts



a specific month (for example, “June 2014”) or that belong to a specific category
(say, “Green Tea”).


To filter a list of posts,
choose a specific month
or category (or both), and
then click Filter. Here, the
list shows the posts in the
News category.

Ordinarily, WordPress displays posts in the same reverse-chronological order that
they appear on your site. But you can change that by clicking one of the column
headings. Click Title to sort alphabetically by headline, or Author to sort alphabetically by writer. If you click the column heading a second time, WordPress reverses
the sort order. So if you sort a list of posts by Title, clicking Title a second time
shows the posts in reverse-alphabetical order. And if you sort posts by Date, so
that the newest posts appear first, clicking Date again displays the posts with the
oldest ones on top.
The last trick that the Posts window offers is the search box in the top-right corner,
above the posts list. You can search for all the posts that have specific keywords in
their titles or text. For example, to show posts that talk about veal broth, you would
type in “veal broth” (using quotation marks if you want to turn both words into a
single search term), and then click Search Posts.

Performing Bulk Actions
So far, you’ve worked on one post at a time. If you plan to change a post’s title or
edit its text, this is the only way to go. But if you want to manipulate several posts
in the same way—for example, change their category, add a keyword, or delete
them—the Add Posts page lets you carry out your work in bulk.



The easiest bulk action is deleting. To send a batch of posts to the trash, follow
these simple steps:


1. Choose PostsÆAll Posts on the dashboard.
That takes you to the familiar All Posts page.
2. Find the posts you want.
If you don’t see all the posts you want to remove, then use the search or filtering
techniques described on page 128.
3. Turn on the checkbox next to each post you want to remove.
4. In the Bulk Actions list, choose Move to Trash.
The Bulk Actions list appears in two places: just above the list of posts and just
underneath it. That way, it’s easily accessible no matter where you are.
5. Click Apply.
WordPress moves all the selected posts to the trash.
You can also use a bulk action to make certain post changes. For example, you can
add tags to your post, change the author, or simultaneously publish a group of drafts.
The steps are similar but slightly more involved. Here’s what to do:
1. Choose PostsÆAll Posts on the dashboard.
2. Find the posts you want (search or filter the posts if needed).
3. Turn on the checkbox next to each post you want to edit.
4. In the Bulk Actions list, choose Edit and then click Apply.
WordPress opens a panel at the top of the post list with editing options (Figure
5. Manipulate the details you want to change.
Using the Bulk Edit panel, you can add tags (type them in) or apply a category.
However, you can’t remove tags or change the category. That means that if
you apply a new category, your posts will actually have two categories, which
probably isn’t what you want. (Sadly, you have to remove the category you
don’t want individually, post by post.)
The Bulk Edit panel also lets you change the post’s author (if your site has more
than one), its status (for example, turning a draft into a published post), and a
few other settings that you’ll explore in the coming chapters.

Chapter 4: Creating Posts




The Bulk Edit panel lists
posts you’re editing en
masse (in this example,
there are three), and provides a limited number
of editing options. Here,
you’re adding a new tag
to the three posts.

6. Click Update in the Bulk Edit panel.
Or back out by clicking Cancel.

Here’s a dashboard double-trick that combines filtering and bulk actions. Say you decide to change all
the posts in a category. First choose the category in the filter list (above the list of posts) and then click Filter.
You’ll see a list that includes only the posts in that category. To select all these posts, turn on the checkbox that
appears in the top-left corner of the post list, next to the word “Title.” Now you can pick your universal action
from the Bulk Actions box and carry on.


Posting with Your Phone or Tablet
The dashboard is stocked full of power-user tools. But it’s
impossible to beat the convenience of posting far from your
computer, wherever you are, using a few swipes and taps on
your favorite mobile device. In the past, developers created
plug-ins that made mobile posting possible. Today, WordPress


itself has taken over that role, and it offers an impressive range
of free mobile apps at http://wordpress.org/mobile. You’ll find
apps that work with iPads, iPhones, Android devices, BlackBerries, Windows phones, and more. All the apps are polished,
professional, and free.



Choosing and Polishing
Your Theme



sing the skills you picked up in the previous chapters, you can create a WordPress site and stuff it full of posts. However, your site will still come up short
in the looks department. That’s because every new WordPress site starts out
looking a little drab, and pretty much the same as everyone else’s freshly created
WordPress site. If that sounds colossally boring to you, keep reading, because this
chapter shows how to inject some serious style into your site.
The key to a good-looking WordPress site is the theme you use. Essentially, a theme
is a set of files that control how WordPress arranges and styles your content, transforming it from raw text in a database into beautiful web pages. You can think of a
theme as a visual blueprint for your content. Themes tell WordPress how to lay out
the components of your site, what colors and fonts to use, and how to integrate
pictures and other graphical details.
Every WordPress site starts out with a standard theme. Right now, yours uses the
straightforward Twenty Twelve theme (assuming you followed the instructions on
page 93). In this chapter, you’ll learn how to enhance the Twenty Twelve theme or
pick a stylish new one from the hundreds that WordPress offers. You’ll also see how
to choose sidebar widgets and arrange them on your site. Master these skills, and
you can transform your site from standard-issue plainness to eye-popping pizzazz.



How Themes Work
One of WordPress’s most impressive tricks is the way it generates web pages dynamically, by pulling content out of a database and assembling it into just the right
web page. Themes are the key to this process.
In an old-fashioned website, you format pages before you upload them to your web
server. If you want your site to look different in any respect, you have to update your
pages and re-upload the whole site. But in a WordPress site, your content and your
formatting information are separate, with your theme handling the formatting. As
a result, you can change the way WordPress styles your pages by editing or changing your theme, without needing to touch the content. The next time someone
requests a page, WordPress grabs the usual content and quietly applies the latest
formatting instructions.
So how does a theme work its content-formatting magic? Technically, a theme is a
package of files. Most of them are templates that set out the structure of your pages.
For example, the template file header.php determines how the header at the top
of every page on your site looks (see Figure 5-1), and the template file single.php
assembles the content for a single post.
Each template includes a mixture of HTML markup and PHP code. (If you’re fuzzy
on these web basics, know that HTML is the language in which all web pages are
written, and PHP is one of many web programming languages you can use to create
dynamic content.) You won’t actually touch the template files in this chapter, but
you’ll learn how to edit them later, in Chapter 13.
Along with your template files, WordPress uses a style sheet, named style.css, that
supplies formatting information for virtually every heading, paragraph, and font on
your site. This style sheet uses the CSS (Cascading Style Sheets) standard, and it
formats WordPress pages in the same way that a style sheet formats almost every
page you come across on the Web today. There’s no special WordPress magic here,
but you can edit your theme’s style sheet to add special effects, like fancy fonts
(page 481).

The WordPress “Year” Themes
Every new WordPress site starts out with a default theme. Odds are it’s a year theme,
one of a few standard themes officially sanctioned by the team of WordPress developers. We call them year themes because WordPress releases them annually and
names them after the year in which they appear. The first year theme was named
Twenty Ten. It was followed by the Twenty Eleven theme, the Twenty Twelve theme,
and so on (see Table 5-1 for the full list). The fine folks at WordPress plan to continue
this release pattern for the foreseeable future.





Each WordPress site uses
a single theme, and each
theme includes a pile
of interrelated template
files that control different
parts of your site.

Chapter 5: Choosing and Polishing Your Theme



TABLE 5-1 The WordPress year themes


Twenty Ten

Provides a slightly old-style blog look, with
a traditional arrangement: header and menu
at the top, list of posts underneath, and a
sidebar on the right side. Colors and fonts
start out plain and simple.

Twenty Eleven

Provides a similar layout to Twenty Ten, but
adds a few Zen touches: bigger image headers, bigger text, and much more whitespace.
(But mind the gap—some WordPress fans
don’t like Twenty Eleven’s extra padding.)

Twenty Twelve

Offers a clean, refined theme with great
typography and a streamlined layout. Some
will find it bland, but its elegant design
touches have kept it popular to this day. It
also has particularly good support for mobile
devices (as you’ll see on page 168).

Twenty Thirteen

Features snazzy text, generous whitespace
that recalls Twenty Eleven, and an Arizonaesque red-orange color scheme. The
WordPress team was aiming for a colorful,
fun look, but some people find this theme a
bit too distinctive for their sites.

Twenty Fourteen

Provides a modern black-and-white theme
with unarguable good looks. However, its
stark and serious look doesn’t suit everyone.
Consider this theme if your site is heavy on

The year themes are also called the default themes, because most sites start out
using one of them. If you run a self-hosted WordPress site, it comes with the most
recent year themes preinstalled (currently, that’s Twenty Twelve, Twenty Thirteen,
and Twenty Fourteen). If you host your site with WordPress.com, you get easy access to all the year themes.

At the time of this writing, all new self-hosted WordPress sites start out using Twenty Fourteen, a
magazine-style theme with a heavy black frame. It feels slick, serious, and dark, and it’s best suited to photo
sites and news magazines, rather than traditional blogs. For that reason, you switched your site to the simpler
Twenty Twelve theme on page 93 to practice posting.




What’s in a Name: The Year Themes
The year themes often confuse WordPress newcomers. The
naming system seems to imply that older year themes are
out of date, and that newer year themes are their natural
successors. But that’s not true.
First, it’s important to understand that each year theme is a
new creation. For example, the Twenty Fourteen theme was
adapted from an existing community theme called Further that
was initially built by Takashi Irie, while the Twenty Thirteen was
designed in-house by the WordPress experts at Automattic.
The two themes are entirely different and independent; Twenty
Thirteen didn’t evolve into Twenty Fourteen.
Similarly, newer year themes don’t replace older ones. WordPress clearly states that the goal of each year theme is to be
different, thought-provoking, and useful. The goal is not to

provide a single all-purpose theme that satisfies everyone.
That’s why the appearance of Twenty Thirteen is radically
different from Twenty Fourteen, and why many WordPress
gurus still rely on older classics like Twenty Twelve to get the
balance of features and style they want. (That said, the two
oldest year themes, Twenty Ten and Twenty Eleven, don’t work
as seamlessly with mobile devices. To save yourself some work,
pick a later year theme instead.)
When WordPress releases Twenty Fifteen, it will offer yet
another new style that doesn’t replace the themes that have
gone before. This change won’t affect you, however, because
you’re about to learn how to make any theme work for you—
and how to find even more specialized themes in WordPress’s
expansive theme catalog.

Making Your Theme Suit Your Site
Now that you have a basic idea of how themes work, you’re ready to start improving
the look of your site. There are several paths you can take to change the appearance of your theme, depending on how dramatic your alterations are. Your choices
include these:
• Changing to a different theme. To give your site a dramatic face-lift, you can
pick a completely different theme. With that single step, you get new fonts,
colors and graphics, a new layout, and—sometimes—new features. WordPress.
com users have over 250 themes to pick from, while WordPress self-hosters
can choose from thousands more.
• Tweaking your theme settings. WordPress gives you a number of useful ways to
personalize your theme. The options depend on the theme, but you can usually
alter a theme’s color scheme, change the header picture, and shift the layout.
• Customizing your widgets. Most WordPress themes include one or more
sections you can customize, like a sidebar you can stock with various links. The
sections in the sidebar are called widgets, and you can change them, rearrange
them, and add new ones.
• Editing your theme. Advanced WordPress fans can crack open their theme
files, work on the code with some help from this book, and make more substantial changes. The simplest modification is to fine-tune the CSS styles that
format your pages. More ambitious theme hackers can change virtually every
detail of their sites.
Chapter 5: Choosing and Polishing Your Theme



In the rest of this chapter, you’ll tackle all these tasks except the last (hardcore theme
editing), which you’ll study in Part 4 of this book.

Choosing a New Theme
Choosing a theme is the Big Choice you make about your site’s visual appearance.
Themes determine a number of important design details—for example, the way
WordPress uses graphics, fonts, and color across your pages, and the overall layout
of your header, sidebar, and footer. It also determines the way WordPress presents
key ingredients, like the date of a post, the post’s category and tag information, and
the links that guests use to browse through your archives. An ambitious WordPress
theme can rework almost every visual detail of your site (Figure 5-2).


The Greyzed theme
creates a grungy effect
that looks like lined paper
on stone. Every design
detail—from the look of
the menu to the widget
titles—differs from a
plain-vanilla WordPress

WordPress tailors some themes for specific types of content. You can find custom
themes for travel blogs, photo blogs, and magazine-style news blogs. There are even
themes that lean heavily toward specific topics, including one for coordinating and
celebrating a wedding (called Forever) and one that looks like the old-school Mac
desktop (called Retro MacOS). Figure 5-3 shows the latter.
Themes also influence the way your site works, in ways subtle and profound. For
example, some themes tile your posts instead of putting them in a top-to-bottom
list (which is great if you want your site to show a portfolio of work rather than a list



of articles, as demonstrated on page 343). Or your theme may include a fancy frill,
like a slideshow of featured posts (page 192).



A theme for old-school
Mac aficionados may be
a bit excessive for an
ordinary site. But the
theme is put to good
effect on this Mac-centric
sample site.

Even if you’re happy with the standard WordPress theme, it’s worth trying out a few
others, just to open your mind to new possibilities. As you’ll see, although changing
a theme has a profound effect on the way your site looks, doing so is almost effortless. And most themes are free, so there’s no harm in exploring.
The only limitation with WordPress themes is that somewhere in cyberspace, there
are sure to be plenty of other websites using the same theme as you. This isn’t a
huge problem, provided that you’re willing to customize your site in little ways—for
example, by choosing a suitable header picture, as described in this chapter. (It’s
also true that no matter what your site looks like, its content makes it unique.)

However, if you’re a style-conscious site designer who wants a distinctive theme, you run a self-hosted
site, and you aren’t put off by a bit of hard work, you can customize any theme. Chapter 13 explains how.

Chapter 5: Choosing and Polishing Your Theme



Visiting the Theme Gallery
To change your theme, visit the Themes page (Figure 5-4) by choosing
Appearance→Themes in the dashboard.


On the Themes page,
WordPress displays all
the themes currently
installed on your site.
In this freshly created
self-hosted WordPress
site, you start with three
choices. The first theme
in the gallery (here,
that’s Twenty Fourteen)
is the one that your site
currently uses.

The theme gallery looks slightly different for WordPress.com sites than it does for
self-hosted sites. If you use WordPress.com as your host, the gallery includes every
supported theme, more than 250 at the time of this writing. Some themes come
with a price tag, in which case you’ll see a Purchase link with a dollar figure—usually
between $50 and $100.
If you run a self-hosted WordPress site, you’ll find the theme gallery fairly sparse.
A standard WordPress installation includes the latest year themes (currently, that’s
Twenty Twelve, Twenty Thirteen, and Twenty Fourteen), and nothing else. You need
to add any other theme you want to use. Fortunately, there’s no reason to fear this
process—new themes take up very little space, installing them takes mere seconds,
and you can do it all without leaving the dashboard.
The following sections explain the theme-changing steps you need to follow, depending on how you host your site.

Some web hosts preinstall extra WordPress themes. If you use one of these hosts, your theme gallery
won’t start out quite as empty as just described. However, you’ll probably still need to install new themes to find
the one you really want.



Activating a Theme in WordPress.com
In WordPress.com, the Themes page is a crowded place. At the top of the list is
the theme your site currently uses. After that are all the themes that WordPress.
com offers.


Roughly two-thirds of the themes on WordPress.com are free. The others—recognizable by the green price tag circles next to their names—are premium themes that
require a one-time fee. The average premium theme costs around $70, although
they range from $18 to $125. Once you buy a theme, it’s yours forever—or at least as
long as you keep the site. But if you want to use the same premium theme on more
than one WordPress.com site, then you need to buy a separate copy for each site.

If you want the freedom to experiment with multiple premium themes, consider buying the Unlimited
Premium Themes upgrade (available from the dashboard’s Store menu). It costs a reasonable $120, although you
need to pay that fee every year.

If you’re interested in free themes only, click the Free link at the top-right corner of
the theme gallery (Figure 5-5).


WordPress.com lets you
sort the theme gallery so
the theme you want is
more likely to turn up at
the top, or filter it so you
see just free themes or
just premium themes.

You can choose how WordPress sorts the themes list by clicking one of the three
links in the top-left corner. Ordinarily, it sorts the list in trending order, which puts

Chapter 5: Choosing and Polishing Your Theme



new, hot standouts at the top of the list. Alternatively, you can sort by popularity,
but be warned that this list is skewed to long-lived themes, like Twenty Eleven, found
on legions of old blogs. Finally, you can sort by date to spot just the newest themes,
which is handy for keeping up with the latest additions to the gallery.
The most useful theme-hunting tool is the search box just above the gallery. If you
remember a theme you browsed before, or you have a theme characteristic in mind
(say, “minimalistic” or “dark”), you can type that in. WordPress.com filters the list
as you type.
When you find a promising theme, point to it without clicking your mouse. You’ll
see several buttons (Figure 5-6):
• Theme Details displays basic information about the theme, including a brief
description and a link to the person or company that created it.
• Preview opens a preview window that shows your site dressed in this theme.
It’s called a live preview because you can treat it exactly as you would a real
site—clicking links, browsing content, and feeling your way around. Usually,
the live preview is enough for you to decide whether you really do want the
theme you’re checking out. Click Cancel when you finish, or Activate to apply
the theme to your site.
• Activate reconfigures your site to use this theme. The changeover happens
• Purchase replaces the Activate button for premium themes. Clicking this button
starts the checkout process. Once you cough up the fee, WordPress activates
the theme.


Point to a theme’s thumbnail, and you see these
three buttons.



Don’t be shy—you can activate one theme, and then another, and then another, until
you find the right one for your website. When you pick a new theme, WordPress may
prompt you to start customizing it with the theme customizer (page 152). However,
it’s generally easier to customize your theme using the group of pages under the
dashboard’s Appearance menu, because the options there are more comprehensive.
You’ll start customizing your theme on page 145.


Installing a Theme on a Self-Hosted Site
Before you can switch to a new theme on a self-hosted WordPress site, you need to
install the theme itself. To see the themes you can add, click the Add New button
next to the Themes heading at the top of the Themes page. This takes you to the
Add Themes page, where you can browse WordPress’s theme repository to find
exactly what you want (Figure 5-7).
Initially, the Add Themes page shows you a list of featured themes, which are new
and particularly noteworthy designs that the folks at WordPress think might interest
you. If they don’t, you can browse the most popular themes (click Popular) or the
most recent ones (click Latest).


The Add Themes page
crams several themefinding tools into one
place. When you first
arrive, you see a gallery
of featured themes, like
this one.

Browsing is fine, but the most powerful way to hunt down new themes is with a
search. The Add Themes page gives you two ways to do that: by keyword and by

Chapter 5: Choosing and Polishing Your Theme



To search by keyword (for example, “magazine” or “industrial” or “professional”),
type the word in the search box and then click Search. WordPress shows you themes
that have that search term in their names or descriptions.
TIP Here’s a trick to see even more themes: Leave the search box empty, and then press the Enter key. You’ll
get a list of well over 1,000 themes.

To search by feature, click Feature Filter. WordPress displays a long list of checkboxes,
representing different features and theme characteristics (Figure 5-8). Turn on the
checkboxes for the features you want, and then click Apply Filters.

You can’t search by keyword and filter by feature at the same time.


The Feature Filter helps
you find themes that
meet specific criteria. This
search will find themes
that feature the color
green and use a threecolumn layout. (More than
50 do.)



No matter how you find a theme, you install them all the same way. First, point to
your new theme without clicking the mouse. The Install and Preview buttons appear
(Figure 5-9, top). Click Preview to see a sample site that uses the theme, and to read
a brief description of the theme and the person or company that created it. Click
Install to copy the theme to your website so it’s ready to use.


TIP Don’t be afraid to install a theme that you might not want to use—all the themes in the WordPress repository are guaranteed to be safe and spyware-free. And don’t worry about downloading too many themes—not
only are they tiny, but you can easily delete those you don’t want.

Once WordPress installs a theme, it gives you three choices (Figure 5-9, bottom):
• Live Preview. This opens a window showing you what your site would look
like if WordPress applied the chosen theme. Think of it as a test drive for a
prospective theme. You can read posts, search your site, and click your way
around your content, secure in the knowledge that you haven’t changed the
real, live version of your site.
• Activate. Click this to start using the theme.
• Return to Theme Installer. This takes you back to the Add Themes page (Figure
5-7), where you can search for another theme.


Top: When you’re ready
to take a closer look at
a theme, point to it and
click Preview.
Bottom: WordPress has
finished installing the
latest version of the
Alexandria theme on your
site. Click Activate to start
using it.

Chapter 5: Choosing and Polishing Your Theme



To see all the themes you’ve installed on your site so far, choose Appearance→Themes.
This returns you to the theme gallery. To take a closer look at a theme, point to it.
If you point to the theme you currently use, you’ll see a Customize button, which
launches the theme customizer (page 152). If you point to one of the other themes,
you’ll see two familiar buttons: Live Preview, which lets you test drive the theme;
and Activate, which applies it to your site.
Once you activate a theme, the best way to get familiar with it is to poke around.
Try adding a post, viewing it, and browsing the list of posts on the home page, just
as you did in Chapter 4. Check out the way your theme formats the home page and
presents individual posts.
Once you familiarize yourself with your new theme, you’ll want to check out its options and consider tweaking it. That’s the task you’ll tackle next.
NOTE There’s one other way to add a theme: by uploading it from your computer to your site, using the
Upload button on the Add New themes page. You’ll use this option only if you find a theme on another site, buy
a premium theme from a third-party company, or build the theme yourself.


The Proper Care of Your Themes
When you install a theme on a self-hosted site, you get the
current version of the theme. If the theme creator releases a
new version later, your site sticks with the old version.
That makes some sense, because WordPress has no way to be
sure that the new version of the theme won’t make drastic
changes that break your site. But this design also raises the
risk that you might ignore an important security update for
one of your themes, thereby exposing your site to an attack.
(Remember, themes contain templates, and templates contain
PHP code, so themes can create security vulnerabilities.)
To minimize your risk, check regularly for theme updates. Go
to Dashboard→Updates and look at the Themes section. If a
theme has been updated, WordPress lists it here, and compares

the version number of your copy with the version number of
the latest release. If your site has multiple themes installed,
WordPress shows the updates for all of them—it makes no
difference whether you currently use the theme or not. To
protect yourself, download all the available updates. To do
that, turn on the checkbox next to each update and then click
Update Themes.
Finally, if you install a theme, try it out, and decide you aren’t
ever likely to use it, it’s a good idea to delete it. Even if a theme
isn’t active, its template files are accessible on your site, allowing attackers to exploit any security flaws the templates
may have. This isn’t a common method of attack, but it has
happened to unsuspecting site owners before.

Tweaking Your Theme
The first step in getting the look you want is choosing the right theme, but your
site-styling doesn’t end there.
Every theme lets you customize it. In fact, you need to customize your theme to
make sure it meshes perfectly with your site. Your page’s header image is a perfect



example—if your theme includes one, you’ll almost certainly want to replace the stock
image with a picture that better represents your site. Other basic theme-preparation
tasks include shuffling around your widgets and setting up your menus. You handle
all these tasks in the pages of the Appearance menu.


Customizing the Header
When a visitor arrives at your site, the first thing she sees is the eye-catching header
at the top of your home page. Right now, that’s a problem, because the standard
header screams “Generic WordPress Site!” It’s for amateurs only.
Different themes may have slightly different header settings, but here are the details
you can usually change:
• The header text
• The color of the header text
• The header image
The header text includes the title and tagline you specified when you created your
site. WordPress stores this information as part of your site settings, and you can
modify it using the Site Title and Tagline boxes at Settings→General.
Most themes also let you pick the color of your header text. Usually, it starts out
black. (Twenty Fourteen is a notable exception, because it uses white text on a
black background.) To pick a different color, go to the Custom Header page at
Appearance→Header and look for the Text Color setting. Click the Select Color button next to it to open a miniature color picker and choose the exact shade you want.

At this point, it may occur to you that there are many other ways you might want to adjust your site’s
header. For example, you might want to change the size of the text or pick a fancier font. But making these types
of changes is an advanced operation. If you have a self-hosted site, you need to modify the CSS style rules that
control your theme. You’ll learn how to do that in Chapter 13. And if you have a WordPress.com site, you need
to buy the Custom Design upgrade (for $30 per year) to even be allowed to make this sort of formatting change
(see page 457).

Many themes let you use a picture in your header. Depending on the theme, the
header text may be displayed above the image, beneath the image, or on top of it
(or you may choose to hide the header text altogether). Deciding whether you want
to use an image is the most important decision you’ll make while customizing your
header. Figure 5-10 shows how the Twenty Twelve theme deals with header images.

Chapter 5: Choosing and Polishing Your Theme




Top: The Magic Tea House is a bit
plain with a text-only header.
Middle: Every theme makes its
own decision about where to
place the header image. If you
add an image to the Twenty
Twelve theme, it turns up
underneath the menu.
Bottom: Hiding the header text
results in a much cleaner look.




Here’s how to upload a new header picture for the standard WordPress theme:
1. Choose AppearanceÆHeader.
The Custom Header page opens.
2. Prepare your picture.
Before you upload a new picture, look carefully at the information on the Custom Header page (Figure 5-11). It usually tells you how big your picture should
be. Because the theme’s layout dictates the size of the header, each theme has
different size specifications. For example, Twenty Twelve needs a header 960
pixels wide and 250 pixels high, while Twenty Fourteen expects a wider and
shorter image (1260 × 240 pixels).


The Custom Header page
gives you options that
let you add a picture and
hide your header text.

Chapter 5: Choosing and Polishing Your Theme



If possible, you should resize or crop your picture to those specs, using an imageediting program before you upload it. That way, you’ll get exactly the image
you want. If your image doesn’t match the dimensions your theme expects,
WordPress may crop or resize it.
TIP Need a good picture but lack the photographic or illustrative skills to make one? Don’t do a Google
image search—you’re highly likely to end up stealing someone else’s copyrighted work. Instead, try a free stock
photography site like Stock.xchng (www.sxc.hu). It offers a vast collection of member-submitted pictures, most
of which are free for other people to use. (In fact, stock.xchng was the source of the sunny yellow teapot picture
that graces the Magic Tea House site in Figure 5-10.)

3. In the Select Image section, click the Browse or Choose File button (the
exact wording depends on the Internet browser you’re using).
In the window that opens, find the header picture on your computer, and then
select it.
4. Click Upload to upload the picture to your WordPress site.
If your picture doesn’t fit the required dimensions, WordPress may ask you
to crop it down (Figure 5-12). This works well if your picture is just a little too
tall or wide, but it can cause problems in other situations. For example, if your
picture isn’t wide enough, WordPress enlarges the whole thing to fit and then
asks you to crop off a significant portion of the top and bottom. You end up with
the worst of both worlds: an image of lower quality (because WordPress had
to scale it up) and one missing part of the picture (because you had to crop it).


To crop a picture, drag the
highlight rectangle until
you frame the image the
way you want it. Here,
the picture is a bit too
tall—by positioning the
highlight rectangle in
the middle, WordPress
will trim out part of the
top and bottom. When
you finish, click “Crop
and Publish.” Or, click
“Skip Cropping, Publish
Image as Is” if you want
to ignore your theme’s
recommendations and
use an oddly sized header
that may not fit nicely
into your layout.



5. Consider removing the header text by turning off the setting “Show header
text with your image.”


In some themes, the header text meshes neatly with the header image. For
example, Twenty Thirteen superimposes the header text on the header image.
In other themes (like Twenty Twelve), the text and picture are separate. For a
slicker look, you may choose to use a header image that includes stylized text,
and ditch the theme’s standard header text. The result is shown in Figure 5-10
Incidentally, if you decide to go the other way, you can remove the picture you
added by clicking the Remove Header button. And if you’re a truly odd duck,
you can remove both the header picture and the header text, but that will make
your site look just plain weird.
6. Click Save Changes.
If you add or remove a header image, you don’t need to click this easily overlooked button at the bottom of the Custom Header page, because WordPress
incorporates the change right away. But if you change one of the other header
settings, such as the “Show header text with your image” option, click Save
Changes to make it permanent.

Random Header Pictures
Some themes have the ability to perform a curious headerswitching trick. First, they let you upload multiple pictures.
Then they randomly choose a different picture for the header
on each page. All the standard year themes provide this feature, from Twenty Eleven on.
To try this out, start by uploading more than one picture on the
Custom Header page. (Just repeat the steps that start on page
147.) If your theme doesn’t display multiple header images, it
will simply toss out the old picture when you add a new one.
But if your theme does allow multiple images, it will keep track
of each picture you add, and you’ll see a thumbnail for each
in the Uploaded Images section of the Custom Header page.
You can choose to show a picture you uploaded by selecting
it in the Uploaded Images section. But if you’re after a more
exotic effect, choose the Random option. Now start browsing
the posts on your site. As you click from page to page, you see
the header change from one picture to another. Eventually,
WordPress will cycle through all your images.

The only catch is that once you upload a header image, you
can’t remove it from the Custom Header page. If you decide
that you don’t want WordPress to include one of your uploaded
pictures in its lineup of random headers, you need to delete
the image using the media library. First, click Media in the
dashboard menu. That brings you to the media library, where
you’ll see a list of all the images you uploaded to your site
(including any pictures you placed in your posts). You can recognize the header pictures that the current WordPress theme
uses, because they have the text “Header Image” after their
filenames. Point to the header you don’t want, and then click
Delete Permanently to banish it from your site. (Page 186 has
plenty more about the media library feature.)
Some folks love the changing-picture trick. For example, it’s a
great way to showcase a number of different and delectable
dishes on a food blog. However, most people prefer to pick a
single header and stick with it. That gives the site a clearer
identity and helps visitors remember your site.

Chapter 5: Choosing and Polishing Your Theme



Changing the Background
Many themes let you change the background of your pages. You can find these
options in the Custom Background page by choosing Appearance→Background.
Most themes give you two background-altering choices:
• Add a background image. Most themes tile the background image (that means
they repeat the image endlessly, from top to bottom and left to right, filling your
visitor’s browser window). For that reason, you need a picture that looks good
when it’s jammed edge-to-edge against another copy of itself. Small pictures
called textures work well for this task, and you can find them online, but the
effect is distinctly old-fashioned.
• Change the background color. This is the most commonly tweaked background
setting. You can use it to make the page background blend in more smoothly
with the background of your header image.
“Background color” doesn’t always mean what you expect. For example, in the
Twenty Twelve theme, the background color shows up only on the outer edges
of your page, not behind your posts. To change the color behind the text in your
posts, you need to tweak the theme styles, as explained in Chapter 13. Figure 5-13
shows the difference.


Ordinarily, the Twenty
Twelve theme centers
content horizontally in
the browser window
and pads the edges with
white space. But here the
background color is set
to match the yellow from
the header image. The
color behind the posts
remains white, ensuring
easy reading.



To change the background color the standard WordPress theme uses, you can type
in an HTML color code (like #e7df84, suitable for web nerds), or you can use the
groovy built-in color picker (Figure 5-14).



To pick a background
color for the Twenty
Eleven theme, click
Select Color to open
the color picker shown
here. Although it’s a bit
hard to see in black and
white, getting the exact
shade you want from the
color picker is a two-step
process. First, you select
a color by dragging the
ring on the left, and then
you set the shade of that
color using the slider on
the right.


If it’s hard to see the differences between the examples in the black-and-white pages of this book, check
out the Magic Tea House sample site at http://prosetech.com/wordpress.

Chapter 5: Choosing and Polishing Your Theme



Other Theme Options
Some themes include additional options, which you can find in the Appearance menu
in the dashboard. For example, if you install the Greyzed theme, you’ll get a new
page of options by choosing Appearance→Greyzed Options. If you use the aging
Twenty Eleven theme, you can view its settings by choosing Appearance→Theme
Options. But the later year themes, such as Twenty Twelve and Twenty Fourteen,
don’t include any extra options.
If a theme does include a page of additional settings, here’s what you’re likely to find:
• Options that change one of the design elements on the home page. For example,
if your theme includes a picture slider—a nifty feature that cycles through some
of your post’s pictures—you might be able to tweak how it chooses those pictures, how many pictures it shows, or how it transitions from one image to the
next. Page 192 has more about sliders.
• The ability to switch between two or three preset color schemes. For example,
Twenty Eleven has its usual light, airy color scheme as well as a white-on-black
variant for darker, moodier people.
• The ability to switch between different basic layouts. For example, Twenty
Eleven lets you put the sidebar to the left of your posts (instead of keeping it
in its usual spot on the right), or take it away altogether.

Themes are complex creations, and it takes a bit of fiddling before you have a good idea of which
theme suits your site best. You’ll see plenty of examples in the following chapters that show you how to capitalize
on the features found in different themes.


Themes with Missing Pictures
I picked a theme that has plenty of pictures on the home
page, but right now, all the picture boxes are empty. How
do I fill them?
Many of the most attractive themes use a visually rich style
that incorporates plenty of pictures. Some themes include a
slider that shows pictures from different posts. Others turn
the post list into a grid of post titles and picture thumbnails.
But before you can use this type of feature, you need to learn
more about how WordPress works with pictures.


Although WordPress has a variety of features that use pictures
(all of which are described in the next chapter), most graphically rich themes rely on featured images. A featured image is
a picture that represents a specific post, but doesn’t necessarily
appear in the post. Page 190 explains featured images, shows
you how to link them to posts, and explores several themes
that use them to create eye-catching home pages.


The Theme Customizer
If you’re tired of jumping from one page to the next using the Appearance menu,
you may be interested in the theme customizer, a dashboard tool that lets you
quickly configure a new theme. The theme customizer uses a multi-tabbed page that
combines many of the settings and options scattered throughout the Appearance
menu. To open the customizer, choose Appearance→Customize. Or, when viewing
the theme gallery (Appearance→Theme), point to the current theme and click the
Customize button. Either way, WordPress displays a live preview of your site with
a sidebar of theme-customization options. Figure 5-15 shows the Twenty Twelve
theme under the microscope in the theme customizer.



The theme customizer doesn’t always look as it does in Figure 5-15. Some themes offer fewer customizable sections, and WordPress.com sites put the sidebar on the right side of the page instead of the left. However,
the basic concept remains the same: You configure common theme settings while watching a constantly updated
preview of your work.


To modify your theme
using WordPress’s theme
customizer, click a section
on the left to open it and
adjust the settings (like
those for Colors, shown
here). Make your changes
and watch the preview
unfold on the right. If you
like the result, click Save
& Publish at the top of the
panel. If you don’t, pick
something else, or click
Cancel to back out of all
your changes.

Chapter 5: Choosing and Polishing Your Theme



There’s a lot packed into the customizer’s tabs. But, oddly enough, some important
details are inexplicably absent. It’s not that you can’t set them—you can, if you use
the different pages in the Appearance menu—but for some reason they escape the
customizer’s notice. For that reason, you might be decidedly cool on the theme
customizer. It’s a useful place to start customizing, but it’s not a reliable long-term
NOTE The theme customizer may also include two tabs that you won’t consider in this chapter. Those are
Navigation (where you pick a menu to display on your site) and Static Front Page (where you can choose a custom
home page for your site). To use either of these features, you first need to study the pages feature, which you’ll
master in Chapter 7.

Customizing Your Widgets
By the time you pick a theme, fix up your header, and adjust your theme settings,
your site is starting to look more respectable. But you’re not done tweaking yet.
Although your theme may look a whole lot nicer, there’s still one area that most
WordPress site creators will want to change: the sidebar.
The sidebar is a terrifically useful place to put links, like the ones that let your visitors
browse your archives. It’s filled with something WordPress calls widgets. A widget is
simply a block of useful content (like a list of links) that you can stuff into a sidebar
or put somewhere else in your site (Figure 5-16). Here’s the neat part: WordPress
widgets work with any theme.

Technically, the theme you choose provides one or more areas (like a sidebar and a footer) for widgets.
It’s up to you to choose what widgets go in those areas, and to configure the widgets you add.





Widgets are like building
blocks for your website. In
a freshly created site, you
start with the six widgets
shown here.

Chapter 5: Choosing and Polishing Your Theme



Positioning Your Widgets
To see all the widgets you can use, choose Appearance→Widgets to open the
densely packed Widgets page, which is a bit confusing because it shows you two
things at once:
• All the widgets WordPress has to offer. In the big box on the left, under Available Widgets, is a long list of all of WordPress’s widgets, including those you’re
using and those you aren’t, in alphabetical order.
• The widgets you’re currently using. On the right, below headings like Sidebar
and Footer Area, WordPress lists the widgets currently active on your site. It
arranges them in individual boxes (based on what part of the site they occupy)
and lists them in the order they actually appear.
Each theme dictates where you can place widgets. If you’re using the Twenty Twelve
theme on a newly created WordPress site, you start with a Widgets page that looks
like the one in Figure 5-17.


The Twenty Twelve theme
has just three locations
for widgets: a sidebar
and two front page areas.
You can use the latter
two areas only when you
create a new home page
using the Front Page
template (page 235).
Right now, the sidebar
is the only section that
actually has any widgets
in it. As you can see, the
six widget boxes shown
here correspond to the six
widgets shown in Figure




Different themes may position their widget sidebars in different places. For example, the Twenty
Twelve theme’s sidebar sits alongside the post listing on the home page and on the individual post pages. By
comparison, the Twenty Eleven theme’s sidebar appears on the main page but not on individual post pages.
You might see other variations, too—for example, you could have a sidebar that appears on every page, but a
widget-capable footer that appears on only the home page. It all depends on the theme you use.


The easiest thing you can do on the Widgets page is move a widget. That’s as simple
as dragging the widget to a new spot. Why not try relocating the search box to the
bottom of the sidebar? There’s no need to click any button to save your changes—as
soon as you drop the widget in its new position, WordPress makes the change and
you can view your site to check out the effect.
The next-easiest widget-customization task is deleting a widget. To do that, grab
hold of your widget and drag it over to the big Available Widgets box on the left.
When you drop the widget there, WordPress removes it from your site.

Congratulations, you’ve now graduated to the second level of WordPress mastery! It’s time to delete
the Meta widget from the main sidebar. Although its login and site administration links are convenient for you,
they look unprofessional to your readers. In the future, you’ll need to type in your dashboard’s address (just add
/wp-admin to the end of your website address) or bookmark the dashboard in your web browser.

Next, you can try adding a widget by dragging it from the Available Widgets box
and dropping it on one of the widget areas, like the sidebar. (You’ll learn what all
these widgets actually do starting on page 162.)
As you get a bit more ambitious, you may want to try moving widgets from one area
to another. For example, if you use the Twenty Twelve theme, you can drag a widget
from the Main Sidebar area to the First Front Page widget area. Unfortunately, you
won’t be able the see the change immediately, because the First Front Page widget
area doesn’t appear on your site unless you create a static front page (a technique
you’ll practice on page 231). But if you experiment with a different theme, you’ll often
find many more widget areas to play with. For example, the Twenty Thirteen theme
provides a Main widget area that appears in the footer of your site, and a Secondary
widget area that appears as a sidebar on the right (Figure 5-18).

Chapter 5: Choosing and Polishing Your Theme




The Twenty Thirteen
theme puts two distinct
widget areas to good use
on the same page. Each
area currently holds two
widgets. Some themes
use dramatically different
formatting in different
widget areas, as is the
case with Twenty Thirteen.

When you drag a widget over a new widget area, WordPress expands the area so
you can see any widgets currently there. Then, you simply drop the widget into the
appropriate place, as shown in Figure 5-19. To peek into a collapsed widget area without dragging a widget onto it, click the down-pointing arrow in its top-right corner.





Here, you’re moving the Recent
Posts widget from the Main widget
area (which creates the footer for
the Twenty Thirteen theme) to the
Secondary widget area (which creates the sidebar).


When Adding Widgets is a Drag
Tired of dragging all your widgets into place? WordPress offers
another way to add widgets:
1. First find the widget you want in the Available Widgets
box, and then click it once.
2. WordPress opens a list of widget areas below the widget
you picked. Choose the area you want (for example,
“Main Sidebar”).

3. Click Add Widget to place the widget.
This widget-adding technique requires several clicks, but you
might find it more convenient if you have piles of widgets
to sort through and lots of widget areas to put them in. To
make your life even easier, add the widgets in the order you
want them to appear, so you don’t need to rearrange them

Chapter 5: Choosing and Polishing Your Theme



Other themes may offer additional widget areas, like two sidebars, one on either side
of the main content area. Some themes offer multiple footer areas, which is perfect
for creating fat footers chock-full of links, ads, or pictures. The Twenty Eleven theme
has no fewer than three footer areas for widgets. Although this seems confusing, it
really isn’t—you simply use what you need. If you want a simple footer, use Footer
Area One and ignore the others. If you want a two-column footer, which splits the
footer area into columns, use Footer Area One and Footer Area Two. And if you want
a pumped-up three-column footer, you know what to do: Put widgets in Footer Area
One, Footer Area Two, and Footer Area Three.
Table 5-2 describes how the year themes stack up, widget-wise.
TABLE 5-2 Widget areas in the WordPress year themes



Twenty Eleven

Main Sidebar

Sidebar on the right

Showcase Sidebar

Sidebar on a page that uses the
Showcase template (page 236)

Footer Area One
Footer Area Two
Footer Area Three

First, second, and third columns
of the footer

Main Sidebar

Sidebar on the right

First Front Page
Second Front Page

Left and right column of a static
page that uses the Front Page
template (page 235)


The footer


Sidebar on the right

Primary Sidebar

Sidebar on the left, with a black

Content Sidebar

Sidebar on the right, with a white


The footer

Twenty Twelve

Twenty Thirteen

Twenty Fourteen

Changing Widget Settings
Widgets are surprisingly useful things. They let readers find recent posts, browse
through your archives, and keep track of recent comments. As you refine your site,
you won’t be happy just shuffling them around. You’ll also want to configure the
way they work.
Every widget provides a few settings you can adjust. To see them, expand the widget by clicking the down-pointing arrow in its right corner. Change the settings you
want, and then click the Save button to make the changes permanent. Figure 5-20
shows the settings for the Recent Posts and Categories widgets.





You can change the Recent Posts widget to show as many
posts as you want (not just the latest five). The Categories
box gives you three special options. “Display as dropdown”
compresses the category into a drop-down list box, which
saves space but forces people to click the box open. “Show
post counts” shows the number of posts in a category in
parentheses after the category name. And “Show hierarchy”
displays the category tree, which is especially handy if you
use subcategories, as described on page 110.

Even if a widget provides no other settings, it always includes a Title text box, which
you can use to replace the widget’s standard headline—for example “Hot News!”
instead of “Recent Posts” or “What People Are Saying” instead of “Recent Comments.” If you leave the Title box blank, the widget uses its default title.
When you add a new widget, it starts out with its standard settings. In some cases,
you might want to remove a widget from your site without throwing away its settings—for example you may be planning to add it back later on. WordPress has a
special Inactive Widgets box designed for exactly this situation. To remove a widget
but keep its settings, drag the widget into the Inactive Widgets box instead of the

Chapter 5: Choosing and Polishing Your Theme



Available Widgets box. (If you don’t see the Inactive Widgets box, scroll down—it’s
right underneath the Available Widgets box.)

The Basic Widgets
You are now the master of your widgets. Before you go any further, take a closer
look at exactly what WordPress’s widgets can do for you.
Table 5-3 describes the WordPress widgets you’ll see in a freshly installed, selfhosted WordPress site. In Chapter 9, you’ll learn how to expand your widget collection with plug-ins.
TABLE 5-3 WordPress widgets






Shows links that let readers
browse a month of posts at a
time. You can convert it to a
drop-down box and display
the number of posts in each



Shows a miniature calendar
that lets guests find posts on
specific dates.

See page 164.


Shows links that let readers
browse all the posts in a
category. You can convert
it to a drop-down box and
display the number of posts
in each category.

Categories are explained on
page 106.

Custom Menu

Shows a menu of pages or
other links that you create
using WordPress’s menu

Menus are explained in
Chapter 7.


Shows administrative links
(for example, a “Log in”
link that takes you to the
dashboard). Once you’re
ready to go live with your
site, you should delete the
Meta widget.

See page 87.


Shows links to the static
pages you pick. (Static
pages act like ordinary web
pages, not posts. You can
add them to your website to
provide extra information or

Static pages are explained in
Chapter 7.





Recent Comments

Shows the most recent
comments left on any of
your posts. You can choose
how many comments
WordPress displays (the
standard is five).

Comments are explained in
Chapter 8.

Recent Posts

Shows links that let readers
jump to one of your most
recent posts. You can choose
how many posts WordPress
displays (the standard is



Shows links extracted from
an RSS feed (for example,
the posts from another
person’s blog).

See page 433.


Shows a box that lets visitors
search your posts. You might
want to remove this from
the sidebar if your theme
includes it somewhere else
on the home page (as the
home page in Figure 5-1


Tag Cloud

Shows the tags your blogs
use most often, sized
according to their popularity.
Readers can click a tag to
see the posts that use it.

See page 165.


Shows a block of text or
HTML. You can put whatever
content you want here,
which makes it an allpurpose display tool for
small bits of information.

See page 166.


Shows the titles of posts that
use the Aside, Link, Status,
or Quote format. Unlike all
the other widgets, this is a
theme-specific widget that
only some themes include
(such as Twenty Fourteen
and Twenty Eleven).

See page 205.


You’re already well acquainted with the basic set of widgets that every blog begins
with: Search, Archives, Recent Posts, Categories, Recent Comments, and Meta. In

Chapter 5: Choosing and Polishing Your Theme



the following sections, you’ll tour a few more widgets you might consider adding
to your site.
TIP You can add the same widget more than once. For example, you can add two Custom Menu widgets to
your page, give each one a different title, and use each one to show a separate set of links.


I Have Even More Widgets!
The list of widgets in Table 5-3 includes all those that a
self-hosted WordPress site starts with. But if your site is on
WordPress.com, you’ll find the Widgets page stocked with a
number of preinstalled extras, including widgets that let you
share posts with nifty web services like Facebook, Twitter,
Flickr, Goodreads, and Delicious. So what’s up?
The discrepancy reflects the way WordPress handles plug-ins.
If your site is on WordPress.com, you can’t install plug-ins, so
you’re limited to whatever Automattic offers in the Widgets
window. For that reason, the company tries extra hard to
include a broad set of useful widgets for everyone.

Self-hosted WordPress sites start out with fewer widgets, but
you can add more—in fact, as many as you want—through
plug-ins. You can start by adding all the WordPress.com
widgets to your site with the Jetpack plug-in (page 297). You’ll
learn to use these more exotic widgets throughout this book.
Finally, it’s worth noting that some themes come with their
own specialized widgets. Usually, you can recognize them by
the fact that the widget name starts with the theme name,
like Twenty Fourteen Ephemera (which is included with the
Twenty Fourteen theme).

The Calendar Widget
The Calendar widget gives readers a different way to browse your site—by finding
posts published on a specific day (Figure 5-21). It’s most commonly used in blogs.


In the month of March, four days have at least one post—the 3rd, 4th,
6th, and 25th. Click the date to see the corresponding posts.



The Calendar widget used to be a staple of every blog. These days, it’s far less
popular. The problem is that unless you blog several times a week, the calendar
looks sparse and makes your blog feel half-empty. Also, it emphasizes the current
month of posts while neglecting other months. Most readers won’t bother clicking
their way through month after month to hunt for posts.


You probably won’t use the Calendar unless your posts are particularly time-sensitive and you want to emphasize their dates. (For example, the Calendar widget
might make sense if you’re chronicling a 30-day weight-loss marathon.) If you use
the Calendar widget, you probably won’t use the similarly date-focused Archives
widget, or you’ll at least place it far away, at the other end of your sidebar or in
another widget area.

The Tag Cloud Widget
You’ve already seen how the Categories widget lets visitors browse through the
posts in any category. The Tag Cloud widget is similar in that it lets readers see
posts that use a specific tag.
There’s a difference, however. While categories are well-defined and neatly organized, the typical WordPress site uses a jumble of overlapping keywords. Also, the
total number of categories you use will probably be small, while the number of tags
could be quite large. For these reasons, it makes sense to display tags differently
from categories. Categories make sense in a list or tree. Tags work better in a cloud,
which shows the most popular tags sorted alphabetically and sized proportionately.
That means that tags attached to a lot of posts show up in bigger text, while lessfrequently used tags are smaller (Figure 5-22).


This tag cloud shows that “health” is the most frequently used tag,
with “store” close behind. As with categories, clicking a tag shows all
the posts that use it.

There’s no secret to using the Tag Cloud widget. Just drag it into an area of your
theme, and see what tags it highlights. The tag cloud might also tell you something
about your site—for example, what topics keep coming up across all your posts.

Chapter 5: Choosing and Polishing Your Theme




If clouds work so well for tags, it might occur to you that they could also suit categories, especially
in sites that have a large number of categories, loosely arranged, and with no subcategories. Happily, a category
cloud is easy to create. If you use WordPress.com, the handy Category Cloud widget does the job. If you self-host,
you’ll notice an extra setting in the Tag Cloud widget: a list called Taxonomy. To create your category cloud, change
the Taxonomy setting from Tags to Categories.


Taming the Tag Cloud
What do I do if my tag cloud shows too many tags? Or not
enough? Or makes the text too big?
The Tag Cloud widget is surprisingly uncustomizable. If you use
fewer than 45 tags, it shows every one of them (although it
ignores any tags you added to the Posts→Tags list but haven’t
yet used in a post.) If you use more than 45 tags, the Tag Cloud
widget shows the 45 most popular.
Occasionally, people want a tag cloud with more tags. But
usually they have the opposite concern and want a smaller
tag cloud that’s slim enough to fit into a sidebar without
crowding out other widgets. If you want to tweak a tag cloud
on a WordPress.com site, you’re out of luck. But if you run a

self-hosted site, there are options. One solution is to crack open
your template files. That’s because the behind-the-scenes code
(the PHP function that creates the cloud) is actually very flexible. It lets you set upper and lower tag limits, and set upper
and lower boundaries for the text size. You can get the full
details from WordPress’s function reference at http://tinyurl.
com/wptagcloud. (However, this information won’t be much
help until you learn how to dig into your WordPress theme files
to change your code, a topic explored in Chapter 13.) Another
solution is to search for a plug-in that lets you pick the tag
options and then generates a customized tag cloud. You’ll learn
how to find and install plug-ins in Chapter 9.

The Text Widget
The Text widget is simple but surprisingly flexible. You can use it anywhere you want
to wedge in a bit of fixed content. For example, you can use it in a sidebar, to add
a paragraph about yourself or your site. Or you can put it in your footer with some
copyright information or a legal disclaimer.
However, the Text widget becomes much more interesting if you stick some markup
in it. Since it recognizes HTML markup, you can stuff in lists, links, pictures, and more.
(In fact, WordPress self-hosters often use the Text widget to stuff in a video or an
image, as explained on page 188.) Figure 5-23 shows two uses of the Text widget.
Using the Text widget is easy. First, drag it onto your page (as with any other widget). When you expand it, you get a nice big, multiple-line text box. If all you want
is ordinary text, just fill in a title and type in your text underneath. Make sure you
also turn on the “Automatically add paragraphs” checkbox. That way, wherever you
separate the text (by pressing the Enter key), WordPress inserts an HTML line break
element (that’s 
) that, in turn, inserts the space you want. 166 WORDPRESS: THE MISSING MANUAL CUSTOMIZING YOUR WIDGETS FIGURE 5-23 Left: At its simplest, the Text widget displays a title (formatted according to the theme you’re using) with one or more paragraphs of text underneath. Right: Add some HTML, and the Text widget looks a whole lot fancier. It’s almost as easy to put HTML in the Text widget. First, turn off the “Automatically add paragraphs” settings. Then, type in your content, with the exact HTML tags you want. Here’s an example that puts a word in bold type: The following word will be bold on the page. And here’s the HTML-formatted text from Figure 5-23 (right): The Magic Tea House is a quirky mash-up: it's a fine tea importer with the rarest gourmet teas, and a music venue for small-venue jazz, chamber, and coffeehouse bands like:
  • The Black Teas
  • Cosmic Harmony
  • U.V.Q.
  • Samantha Told Me So
See our location. If your HTML skills are a bit sketchy, you can copy markup from an HTML editor into the Text widget. Before you do, make sure you look over the markup and strip out any unnecessary details, like inline styles. That gives it a better chance of blending into your site without disrupting the rest of your WordPress page. Chapter 5: Choosing and Polishing Your Theme 167 MOBILE THEMES Mobile Themes If you build a website today, it’s a safe bet that some of your visitors will browse your pages using smartphones, tablets, and other mobile devices. Unfortunately, pages that look good in a desktop or laptop browser aren’t so swell on smaller screens. The problem is space—namely, how to adapt your pages when there’s not nearly as much room to work with. If you’re using an intelligent, mobile-aware theme, it can adapt itself to work in cramped spaces. It can rearrange your content, simplify your site’s layout, and increase the size of your text (Figure 5-24). This design philosophy is sometimes called responsive design because it responds to the needs of the viewer. FIGURE 5-24 Left: The Twenty Twelve theme recasts itself for people with mobile devices. It shows your blog postings on a large, readable page, using a single column. To save space, it squashes the menu down to a single button (click it, and the full menu drops into view). Right: The Twenty Twelve theme still displays your widgets, like Recent Posts and Recent Comments, but it bumps them to the bottom of the page, below the list of posts. Themes that aren’t mobile aware (meaning they don’t distinguish between desktop computers and web-enabled devices), don’t make any effort to tailor your pages for tiny screens. The result is a postage-stamp-sized page that’s difficult to navigate and read (Figure 5-25). 168 WORDPRESS: THE MISSING MANUAL MOBILE THEMES FIGURE 5-25 The aging Twenty Ten theme doesn’t attempt to accommodate smartphones. Browse a site that uses the theme, and you get the familiar bird’s–eye view of the page. Navigating this site requires plenty of zooming in and out. The easiest way to make your site look good on mobile displays is to pick a theme that reconfigures your content for mobile devices. All the year themes from Twenty Eleven on do. When WordPress detects a visitor using a mobile device, the theme automatically substitutes a different layout—one that’s both simpler and carefully rearranged. TIP You can search for themes that have built-in mobile support using the Feature Filter. Just find the Layout section and turn on the Responsive Layout checkbox before you search. If your theme doesn’t recognize mobile devices, all is not lost. If you have a selfhosted WordPress site, you can use a mobile-aware plug-in. One is WPtouch (http:// tinyurl.com/wptouch), which identifies smartphones and other mobile devices, and makes sure they get a simplified theme that better suits their capabilities (and looks pretty slick, too). You haven’t yet learned how to use plug-ins, but you’ll consider WPtouch when you do, on page 307. Chapter 5: Choosing and Polishing Your Theme 169 MOBILE THEMES NOTE Even if your theme does recognize mobile devices, you may still opt for the expanded features of a mobile plug-in. In the WordPress year themes, the mobile version looks nice but still makes some questionable design decisions. For example, they retain your sidebar widgets in an unwieldy list after your post. Similarly, the home page still includes the full content of each post, which creates a seemingly endless page. (Surely shortened excerpts are more convenient, and easier on the ever-scrolling index finger.) If you want to customize the mobile appearance of your self-hosted WordPress site, a plug-in like WPtouch is the perfect tool (page 307). If your site is on WordPress.com, you can’t use a mobile plug-in. However, WordPress. com provides a similar but simpler set of built-in features. If your theme doesn’t have mobile smarts, you can ask WordPress to swap in its own basic mobile theme. Choose Appearance→Mobile, and next to “Enable mobile theme,” click Yes. On the same page, you’ll find a few more options to configure your site for mobile devices. Most usefully, you can use the “Show excerpts on front page” setting to use a post’s excerpt (page 198) instead of its full text in the post list on the home page. Although WordPress.com doesn’t give you nearly as much control as a mobile plug-in like WPtouch, it’s enough to let you keep your favorite theme, even if it isn’t mobile-aware. 170 WORDPRESS: THE MISSING MANUAL CHAPTER Jazzing Up Your Posts 6 Y ou know what an ordinary WordPress post looks like—it starts with a title, followed by one or more paragraphs of text. And there’s nothing wrong with that. Providing that you pick the right theme, your WordPress site can look surprisingly hip, even if it holds nothing more than plain text. However, there are plenty of types of sites that need more from a post. For example, if you’re posting news articles, you certainly want to add pictures. And if you’re writing long posts (on anything from business analytics to relationship advice), you’ll improve your audience’s reading experience if you use subheadings to structure your thoughts. To add details like these, along with lists, links, and the other accouterments of a web page, you need to take charge of WordPress’s post editor, which you’ll do in this chapter. Fancy posts aren’t just about formatting—they’re also about features. For example, you can use specialized tags to show just a portion of a post on your home page (rather than the whole thing), giving you a ridiculously useful way to promote many posts in a small space. Or you can use images from your posts to create a slideshow that, say, promotes your top posts on the home page. In this chapter, you’ll use all these techniques to improve the aesthetics and showcase the richness of your site. Making Fancier Posts You’ve seen plenty of WordPress posts so far, but none are likely to impress your web designer friends. Fortunately, you don’t need to stick with the plain and ordinary. WordPress is packed with tools that can help you create epically formatted posts. 171 MAKING FANCIER POSTS The easiest way to start styling your posts is to start with a new one (to do that, choose Posts→Add New, as usual). Then look at the toolbar that sits at the top of the editing box—it’s stocked with useful formatting commands (Figure 6-1). FIGURE 6-1 If your toolbar has just a single line, start by finding the Toolbar Toggle button (top row, far right) and click it. That expands the toolbar to its full two lines of commands, shown here. Even though WordPress creates your posts using web-friendly HTML markup, the toolbar buttons work in almost the same way they do in a word processor, complete with a basic Undo feature. It’s like having a miniature Microsoft Word in your browser. You can format your posts two ways. One is to select the bit of text that needs formatting and then click the corresponding toolbar button. You might, for example, select a single word and add bold formatting by clicking the B button. Another approach is to use the toolbar buttons to turn a feature on or off (which computer 172 WORDPRESS: THE MISSING MANUAL nerds call toggling) as you write. For example, you could click the I button to turn on italic formatting, type something, and then click the I button again to turn off italics. MAKING FANCIER POSTS TIP If you want to start a new line of text without starting a whole new paragraph, press Shift+Enter at the end of the preceding line (instead of hitting just the Enter key). Why? If you click just Enter, WordPress thinks you want to start a new paragraph and adds extra space just before the beginning of that paragraph. When you use Shift+Enter, WordPress doesn’t add the extra space. The following sections explain a few of the finer points of post formatting. You’ll see the proper way to work with headings, add links and special characters, and unlock even more capabilities by editing your post’s HTML. GEM IN THE ROUGH Get More Space to Work Need more space to write and review your content? You can make the post box a bit bigger by tweaking WordPress’s settings. Choose Settings→Writing, look for the “Size of the post box” setting, and increase the number of lines (the standard is 20). Or you can expand the content box by clicking the bottomright corner and dragging it down, as shown on page 126. If you’re craving even more screen real estate, check out the toolbar’s full-screen mode button (Figure 6-1). WordPress calls this mode (and labels the button that triggers it) Distraction Free Writing. Click it, and WordPress resizes the post title and post content boxes to fill a larger portion of the page, temporarily hiding the other parts of the Add New Post page, including the toolbar and the dashboard menu. If you need a toolbar button, move your mouse (without clicking) near the top of the page to make the toolbar reappear. When you finish writing, you can get back to the normal Add New Post page by pointing to the top of the page to show the toolbar, and then clicking “Exit fullscreen.” Technically, WordPress’s full-screen view doesn’t occupy the full screen—it’s more like full browser view. But you can go beyond that limit by switching your browser to its full-screen view. On most browsers, you do that by pressing F11 (press it again to return the browser window to its normal state). With your browser in full-screen mode, its window fills the entire screen (sans toolbars), and WordPress can claim virtually all of it to display your post. There’s one quirk, however: No matter how big you make your browser window, WordPress limits the width of the editing box, for two reasons. First, it’s awkward to read and edit long lines of text. Second, most WordPress templates limit the width of posts to ensure readability. As a result, an unnaturally wide editing window would give you a false sense of the post’s layout. Using Subheadings Every blog post starts with a heading—the title of your post, which sits above the post content. But if you’re writing a long post, it’s a good idea to subdivide your writing into smaller units using subheadings. To create a subheading, use the drop-down Format menu on the far left of the second row of the toolbar (Figure 6-2). Usually, the menu displays the word “Paragraph,” which tells you that WordPress is styling the current text as an ordinary paragraph. But you can choose three sizes of heading from the menu, too. Chapter 6: Jazzing Up Your Posts 173 MAKING FANCIER POSTS FIGURE 6-2 The Format drop-down list offers six levels of heading. Choose one, and you’ll be rewarded with bigger, bolder text. If you know even a little about HTML, you won’t be surprised to learn that a level-1 heading uses the

element, a level-2 heading uses

, and so on. The heading level you use depends, at least in part, on your theme. Here are some guidelines: • Don’t use level-1 headings inside your posts, because they’ll clash with the main post title or the website title, confusing search engines and assistive devices like screen readers. • If you use a modern theme, use level-2 headings to subdivide a post. This is the right approach for the standard year themes, from Twenty Eleven on. • If you use an older theme, you may need to use level-2 or level-3 headings when subdividing a post. First, try level-2 headings. If they appear in the published page with the same type size as the post title, use level-3 headings instead. NOTE The size, typeface, and exact appearance of a heading depend on your theme. You won’t see exactly what your heading looks like until you preview or publish your page. Showing a Code Listing You may notice that the Format list has more than just headings in it. It also includes the Paragraph, Address, and Preformatted formats, which map to the HTML elements


, and
, respectively.



WordPress uses the 

element to style ordinary paragraphs, and you’ve already seen plenty of those. The

element is meant for contact information about who wrote the page, but it’s rarely used. But the
 element is more useful—it
displays text in a fixed-width font, which is ideal for listing programming code or
simulating computer output (Figure 6-3).



In some themes, WordPress formats the
text of a 
 element using a gray
background or gray outline (the latter
shown here for the “alert” line in the
Twenty Twelve theme). That visually
separates the 
-formatted text
from the rest of the content on the
page. (Remember to use Shift+Enter
to add line breaks between each line
of code, rather than just Enter, which
would add extra spacing and start a
new paragraph.)

Adding Links
The Web wouldn’t amount to much without links, those blue underlined bits of text
that let you jump from one web page to another. You can easily add links to a post.
For example, imagine you have this sentence:
This story was reported in The New York Times.

To turn “The New York Times” into a link, select the text, and then click the Insert
Link button in the toolbar. A window appears where you can either supply a full
website address or link to one of your own posts (Figure 6-4).

If you want to link to a file—for example, a document that your guest can download or a picture she
can view—you need to store that file in WordPress’s media library. You’ll get the full details on page 186.

To remove a link, click anywhere inside the link text and then click the Remove Link
button (which is right next to the Insert Link button in the toolbar).

Chapter 6: Jazzing Up Your Posts




To add a link to a post, you need to supply
the URL (the website address) and a Title
(the text that appears in a tooltip when
a visitor points to the link). Alternatively,
you can search for a post on your own site
and insert a link to it. Either way, clicking
Add Link seals the deal.

Inserting Special Characters
Special characters are usually defined as characters you don’t see on your everyday
keyboard. For example, if you use a standard U.S. keyboard, special characters
include things like accented letters and typographic symbols.
WordPress lets you drop in one of a small set of special characters using the Insert
Custom Character command. Click it, and a window appears with a grid of unusual
characters. Point to one to get a close-up look at it, and then click it to close the
window and insert the character into your post (see Figure 6-5).
You may not need all the special characters you think you do. WordPress automatically substitutes special characters for some character combinations. For example, if
you type two dashes (--) between words, WordPress turns them into a seamless en
dash (–) when you publish the post. Three dashes in a row creates a slightly longer
em dash (—). Similarly, WordPress turns ordinary straight quotes ("") into typographically correct quotation marks (“”). It works the same magic with apostrophes.





Here, you’re about to insert the
copyright symbol into a post.


The oddest special characters you can use with WordPress are smilies, character combinations like :)
that turn into emoticons like . WordPress performs this substitution automatically, and you can find out what
smilies you can use (and the characters you need to type to trigger them) at http://tinyurl.com/using-smilies.
On the other hand, if the smilies feature is running amok and changing character sequences you don’t want it to,
choose Settings→Writing and turn off the checkbox next to “Convert emoticons like :-) and :-P to graphics on


Formatting Your Text
How can I adjust typefaces and font sizes?
WordPress’s post editor lets you structure your content (for
example, put it into lists and headings), add more content (like
pictures), and apply certain types of formatting (like boldface
and italics). However, there are plenty of formatting details
that aren’t under your control. The size and typeface of your
fonts is one of them.
This might seem like an awkward limitation, but it’s actually
a wise design decision on the part of the people who created
WordPress. If WordPress gave you free rein to change fonts, you
could easily end up with messy markup and posts that didn’t
match each other. Even worse, if you switch to a new theme,
you’re stuck with your old fonts, even though they might no
longer suit your new look.

Fortunately, there’s a more structured way to change the appearance of your text. Once you’re certain you have the right
theme for your website, you can modify its styles. For example,
by changing the style rules, you can change the font, color,
and size of your text, and you can either make these changes
to all your content, or to just specific elements (like all level-3
headings inside a post).
Modifying styles is a great way to personalize a theme, and
you’ll learn how to do that in Chapter 13. However, there’s one
caveat—if you use WordPress.com to host your site, you need
to buy the Custom Design upgrade to edit your styles (page
457). Self-hosted WordPress sites don’t have this restriction.

Chapter 6: Jazzing Up Your Posts



Using the HTML View
All the toolbar buttons you studied so far work by inserting the right HTML into your
posts, behind the scenes. But if you’ve got a bit of web design experience, you don’t
need to rely on the buttons. Using WordPress’s HTML view, you can directly edit your
post’s HTML markup. You won’t be limited by the buttons in the toolbar—instead,
you can enter any HTML element you want.
To switch to HTML view, click the Text tab that sits just above the post content box,
on the right (Figure 6-6). To go back to the visual editor, click the Visual tab. In fact,
there’s no reason you can’t spend time in both places. For example, you might write
your post in the visual editor and then switch to HTML view to inspect the markup.
HTML view gives you a slightly different toolbar. It still has the useful “full screen”
button, but most of the other shortcuts, which insert various HTML tags, aren’t much
help—if you’re savvy enough to prefer the HTML view, then you probably want to
type in your markup by hand.


Here’s the same document—with a heading
and a list—shown in both
the visual editor (left)
and the HTML editor

If you’re a seasoned web designer, you might feel that WordPress’s HTML editor isn’t
up to snuff. Full HTML editing programs like Adobe Dreamweaver are packed with
little frills that can make editing easier—for example, they automatically add closing
tags to HTML elements and suggest possible tag names as you type. (HTML editors
also have more powerful layout and styling features, but those features make more
sense when you’re designing the look and layout of an entire site, not just adding
a bit of content to a post.)
Most WordPress developers don’t need the full features of a program like Dreamweaver. But there are exceptions. If you write long, complex posts—for example, the
articles you saw in the Internet Encyclopedia of Philosophy (page 12)—you probably
don’t want to do all your editing in a web page window. Hardcore HTML lovers who
find themselves in this situation can write posts in an HTML editor like Dreamweaver,
copy the markup, and then paste it into WordPress’s Text content box. But don’t
try this unless you really understand your markup. You don’t want to transfer a


whack of formatting details to your WordPress post, like a  element that has
hardcoded font settings. If you do, you’ll introduce some serious issues, including
inconsistencies between posts and problems changing themes.


Getting a Better Post Editor
Most WordPress fans do their work directly in their web browsers, using the WordPress editor. But if you’re working with long documents and you’re missing your
favorite conveniences, you have other options.
One is to upgrade your WordPress editor. This approach makes sense if you’re happy
creating your posts in the familiar Add New Post web page but don’t feel like you’re
getting enough help from WordPress. Using a plug-in, you can swap in an editor
that has a bit more muscle. (Of course, you’ll need a self-hosted WordPress site to
change your editor, because WordPress.com doesn’t let you add plug-ins.)
You can search for a pumped-up post editor on the WordPress plug-in page (http://
wordpress.org/plugins), as explained in Chapter 9. Plenty of them offer advanced
features like search-and-replace, style-based editing, and support for creating tables.
One of the most popular is TinyMCE. Check it out at http://tinyurl.com/tinyeditor
and learn about installing plug-ins on page 287.
Another solution is to do your post-writing work in another program. You’ve already
learned that you can paste in pure HTML using the WordPress editor’s HTML view
(page 178), but this technique is a bit touchy—paste in the wrong markup and you
can scramble your site. A better approach is to use a program that lets you compose
rich content, and then posts that content to your site safely and cleanly, without an
awkward cut-and-paste step.
On a Windows computer, you can use Microsoft’s free Windows Live Writer to
compose properly formatted posts on your desktop, even if you don’t have an
Internet connection. When you’re ready, a single click publishes the posts on your
blog. Windows Live Writer is available free at http://tinyurl.com/win-essentials. Mac
fiends can find similar blog-writing tools, including the popular—but, sadly, not free
(it’s $40)—MarsEdit (www.red-sweater.com/marsedit).

WordPress has a list of even more desktop post editors for Windows, Mac OS, and Linux at http://
tinyurl.com/blog-client. Most offer handy formatting features, and all of them let you compose your work offline.

Finally, Microsoft Word lovers can use their favorite word processor to write WordPress posts using the little-known “Blog post” template. Word asks for your site’s
URL, user name, and password, after which it lets you create new posts and edit
old ones, all from the comfort of the Word window.
TIP Although it’s tempting to do your WordPress work in Word, with its silky smooth formatting features and
AutoCorrect, the free Windows Live Writer program is still a better choice. That’s because Windows Live Writer
offers a few key features that Word omits, like the ability to schedule a post for future publication (page 100),
add tags, and edit your post’s slug (page 120).

Chapter 6: Jazzing Up Your Posts



Adding Pictures
You’ve now toured many of the post-enhancing features the Add New Post page
offers. But there are several frills you haven’t yet touched. The most obvious is
adding graphics.
Virtually every good WordPress site can be made better with pictures. WordPress
gives you several ways to do that, from the obvious (plopping them into your posts,
alongside your text) to the more interesting (using them to build photoblogs, create
slideshows, and advertise new posts on your home page). In the following sections,
you’ll learn how to take advantage of these slick picture tricks.

Putting Pictures in a Post
The most obvious place for a picture is in a post, right along with your content.
WordPress makes it easy to insert pictures as you create a post (on the Add New
Post page) or edit one (on the Edit Post page). In fact, you can put as many images
as you want into any post.
1. In a post’s edit box, click the spot where you want to add a picture.
It doesn’t matter whether you use the visual editor (the Visual tab) or the HTML
editor (the Text tab). If you use the visual editor, you’ll see every picture you
insert right next to your post text. If you use the HTML editor, you’ll see the
raw HTML markup for each picture. This markup includes an  element
for the picture, wrapped in an  anchor element that turns the picture into a
link so readers can click it to see the full-size image, and possibly some other
elements, like a title or a caption.
2. Just above the box where you type in your content, click the Add Media
The Insert Media window appears (Figure 6-7). It gives you three ways to find
a picture: You can upload a file from your computer (using the Upload Files
tab), use a file you already uploaded to WordPress’s media library (using the
Media Library tab), or grab a file that’s stored on another website (by clicking
the “Insert from URL” link on the left).
In this example, you want to stick to the Upload Files tab. Grabbing pictures
from other websites (using “Insert from URL”) might be worthwhile if you
store graphics on another part of your site. But if it’s someone else’s site, don’t
chance it—the risk that the picture is copyrighted, or that the webmaster could
change or move it to a new address, is too great. The Media Library tab is also
useful, but only after you build up a collection of pictures. You’ll take a look at
it on page 186.

The Insert Media window also has links for creating a picture gallery (page 330) and setting your
post’s featured image (page 190). WordPress.com users will see even more links, for adding tweets and YouTube
videos. Ignore all these details for now—you’ll revisit them soon enough.





Using the Upload Files
tab, you can insert one or
more pictures from your
computer into a post.
First, drag a picture into
the Insert Media box.
Once you release the
image, WordPress begins
uploading it.

3. Pick the files you want to upload.
WordPress gives you two options. The quickest approach is to drag files from
an open file browser window (like Windows Explorer or the Mac’s Finder) and
drop them in the Insert Media window box. You can drag as many files as you
want, either all at once or one at a time, and you can keep dropping in new files
before WordPress finishes uploading the old ones.
Your other option is to pick your files from a standard dialog box. To do that,
click the Select Files button, browse to the right folder, and then pick what
you want. Ctrl-click (Command-click on a Mac) to select multiple files at once.
TIP If your files are really big, uploading just isn’t practical (and it might fail halfway through). For example,
it’s probably a bad idea to upload files straight from your 22-megapixel digital camera. To save time, scale it
down in an image-editing program first.

Once you upload your files, WordPress switches to the Media Library tab, which
lists all the images you ever added to your site. It puts new pictures at the top
of the list.
If your files are particularly large (or your web connection is particularly slow),
you’ll see a progress bar ticking along, tracking the upload progress of each
file. When WordPress finishes an upload, it replaces the progress bar with a
thumbnail of your image. On the right, a pile of text boxes asks you for all kinds
of information about your picture (see Figure 6-8).
Chapter 6: Jazzing Up Your Posts




Here, WordPress has just
finished uploading the
file dead_elvis_tattoo.
jpg. Currently, it’s the
only file in this site’s
Media Library. Before you
insert it into your post,
you need to enter a bit of


If you plan to upload your picture using the drag-and-drop approach, here’s a valuable shortcut. Instead
of clicking the Add Media button to get started, just drag the picture right onto the post editor in the Add New
Post page. WordPress will open the Insert Media window, take you to the Media Library tab, and start uploading
your picture. You can then carry on with step 4.

4. Scroll down and fill in the information for your picture. WordPress asks for
the following:
• Title is the text that appears in a tooltip when someone points to a picture.
• Caption adds an optional caption that appears on the page near your picture. Different themes handle captions differently, but they usually place
them under your picture, as in Figure 6-9. Captions can include HTML tags
(for example,  for bold formatting), but you need to add them yourself.
• Alt Text is the alternate text sent to assistive devices (like screen readers)
to help people with disabilities interpret pictures they can’t see.



• Description is a longer, more detailed explanation of the picture. You can
use it for your records, or you might decide to display it on your page—but
you need to find a theme that shows image descriptions (most don’t) or edit
your theme by hand (Chapter 13). If you don’t plan to use the description,
you can leave this box empty.


• Alignment determines where a picture appears relative to its text. If you
choose None, the picture stands on its own, wherever you inserted it.
Paragraphs may appear before it or after it, but the post content won’t
flow on either side of the picture. If you choose Left or Right, WordPress
puts the picture on one side of the page and lets text flow around the other
side (see Figure 6-9).

If your text narrates your pictures, you probably want to choose None for the alignment so you can position the pictures exactly where you want them. Examples include food blogs with pictures of meals, travelogues
with pictures of tourist sites, and home renovation stories with a photo journal of the step-by-step process. On
the other hand, if you have a rich layout that’s more like a glossy magazine, you might decide to use Left or Right
for your picture alignment.

• Link To is the web address where WordPress sends visitors if they click
your pic. Usually, this setting is set to Media File and if someone clicks your
picture, the browser displays the full-size picture file without any headers,
sidebars, captions, or extra content. Alternatively, you can choose Attachment Page, which tells WordPress to take readers to something called,
sensibly enough, an attachment page, which features the full-sized version
of your picture and a section for reader comments. Or you can send readers to a web address—select Custom URL from the Link To menu and then
type in the address you want. Finally, you can tell WordPress to not make
the picture clickable at all (select None).
• Size tells WordPress how big the picture should be in your post. You can
choose Full Size to use the original dimensions of the uploaded file, or you
can use one of the scaled-down versions of your picture, which WordPress
creates automatically when you upload a file. You’ll notice that WordPress
maintains the relative proportions of your picture—it never squashes a
picture more width-wise than it does height-wise. (Remember that readers
can click a scaled-down picture to see the full-size image, unless you set
the Link To setting to Custom URL or None.)
NOTE In addition to storing the original file you upload, WordPress creates three extra versions of every
picture: a 150 × 150 pixel thumbnail, a 300 × 300 medium-size image, and a 1024 × 1024 large-size pic. You
can change these defaults in the Settings→Media section of the dashboard, under the “Image sizes” heading.
However, the changes affect only new pictures, not the ones you’ve already uploaded.

Chapter 6: Jazzing Up Your Posts




This theme aligns images on the
left, which means the text in the
post flows down the right side of
the image.

5. Optionally, you can edit your picture by clicking the Edit Image link, which
appears just above all the text boxes. Click Save when you finish.
When you edit a picture, WordPress opens the Edit Image box (Figure 6-10).
There, you can make a few simple changes.
Most usefully, you can crop your picture. To do that, drag a rectangle around
the region you want to keep and then click the Crop button, which appears in
the small strip of buttons above your picture. This is the most common type
of picture edit.
You can also scale your picture down, reducing its size. To do so, type in either
a new width or a new height in the Scale Image section on the right, using pixels
as the unit of measure. WordPress adjusts the other dimension proportionally,
ensuring that you don’t distort the picture. Then click Scale to apply the change.
Finally, you can also flip or rotate your picture by clicking the corresponding
button above the picture.





As you drag your mouse
over a portion of your
picture, the Image Crop
section (right) shows the
exact size (in pixels) of
your selection.

NOTE When you edit a picture, WordPress actually creates a new file. If you look at the picture’s URL,
you’ll notice that WordPress appends a number to the end of the filename, so dead_elvis_tattoo.jpg becomes
dead_elvis_tattoo1339626522667.jpg, for example. There are two reasons for this sleight of hand. First, it prevents
problems if one of your posts needs to use the original version of the picture. Second, it lets you get your original
picture back later if you ever need it. To do that, edit the image, and then click Restore Original Image.

6. Click the “Insert into post” button in the Insert Media window to add the
picture to your post.
When you insert a picture, you’ll see it in the visual editor. If you chose left or
right alignment, you can type your text around the side of the picture. If you
chose None or Center for the alignment, you can type text only above and
below the image.
To tweak your picture, first click it to select it. Two small icons appear in the
picture’s top-left corner. Click the “X” icon to remove the picture from your post.
Click the pencil icon to open an Image Details box that lets you alter the picture
(using all the same tools available when you first insert a picture).

Chapter 6: Jazzing Up Your Posts




If you delete a picture from your post, it still exists on your WordPress site. This might be what you
want (for example, it lets you use the picture in another post), or it might be a problem (if you’re worrying about
someone stumbling across an embarrassing incident you made the mistake of photographing). To wipe a picture
off your site, you need to use the media library, as described in the next section.


Attaching Other Files to Your Post
Pictures aren’t the only type of file you can put in a post. WordPress.com lets you embed a number of other types of document, including PDFs, Word documents, Excel spreadsheets,
and PowerPoint presentations. In a self-hosted site, you face
no restrictions, so you can upload any type of file you want.
The difference is what happens after you upload the file. Unlike a picture, you won’t see the content from other types of

documents in your post. Instead, WordPress adds an ordinary
link that points to the uploaded file. If a reader clicks the link,
the browser may display the document or offer to download
it—what it does depends on whether the browser has an add-in
that can display that type of file. For example, many browsers
have add-ins that display PDF documents.

Viewing the Media Library
When you upload a picture, WordPress stores it in the wp-content/uploads folder of
your site. For example, if you upload a picture named face_photo.jpg to the Magic
Tea House site in January 2014, WordPress stores it at http://magicteahouse.net/
wp-content/uploads/2014/01/face_photo.jpg. Behind the scenes, WordPress also
creates large, medium, and thumbnail-sized copies of your picture with names like
face_photo_300x200.jpg, and stores them in the same folder. That way, WordPress
doesn't waste bandwidth sending a full-sized picture if a post needs to display just
a tiny thumbnail.
WordPress might store more files than you think. In addition to all the pictures you
insert into posts, all the featured images you use, and any custom header or background images you add to your theme, WordPress stores files that you attach to your
posts here, too, like PDFs, Word documents, and spreadsheets. Furthermore, if you
change a picture (using the basic cropping, resizing, and rotating tools described on
page 184), WordPress stores a new, separate version of the picture as well.
WordPress calls this repository, which holds your pictures and files, the media library.
To see the current contents of your site’s media library, choose Media→Library
(Figure 6-11).
There are two reasons you might want to use the media library: to remove files you
don’t need anymore, and to upload files you want to use in the future.



Deleting Pictures from the Media Library
You might choose to delete a media file as part of your basic website housekeeping.
After all, why keep a file you’re not using, especially if it’s distracting you from the
files you really do want?


To delete a media file, point to its filename and then click the Delete Permanently
link that appears underneath.


WordPress’s media library
lists all the files you’ve
uploaded. The “Uploaded
to” column indicates
whether you used a file in
a post (and, if you have,
which post features it).
For example, the owner
of this site used the
first picture in this list
(strawberry_tart.jpg) in
the post “Dinner at Crème

If you delete a picture that other posts are using, you have a small problem. Now
when someone reads the post, they’ll see the broken-picture-link icon, the universal
browser sign that something is missing. Correcting this problem is easy (just edit
the post to delete the picture box), but it’s up to you to find the post.
NOTE WordPress doesn’t let you replace a picture that’s in the media library. Even if you upload a picture
that has the same name as one already in your library, WordPress puts it in a different subfolder or gives it a
slightly different filename. The same thing happens if you edit a picture that’s already in the media library. This
system prevents a number of seriously frustrating problems, but it also means that there’s no way to update the
picture in a post without editing the post.

Chapter 6: Jazzing Up Your Posts



Adding Pictures to the Media Library
You might choose to add an image to your library to prepare for future posts. Maybe
you have a batch of pictures that detail a home renovation project, and you plan
to write about the process on your blog, “Home Sweet Home.” However, you don’t
want to start writing those posts yet. To make sure the pictures are ready when you
need them, you can upload them straight to the media library, and then use them
later. Here’s what to do:
1. Choose MediaÆAdd New.
This takes you to the Upload New Media page, which is strikingly similar to the
Insert Media window you used earlier.
2. Add your files.
You upload media files by dragging them onto the “Drop files here” box or by
clicking the Select Files button.
3. Optionally, fill in the information for each picture.
Fill in the picture details (like the title and caption) and edit the image (say,
cropping it or flipping it). When you actually insert the image into a post, you
still have the chance to enter new information or re-edit the picture. But if you
get some of the preliminary details down when you upload the picture, you’ll
save some time when you insert it.


Using the Media Library to Put a Picture in Your Sidebar
As you already know, the media library stores all the pictures
you use in your posts. You can also use it to store files you want
to use in some other way. For example, you can link to one of
your media files from an ordinary web page on a traditional,
non-WordPress website. All you need to do is take note of
the file’s URL. (To get that, choose Media→Library to visit
the media library, and then click the file you’re interested in.
WordPress displays the file’s location in the File URL text box.)
You can use the same trick to inject an image into the Text
widget (page 166), that all-purpose tool for showing scraps
of content outside your posts. As you learned in Chapter 5,
the Text widget accepts almost any HTML you can throw at it.
So if you know you have a picture in the media file with the
URL http://magicteahouse.net/wp-content/uploads/2014/06/
dead_elvis_tattoo.jpg , you can stick in an  tag like this:


I'm a hotshot tattoo artist living in the Bay Area. My work pushes the bounds of taste and decency, just like you know you want.

If you’ve been around the web block, you probably know that it’s better to trim the picture link down to just /wp-content/ uploads/2014/06/dead_elvis_tattoo.jpg. It’s on the same site as the rest of your WordPress content, so there’s no need to include the domain name. Either way, Figure 6-12 shows the result. WORDPRESS: THE MISSING MANUAL To insert a picture from the media library into a post, use the same Add Media button you learned about earlier. Here’s what to do as you create or edit a post: ADDING PICTURES 1. Move to the place in the post where you want to insert the picture, and then click Add Media. 2. Instead of adding a new file, click the Media Library tab to see what you’ve got. You see a list of thumbnail images, one for each picture in your library. 3. Find the picture you want, and then click it. You see the familiar picture thumbnail and picture details. 4. Change the text and edit the image, if necessary. 5. When you’re ready to add the picture, click “Insert into post.” FIGURE 6-12 With the help of the media library, you can mix text and pictures in WordPress’s Text widget. Chapter 6: Jazzing Up Your Posts 189 FEATURED IMAGES Featured Images Instead of simply including a picture in a post, you can designate it as a featured image. A featured image represents a post, but it doesn’t actually show up as part of the post content. Instead, its role varies depending on the theme you use. Some themes ignore featured images altogether. But many others place featured images at the top of the corresponding post, near the title area. Examples include Twenty Twelve, Twenty Thirteen, and Twenty Fourteen (as shown in Figure 6-13). FIGURE 6-13 The simplest way a theme can use a featured image is to place it at the top of a post. Twenty Fourteen does this, but it positions the post title so it slightly overlaps the picture, making the image recede into the background. Some themes exploit featured images in clever ways. For example, the Twenty Eleven theme temporarily swaps in the picture for the name of your site when you view a post with a featured image (Figure 6-14). 190 WORDPRESS: THE MISSING MANUAL FEATURED IMAGES FIGURE 6-14 When you read this post, the featured image (some tea leaf buds) temporarily replaces the site header. This works even though the picture doesn’t actually appear anywhere in the post. NOTE Twenty Eleven’s header-replacement trick works only if the featured image is at least as big as the header image. If your featured image isn’t as wide, WordPress won’t display it at all on the single-post page, nor will it explain the image’s perplexing absence. More ambitious themes use featured images to promote posts—for example, to highlight them in some sort of scrolling banner or gallery. Depending on the theme, this detail might be a built-in part of the home page, or it might rely on a themespecific widget. Chapter 6: Jazzing Up Your Posts 191 FEATURED IMAGES Figure 6-15 shows the free Brightpage theme, which is available to self-hosted WordPress sites. It displays a featured-image slideshow on the home page. This slideshow automatically grabs all the posts in the category named Featured (which you must create) and displays the featured images for each post, one after the other. FIGURE 6-15 The Brightpage theme uses a slider—a graphical banner that displays the featured images from your most timely or important posts. Each image appears for about 5 seconds, and then the slider changes to the next image using a slick transition effect (a fade, a blend, or a slide, which gives the slider its name). Visitors can click the featured image to view the corresponding post, or scroll down the page to see more posts. The nice thing about Brightpage is that it makes it easy for you, the site designer, to choose what posts get featured treatment. When you create a new post that you want to appear in the slider, assign it to the Featured category (in addition to whatever more meaningful category you already use). After some time passes and you decide that the post is no longer important, go to the Edit Post page and remove it from the Featured category. The Twenty Fourteen theme has a similar trick in store. Like Brightpage, it examines a group of posts you pick, retrieves their featured images, and uses them on the home page. The difference is in the details. While Brightpage asks you to identify the posts you want to use by creating a category named Featured, Twenty Fourteen expects you to use a tag named Featured. And while Brightpage uses a slider, 192 WORDPRESS: THE MISSING MANUAL Twenty Fourteen gives you the choice of a slider or a slick grid view, the latter being the standard setting (Figure 6-16). FEATURED IMAGES FIGURE 6-16 If you have posts that use the Featured tag, Twenty Fourteen removes them from the post list and puts them and their images in a grid at the top of your home page. Readers can then click an image to read the corresponding post. TIP To configure how Twenty Fourteen uses featured images, start by choosing Appearance→Customize (to customize the theme) and then click the Featured Content section. There, you can choose between a grid and a slider, and rename the Featured tag to something else. Assigning a Featured Image to a Post Each post can have just one featured image. To assign a featured image, you need to be in the Add New Post or Edit Post page. Then follow these steps: 1. Click the Add Media button. This opens the Insert Media window you saw earlier (Figure 6-7). 2. Click the Set Featured Image link on the left. 3. If the picture you want to use isn’t already in the media library, upload it now. You can upload your featured image by dragging it onto the Insert Media window, or by clicking Select Files and browsing for it. If your picture is already in the Media Library, click the Media Library tab and then click the picture to select it. Chapter 6: Jazzing Up Your Posts 193 FEATURED IMAGES 4. Add the image information. These details include the title, alternate text for screen readers, the caption, and the description. How much of this information WordPress uses in your post depends on the theme you chose, but it’s worth supplying the info just in case. 5. Click Edit Image, take a moment to scale and crop your picture, and then click Save to make your changes permanent. When you insert a standard image into a post, you get the chance to size it. But when you use a featured image, you don’t have this control. If you upload a big picture, it’s possible that your theme will automatically crop out a large part of it. (The Brightpage theme does this, for example.) To prevent this, you need to scale the picture down before you upload it, using an image editor like Photoshop Elements, Windows Photo Gallery, Picasa, or the Mac’s Preview program. To find the right dimensions, you need to experiment or scour your theme’s documentation. (Self-hosters, search for your theme at http://wordpress. org/themes, and then click your way through to the “Theme Homepage” link. WordPress.com users, search for your theme at http://theme.wordpress.com.) 6. Click the “Set featured image” button in the bottom-right corner. This adds the featured image and closes the Insert Media window so you can continue writing your post. Remember, you won’t see the picture appear alongside your text. If you decide at some point that you don’t want this picture as your post’s featured image, find the Featured Image box in the bottom-right corner of the page (it shows a scaled-down preview of your pic) and then click “Remove featured image.” 7. Publish your post (or update it, if you already published it). Remember, some themes don’t use featured images at all. If you use such a theme, you may not even know that your post has a featured image, because your theme never displays it. NOTE Featured posts are interesting because they rely on the interplay between WordPress features and theme features. WordPress defines the concept of the feature (in this case, featured images), and the theme decides how to exploit that concept, opening a wide, uncharted territory of possibilities. The same idea underpins many other WordPress features. For example, later in this chapter you’ll see how WordPress defines the concepts of post excerpts (page 202) and post formats (page 198), but allows themes to use them in a variety of clever ways. 194 WORDPRESS: THE MISSING MANUAL SHOWING PART OF A POST UP TO SPEED Learning to Use Featured Images with Your Theme As the discussion in this chapter shows, different themes use featured images in similar but subtly different ways. To get the result you want, you need to make sure you’re using featured images in the right way. For example, you may need to flag featured-image posts with a specific category name or tag name, or you may need to make them sticky (page 104). Picture size is another important consideration. Twenty Fourteen recommends that your featured images be 672 pixels wide and 1038 pixels wide, which lets them expand to their full size when displayed behind a post or in the slider. Other themes have their own strict size requirements. Violate them, and your pictures may be stretched, squashed, or cropped to fit the theme. Unfortunately, the dashboard doesn’t have a standard way to make this information available. It’s up to you to review the documentation for your theme. A good place to start is by searching for your theme in WordPress’s theme library (http://wordpress.org/themes for self-hosters or http://theme. wordpress.com for WordPress.com users). You can then follow the Theme Homepage link to find out what the developer has to say about the theme, or click the Support tab to browse other people’s questions and answers. For more information about the theme library, see Chapter 5. Showing Part of a Post At the heart of every WordPress blog is a home page, and at the heart of every home page is a reverse-chronological list of posts. This list serves a vital purpose, showing a snapshot of current content so readers can tell, at a glance, what’s going down on your site. However, the home pages you’ve seen so far have had one potential problem—they’re long, sometimes awkwardly so. Having multiple posts fused together into one long page is a great convenience for new visitors who want to read your content from end to end, but it’s not so helpful for return visitors who want to survey your new content and decide where to dive in. Fortunately, WordPress has a handy solution. You can decide to show only the first part of each post, called a teaser, on your home page, which your visitor can click to read the standalone post. One advantage to this approach is that you can pack quite a few teasers into your home page and keep them close together, no matter how long the posts really are. You can also put posts into tighter layouts—for example, creating a site that looks more like the front page of a newspaper. Another advantage is that it encourages readers to click through to the post, where they’ll also see the post comments and get the opportunity to join in the discussion. However, trimming down posts introduces two possible disadvantages. First, there’s the extra link readers need to follow to read a full post. If someone wants to read several posts in a row, this extra step can add up to a lot more clicking. Second, you Chapter 6: Jazzing Up Your Posts 195 SHOWING PART OF A POST need to explicitly tell WordPress what part of a post belongs on the home page. It’s an easy job, but you need to do it for each post you create. If you’ve already written a few posts, you need to update them. NOTE As a general rule, informal, conversational blogs work well with the standard one-post-after-another stream that WordPress displays on the home page. But WordPress sites that have more detailed article-like posts, use multiple sections, or feature multiple authors, often work better with a tighter, leaner style that uses teasers. In the following section, you’ll learn how to use teasers instead of full posts. You’ll also consider two related features: breaking posts into multiple pages and using post excerpts. Displaying Teasers Using the “More” Quicktag The best way to cut a post down to size is with a special WordPress code called the More quicktag. You place the More quicktag at the spot where you want to divide a post. The content that falls before the tag becomes the teaser, which WordPress displays on the home page (Figure 6-17, left). If a reader clicks through to the post page, he sees the entire post (Figure 6-17, right). FIGURE 6-17 When you use the More quicktag in a post, only part of the post appears on the home page (left). Click the “Continue reading” link to get the whole post in a new page (right). To insert the More quicktag in the visual editor, go to the spot in your post where you want to put the tag, and then click the Insert Read More Tag button. You’ll see a light-gray dividing line (Figure 6-18). You can also add the More quicktag in the HTML editor. You could click the button labeled “more,” but it’s just as easy to type in the tag yourself, wherever you want it: HTML nerds will recognize that the More quicktag looks exactly like an HTML comment—the sort of thing you might put in your markup to leave notes to yourself. 196 WORDPRESS: THE MISSING MANUAL Browsers ignore HTML comments, and WordPress borrows this system to sneak in some of its own special codes. SHOWING PART OF A POST FIGURE 6-18 When you edit a page, the More quicktag looks like a horizontal line between paragraphs. NOTE WordPress uses the More quicktag whenever your site displays more than one post at a time. The home page is the most obvious example, but you’ll also see multiple posts when you browse by category, date, or keyword. In these situations, the More quicktag serves the same purpose—it trims long posts down to more manageable teasers. There’s one more trick you can do with the More tag. In the previous example, a “Continue reading” link led from the teaser to the full post. The theme determines the link’s wording, but you can substitute your own text. To do that, you need to edit your post in HTML view, and then stick the link text in the middle of the More tag, exactly as shown here: If you want to change the link text for every teaser, editing your theme is far more efficient than editing individual posts (see Part 4 to learn how to edit your theme). Dividing a Post into Multiple Pages The More quicktag lets you split a post into two pieces: the teaser, and the rest of the content. Alternatively, you can split a page into as many sections as you want using the lesser-known Nextpage quicktag. When you do, WordPress adds a set of navigation links to the bottom of the post (Figure 6-19). Chapter 6: Jazzing Up Your Posts 197 SHOWING PART OF A POST FIGURE 6-19 These page-navigation links are a great way to split a long article into more manageable pieces. But use it sparingly—readers will resent being forced to click without a very good reason. To insert the Nextpage quicktag, switch to the HTML view (click the Text tab) and then add this code where you want to start a new page: The Nextpage quicktag shows up in the visual editor, as a gray line with the words “Next Page” above it. You can’t customize the Nextpage quicktag, but you can create custom page links if you’re willing to edit your theme files, as described in Part 4. The trick is to master WordPress’s wp_link_pages() function, which is described at http://tinyurl.com/wplinkpages. You can use the More and Nextpage quicktags in the same post. However, it’s generally a bad idea, because the page-navigation links will appear under the post teaser on the home page. This is likely to strike your readers as plain odd or utterly confusing. Summarizing Posts with Excerpts There’s another way to shorten posts on the home page: by using WordPress’s excerpts feature. Ordinarily, an excerpt is the first 50 or so words in a post (the exact number depends on the theme). Before you can really understand excerpts, you need to know how WordPress uses them. The answer isn’t straightforward, because it depends on your theme. Some older themes may avoid excerpts altogether, while others use them prominently (as you’ll see shortly). But most themes use excerpts in at least one place: on the search results page. To take a look for yourself, type something into the search box and then press Enter (Figure 6-20). 198 WORDPRESS: THE MISSING MANUAL SHOWING PART OF A POST FIGURE 6-20 When you search posts, WordPress doesn’t display full posts on the results screen. Instead, it automatically strips out and displays just the first 55 words. That way, you can see a page of search results without needing to scroll all day. So far, excerpts seem straightforward and automatic (and they are). However, the first few sentences of a post aren’t always a good reflection of its content. For that reason, you may want to write your own excerpt—in other words, explicitly provide a brief summary of the content in a post. You can do that from the Add New Post or Edit Post pages. First, choose Screen Options in the upper-right corner, and then turn on the checkbox next to Excerpt. A new box appears where you can write a custom description of your post. Chapter 6: Jazzing Up Your Posts 199 SHOWING PART OF A POST NOTE Things can get a bit confusing if you use excerpts and teasers. In that case, WordPress uses an excerpt if the post has one, a teaser if the post uses the More quicktag, or the first 55 words in the post if it has neither an excerpt nor a teaser. UP TO SPEED Writing Good Excerpts The best thing about excerpts is that they don’t need to be directly linked to the text in your post. But don’t abuse your freedom—to write a good, genuinely useful excerpt, you need to follow a few rules: • Keep it brief. Usually, when a visitor searches your site, WordPress finds several matching posts. By keeping your excerpts short (around the 55-word mark, just like WordPress does), you keep the search results short, which makes them easier to read. • Summarize the content of the page. The goal of an excerpt is to give someone enough information to decide if she wants to click a link to read the full post. An excerpt isn’t a place to promote yourself or make flowery comments. Instead, try to clearly and honestly describe what’s in the post. • Don’t repeat the post title. If you want to make sure every word counts, don’t waste time repeating what’s clearly visible in the title. Using Excerpts on Your Home Page At this point, you might think that it’s not worth the trouble to write excerpts for all your posts. And you could be right, if you use a standard theme and you don’t think that your visitors are going to be searching for posts. However, there’s another factor to consider: Some themes use excerpts for other purposes. For example, many themes use excerpts as the display text for posts on the home page. This way, the excerpt acts a bit like a teaser. The difference is that the standard WordPress teaser comes from the first part of a post, but you control the wording in an excerpt. The Brightpage theme described earlier (page 192) uses this system. If you provide an excerpt for a post, that’s what shows up on your home page, not the post content. The Oxygen theme, available for both WordPress.com and self-hosted sites, does the same thing, as you can see in Figure 6-21. NOTE None of the year themes like Twenty Twelve make much use of the excerpts feature. They use them in searches (as shown in Figure 6-20), but not on the home page. If you switch to a theme that makes heavy use of excerpts, you might find the summary so valuable that you want all your posts to use them, even the ones you've already created. WordPress has some plug-ins that can help. For example, the Excerpt Editor (http://tinyurl.com/csudedx) can give you a summary for every existing post, without you having to edit each one individually. 200 WORDPRESS: THE MISSING MANUAL SHOWING PART OF A POST FIGURE 6-21 The Oxygen theme displays the excerpt text and featured image for each post, instead of the post content. If the post doesn’t have a featured image, it grabs the first picture from the post and displays that. (And if the post doesn’t use any pictures at all, the theme simply shows an empty gray box.) This creates a clean, polished home page that has the feel of a professional news site. POWER USERS’ CLINIC Changing from Full-Post Displays to Summaries If you create a self-hosted site, you can make any theme display excerpts or full posts. But, first, you need to learn the basics of WordPress theme files and the WordPress loop, topics covered in Chapters 13 and 14. Once you know your way around a WordPress theme and the PHP code inside, you’re ready to make this relatively straightforward edit. Usually, you need to edit your index.php file, which creates the post listing on the home page of your site. To get the display style you want, your code needs to use the right WordPress function. If you use a function named the_content(), your page will show the full content of each post (or the teaser, if you use the More quicktag described on page 196). But if you use a function named the_excerpt(), your home page displays the post summary only. Usually, you can switch between the two display modes by modifying the line of code that has the function in it. If you want a bit more technical information, check out the WordPress function reference at http://tinyurl.com/theexcerpt . Chapter 6: Jazzing Up Your Posts 201 POST FORMATS Post Formats As you learned in Chapter 5, your choice of theme determines the basic appearance of every post on your site. Once you pick a theme, you can relax knowing that all your posts get the same font, color scheme, and spacing. Consistency reigns. But some themes offer an underused feature called post formats, which display different types of posts in different ways. On paper, post formats sound pretty nifty. The idea is that you pick a format for each type of post you write, and your theme uses slightly different styling for each of those post types. The problem is that WordPress limits themes to a small set of officially sanctioned formats. They’re mainly useful if you want to create a casual blog (sometimes called a microblog), where you throw together pictures, video clips, and post fragments, without worrying too much about organizing your content. In this scenario, post formats provide a structure that can help tame the chaos of your posts. But if you want to create your own post format to distinguish a group of posts that are particularly important to your site, you’re out of luck. NOTE Ambitious WordPress developers often complain that post formats don’t let them do what they really want to do: create their own post groupings and apply different formatting to each group. For example, you might want to take posts in a certain category and alter their formatting to make them stand out. (Imagine, for example, a news site that uses a bolder background to highlight violent crimes.) This technique is possible—and useful—but it’s not easy. You need to do all the work yourself, by adding style rules and code to your theme. (You can find an example starting on page 495.) And you need to have a self-hosted site to use this technique, because WordPress.com doesn’t allow theme editing. UP TO SPEED Understanding Microblogs Microblogs focus on small bits of content: news headlines, interesting links, personal status updates, random thoughts, and stream-of-consciousness chatter. They tend to be less formal, more personal, and more conversational than posts—almost like a cross between traditional blogs and old-school messaging systems like email and chat. Microblogs also mix different types of content, like audio, video, and images. In fact, some microblogs are built entirely out of pictures or video clips. The kings of microblogging are Twitter and Tumblr, but WordPress fans can join in, too. However, WordPress’s vaunted flexibility might overcomplicate your efforts. Because WordPress allows short, microblog-style posts and longer, more traditional entries, it’s easy to drown out the small stuff. You may also find that WordPress’s other features—categories, tags, the media library, and so on—overcomplicate your microblogging efforts. Applying a Post Format If your theme supports post formats, you’ll see a Format box in the Add New Post and Edit Post pages. There, you’ll find a list of all the formats you can use with the theme. You can pick any of them for a post, but if you don’t make a choice, your post sticks with Standard. 202 WORDPRESS: THE MISSING MANUAL Table 6-1 lists all the post formats that WordPress allows. Themes can pick and choose which of them they allow. POST FORMATS Table 6-1. The standard post formats POST FORMAT TYPE OF CONTENT Standard Standard, ordinary posts. Every post starts out using the Standard format. Aside A short snippet of text that doesn’t add up to a full post. Casual bloggers can use the Aside format to blurt out a quick thought, in much the same way that you might use a text message or a tweet on Twitter. Most themes don’t display a title for asides. Status A short update about what you’re doing right now (“Chillin’ with my Missin’ Manual, about to build a brilliant WordPress site”). Similar to the status update feature on virtually every social media site. Most themes don’t display a title for status updates. Link A link to another website, with little or no extra text. Most themes don’t display a title for links. Quote A short snippet of text that quotes some words of wisdom you want to share. Most themes don’t display a title for quotes. Image A post that contains a picture you uploaded. Gallery A post that contains a picture gallery, like the kind you’ll create on page 330. Audio A post that contains an audio recording. Video A post that contains a video file. Chat A snippet of a memorable conversation, offline or online. Usually looks like this: Joe: dude, why u ignorin me? Ben: im learnin some wordpress, bro You see these formats at work in the year themes (page 132), from Twenty Eleven on. Each theme has its own way of styling the formats. Often, you’ll be hard-pressed to spot the minor changes between an ordinary post and one with a format applied. In many cases, the only difference you’ll notice is the lack of a title for many formats (like asides and status updates) and the addition of a small icon. The Twenty Thirteen theme applies the most dramatic post format styles, with background colors (Figure 6-22). Chapter 6: Jazzing Up Your Posts 203 POST FORMATS FIGURE 6-22 Here are three posts using different post formats: a quote, a status update, and a clickable link. The Twenty Twelve theme (top) barely distinguishes between the three posts, while Twenty Thirteen (bottom) gets more colorful. 204 WORDPRESS: THE MISSING MANUAL To get a better sense of what your theme’s post formats look like, create some test posts and look at them on the home page. POST FORMATS The Ephemera Widget Some themes include a specialized widget to work with post formats. The most common example is the ephemera widget. Twenty Eleven and Twenty Fourteen both include one, named Twenty Eleven Ephemera and Twenty Fourteen Ephemera. The other year themes don’t include the ephemera widget at all. As the name suggests, the ephemera widget is all about fleeting scraps of content that are useful for a short period of time, like asides, quotes, and status updates. The ephemera widget gathers these bits of microblog content and displays them in a small, self-contained strip that you can pop into a sidebar (Figure 6-23). The idea is to call attention to smaller scraps of information that might otherwise be swallowed up in the clutter of your blog. FIGURE 6-23 Here, the Twenty Fourteen ephemera widget shows the three most recent quotes you posted to your blog. Chapter 6: Jazzing Up Your Posts 205 POST FORMATS To use the ephemera widget, choose Appearance→Widgets to visit the widgetdesigning section of the dashboard. Then, drag the widget to the spot on the page where you want it. Finally, customize it by supplying these three details: • A title that will appear above the widget. • The type of posts you want to show. You can choose any post format. However, the ephemera widget shows the full content of each post, so you’ll probably want to pick a short, microblog-style post format like Aside, Status, Quote, or Link. • Choose the number of posts that should appear in the widget. The Twenty Fourteen standard is two. TIP You can add more than one ephemera widget if you want to show different post formats. For example, one widget could show a list of links, a second could list status updates, and a third could show your most recent asides. All in all, the ephemera widget offers an interesting way to extract bits of content from a loosely structured blog. However, most serious bloggers are better served by using Twitter for microblogging and integrating a Twitter feed into their sidebars, as described on page 430. 206 WORDPRESS: THE MISSING MANUAL CHAPTER Adding Pages and Menus 7 I n previous chapters, you focused most of your attention on WordPress posts—the blocks of dated, categorized content at the heart of most WordPress blogs. But WordPress has another, complementary way to showcase content, called pages. Unlike posts, pages aren’t dated, categorized, or tagged. They exist independently of posts. The easiest way to understand the role of WordPress pages is to think of them as ordinary web pages, like the kind you might compose in an HTML editor. You’re likely to use pages for two reasons. First, even in a traditional blog, you may want to keep some content around permanently, rather than throw it into your ever-advancing sequence of posts. For example, personal blogs often include a page named About Me, where you provide biographical information. You don’t want to tie this page to a specific date—you want it easily accessible all the time. Similarly, businesses might use pages to provide contact information, a map, or a list of frequently asked questions. You can even create a fine-tuned home page to greet your visitors, instead of using the default reverse-chronological list of posts. Another reason to use pages is to build simple sites that don’t feel like blogs. Some people call these sites brochure sites, and the description isn’t entirely complimentary. That’s because brochure sites present a collection of fixed information, while blogs feel live and interactive. However, there’s a wide range of possibility between these two extremes. For example, if you create a site for your small business, you might use pages to display the core content of your site (information about your company, your policies, the brands you carry, and so on), while adding a blog-powered section of posts for news and promotions. Is this a blog, a brochure-site, or something in between? No matter the answer, it’s a great solution for plenty of people. 207 CREATING PAGES In this chapter, you’ll learn to use pages to either supplement your blog or to create a brochure-style site. You’ll also learn to manage page navigation with menus, so your visitors can find the content they want. Lastly, you’ll consider some of the innovative ways that different themes exploit the pages feature. Creating Pages Although pages behave differently from posts, the process of creating and managing them is similar. Just as you work with posts in the dashboard’s Posts menu, so you work with pages in the Pages menu. Here’s how to create a new page: 1. Choose PagesÆAdd New. This takes you to a screen named Add New Page (Figure 7-1), which resembles a slightly simpler version of the Add New Post page. TIP If your site is on WordPress.com, you can take advantage of another path to page creation—the Copy Page shortcut, which creates a new page based on an old one. Choose Pages→Copy a Page (instead of Pages→Add New), find the page you want to duplicate in the resulting list of pages, and then click the Copy button next to it. You’ll still end up at the Add New Page screen, but you start out with an exact duplicate of the page you picked, which you can modify to suit your needs. FIGURE 7-1 The form you use to create pages is similar to the one for creating posts. Both let you include pictures, fancy HTML markup, and featured images. But pages don’t let you add the classification details, like category and tag information, that posts do, which is why you don’t see those options here. 208 WORDPRESS: THE MISSING MANUAL 2. Give the page a title and some content. You’ll see the same content-editing box you use to create posts, with the same two tabs. Choose the Visual tab to see the formatted text for your page, more or less the way it will appear on your site. Choose the Text tab to see the underlying HTML markup. CREATING PAGES For now, don’t worry about the Page Attributes box—you’ll learn about the options there a bit later. 3. Finally, click Publish to make the page live on your site. Or choose one of the other options in the Publish box. Just as with posts, you can save a page as a draft (page 97) or schedule it for future publication (page 100). When you publish a page, a “Page published” message appears at the top of the page, confirming that it’s up and open to the public. Now is a good time to click the “View page” link to take a look (Figure 7-2). NOTE Pages don’t have categories and tags, they aren’t listed in chronological order, and you can’t browse them by date. However, they still have some WordPress smarts. Most notably, they get their formatting instructions from WordPress themes, just like every other part of your site. In most themes, a basic page looks a lot like a basic post—for example, both use the same fonts for their title and text. FREQUENTLY ASKED QUESTION Understanding Pages Why do some people call pages “static pages”? Although WordPress calls this feature pages, many webheads find that confusing. After all, isn’t a page anything you view on the Web with a browser? And don’t posts appear in web pages? For these reasons, WordPress experts—and WordPress itself, sometimes—often use a different term. They call WordPress pages static pages. Sadly, this term is almost as confusing. It stems from the old days of the Web, when designers distinguished between dynamic pages that could do incredible feats with the help of code, and static pages that showed fixed, unchanging content. That fits with the way most people use WordPress pages—they create them, fill them with content, and then publish them. However, WordPress pages aren’t really static—they do change. Flip your blog over to a different theme, and all your posts and pages update seamlessly to match the new style. That’s because WordPress stores all the content for your pages—as well as the content for the rest of your site, including posts—in its database. And, finally, a static page changes anytime you decide to edit it. If you’re still confused, here’s the bottom line: A WordPress site can hold both posts and pages, and you create, format, and manage them in much the same way. The key difference is that WordPress automatically dates, orders, and groups posts. WordPress also puts them on the home page and assumes that people will want to read them from newest to oldest. From WordPress’s point of view, posts are the lead actors on your site, while pages are supporting characters. But you’re not bound by that narrow definition of a site, as you’ll see on page 228. Chapter 7: Adding Pages and Menus 209 CREATING PAGES FIGURE 7-2 A page in WordPress looks suspiciously like a post. If you keep WordPress’s standard settings, your page even has room for comments, which you’ll learn to use in Chapter 8. (You can also turn comments off for your pages, as explained on page 230.) To review a list of the pages on your site, choose Pages→All Pages. You see a familiar table of pages, which works the same way as WordPress’s list of posts and media files. Point to a page title, and you have the choice to view the page, edit it, or delete it (see Figure 7-3). And if you’re working with piles of pages, you can use the same bulk actions you use with posts to delete or change a whole group of pages in one step. 210 WORDPRESS: THE MISSING MANUAL VIEWING PAGES FIGURE 7-3 Every WordPress site starts with a sample page called, rather unimaginatively, Sample Page. Now is a good time to delete it. Just point to the title and then click Trash. Viewing Pages You can probably think of a couple of pages that would improve your site. If nothing else, you could add an About Me page with your biographical information in it. But a key question remains: How do your guests visit pages? Like posts, every page gets a unique web address (URL), called a permalink. The permalink appears under the page’s title box as soon as you start entering the page content. WordPress uses the same rules to create page permalinks as it does to create post permalinks (as explained on page 116), and you can edit the permalink for any page (page 119). But the important detail is that you can find a page by typing its address into your browser. Of course, your readers aren’t likely to type in any URL other than the address for your home page, so you need to provide links so visitors can get to your pages. One way to do this is by putting links in posts and pages so you can connect them together. For example, you could add a link to the page shown in Figure 7-2 that takes readers to a new page when they click “Family Law” (Figure 7-4). Chapter 7: Adding Pages and Menus 211 VIEWING PAGES FIGURE 7-4 Clicking the Family Law link takes readers to the Family Law page. Making this happen is easy. You simply edit the “About the Practice” page, use the trusty Add Link toolbar button, and then find the Family Law page in the list of existing content. Links are a decent way to join related posts and pages, but they aren’t much help if a guest wants to browse the pages on your site. That’s not a problem with posts—if your visitors want to read posts, they can browse them easily on the home page, starting with the most recent one and moving back in time. Or they can browse posts in a specific category or with a specific tag (page 123). But WordPress doesn’t put pages in chronological order, feature them on the home page, or give them category or tag information. Visitors can find pages through a keyword search (by typing something into the search box and then pressing the Enter key), because searches scan the content in both posts and pages. But guessing at keywords is a clumsy way to find a page, and it’s no substitute for a more convenient navigation system. Fortunately, WordPress has several better, ready-made solutions to help visitors find your pages: • The Pages widget. Add this to your page, and visitors will always see a list of all your pages, in the order you want. This widget works best if you want to highlight all (or almost all) of your pages. • An automatic menu. Many themes automatically put all your pages in a menu on the home page. The only problem is that this auto-generated menu includes every page in your site. If that results in an overly cluttered or disorganized menu, you’ll prefer the next option. 212 WORDPRESS: THE MISSING MANUAL • A custom menu. You pick the pages you want to showcase and arrange them just so. You then display the menu somewhere prominent on your home page (often where the automatic menu used to go). Most people take this route. VIEWING PAGES You’ll explore all these options in the following sections. Showing Pages in the Pages Widget The Pages widget displays a simple list of links (Figure 7-5). Like any other widget, you can place it anywhere on your home page, such as in a sidebar. Choose Appearance→Widgets and then drag the widget where you want it. FIGURE 7-5 The Pages widget displays all the pages you create. Visitors can click a link to visit a page. You may want to use the Pages widget to show just some of your pages. To do that, you need to explicitly indicate what pages you don’t want to show. Each page has a unique ID number, and you indicate the pages you want to exclude by creating a comma-separated list of ID numbers in the Exclude box (Figure 7-6). FIGURE 7-6 This Pages widget is configured to show every page except numbers 2 and 24. The slightly tricky part is figuring out the page’s ID number. If you run a self-hosted blog and you haven’t changed WordPress’s permalink style (page 117), the ID appears right in the URL. But if you use WordPress.com or you switched to more readable Chapter 7: Adding Pages and Menus 213 VIEWING PAGES title-based permalinks, you need to take a different tack. First, go to Pages→All Pages to see all the pages in your site. Then point to the title of the page you want to exclude. The page’s URL appears in your browser’s toolbar, in this format: http://prosetech.com/thoughtsofalawyer/wp-admin/post.php?post=24&action=edit In this example, the page ID is 24. (Don’t be confused that the URL actually calls the page a post—it’s an old but harmless WordPress quirk.) TIP If you have trouble seeing a page’s permalink in your browser, try copying the address. Right-click the page title and choose a command with a name like Copy Shortcut or Copy Link Address (the exact wording depends on your browser). You can paste the link into a text editor like Notepad and find the page ID there. WORD TO THE WISE Use the Exclude Box Sparingly It might occur to you that you could add several Pages widgets to different parts of your home page, each of which shows a different subset of pages. That’s an interesting idea, but a bad one, because of the way the exclusion list works. If you use the Pages widget to create three page lists, for example, every time you add a new page that you want to leave off the lists, you need to add the page to the exclusion list of each menu. That extra work can cause a serious headache. To avoid this, use the Pages widget only when you want to show most or all of your pages. If you want to show a smaller group of just a few pages, create a custom menu and show it with the Custom Menu widget, as explained on page 228. The Pages widget also lets you sort your list of pages. You set the sort order using the drop-down list in the “Sort by” box. Ordinarily, the order is “Page title,” which means that WordPress organizes your pages alphabetically by title. Alternatively, you can choose “Page ID,” and WordPress lists pages from oldest to newest (because newer pages always get higher ID numbers). Lastly, you can choose “Page order,” which lets you pick the order, as you’ll see on page 216. Showing Pages in a Menu Most themes start out with a menu. In fact, menus are considered so important to the average WordPress site that most themes don’t let you remove the menu (at least not without resorting to the style editing tricks covered in Chapter 13). Unlike desktop programs, which typically have strict, consistent rules about where menus go and what they look like, menus on the Web take many forms. The only consistent rule is that every menu is a set of links arranged as headings and subheadings. In WordPress, the way a menu looks is completely in the hands of your theme. For that reason, WordPress puts the menu management command in the dashboard’s Appearances menu, alongside the controls for other theme features. Many themes put a site’s main links in a traditional menu bar, which it arranges horizontally near the top of each page. In the Twenty Twelve theme, for example, the menu sits above the list of posts (Figure 7-7). Other themes arrange the menu vertically and place it on the side, like WordPress’s dashboard menu. 214 WORDPRESS: THE MISSING MANUAL VIEWING PAGES FIGURE 7-7 Every theme has its own distinct way of styling the main menu. Here are three examples from WordPress’s standard year themes. When you create a new WordPress site, it starts out with an automatic menu, so named because WordPress creates it automatically. At first, the menu holds just two commands: a Home button that goes to your home page, and a Sample Page button that opens the WordPress sample page (unless you took our earlier advice and deleted it). But every time you add a new page, like the “About the Practice” page shown earlier, WordPress adds a matching link in the menu. It keeps the links ordered alphabetically by page name. Chapter 7: Adding Pages and Menus 215 VIEWING PAGES You can exert more control over how your theme arranges the page links in a menu, in one of two ways: You can use the ordering and grouping features described next, or you can create a custom menu (page 218). The ordering and grouping approach works best if you just want to adjust the position of a few commands in the automatic menu but you’re happy letting WordPress run the show. By comparison, custom menus take slightly more work but pay off with far more flexibility and extra features. Ordering Pages Often, when you display a list of pages, you want to dictate which ones show up first and which ones are last. You can do this by typing in a number for the Order setting, which appears in the Page Attributes box when you create (or edit) a page. The Order setting affects the order of your pages in two situations: when you display pages in an automatic menu and when you display them in the Pages widget with the “Sort by” box set to “Page order.” Ordinarily, WordPress sets the order number of every page to 0. Technically, that means that each page is tied for first position, and the page order setting has no effect. But if you want to set the order (say you want “Our Story” followed by “Our Location” followed by “Contact Us”), you’d assign these pages steadily increasing page-order numbers (say, 0, 1, and 2). The actual numbers don’t really matter—the important thing is how they compare. WordPress always displays larger-numbered pages toward the bottom of the list or on the right end of a horizontal menu, with smaller-numbered pages closer to the top of a list or to the left of a menu bar. If two or more pages have the same order value, WordPress orders them alphabetically. TIP If you rearrange a bunch of pages, you need to change their page-order values. The easiest way to do that is to go to the Pages list (choose Pages→All Pages), point to a post, and click the Quick Edit link. This way, you can quickly modify some page information, including the order, without opening the whole page for editing. There’s another way to group pages: You can designate some as child pages that belong to a specific parent page. (You may have used this type of organization before, to create subcategories for your posts, as described on page 110.) To create this hierarchy, you set the Parent setting in the Pages Attribute box when you create or edit the page. For example, you could edit the Family Law page and change the Parent list box from “(no parent)” to “About the Practice.” Now, Family Law is a subpage in the “About the Practice” group. To better understand the effect of ordering and grouping, imagine you have these pages: 216 PAGE TITLE ORDER PARENT About the Practice 0 - Assault Charges 3 About the Practice WORDPRESS: THE MISSING MANUAL PAGE TITLE ORDER PARENT Drug Offenses 2 About the Practice Family Law 0 About the Practice Personal Injury Defense 1 About the Practice Legal Disclaimers 1 - Referrals 0 - VIEWING PAGES The order settings create the nicely styled menu and nested list shown in Figure 7-8. The menu displays subsidiary pages in submenus, while the Pages widget slightly indents nested pages. FIGURE 7-8 This site lists its pages in two places. At the top is the familiar menu bar, now with a submenu. On the right side, the Pages widget shows the same collection of pages, but sorted by title. Life can get a bit confusing when you order and group pages. Just remember that when WordPress orders pages, it compares only the pages at the same level. For example, you can use the page order to adjust the position of the Assault Charges, Drug Offenses, Family Law, and Personal Injury Defense pages with respect to one another. However, WordPress won’t compare the order values of the Family Law and Legal Disclaimers pages, because they aren’t at the same level and won’t ever be shown next to each other. Chapter 7: Adding Pages and Menus 217 CUSTOM MENUS NOTE If you use post names in your permalinks (page 116), child pages get their own permalink. It includes two posts titles: the name of the child page itself and the name of the parent page. For example, if the child page “Family Law” has the parent “About the Practice,” the full permalink might be something like http://thoughtso falawyer.net/about-the-practice/family-law. Custom Menus WordPress’s ordering and grouping features give you enough flexibility to create a good-looking, well-ordered menu. However, there are a few good reasons why most WordPress developers eventually decide to build a custom menu: • To get more types of menu items. An automatic menu includes links to your pages, and that’s it. But a custom menu can include other types of links—for example, ones that lead to a particular post, a whole category of posts, or even another website. • To hide pages. An automatic menu always includes all your pages. This might not be a problem for a relatively new WordPress site, but as your site grows, you’ll probably add more and more pages and use them for different types of information. Eventually, you’ll create pages that you don’t want to include in your main menu (for example, you might want to add a page that readers can visit only by clicking a link in a post). The only way to hide a page from a menu is to abandon the automatic menu and build a custom menu. • To have multiple menus. Some themes support more than one home page menu. However, a site can have only one automatic menu. To take advantage of the multiple-menu feature, you need to create additional menus as custom menus. • Because sometimes automatic menus are hard. To get an automatic menu to look the way you want it to, you need to think carefully about the order and parent settings. If you have dozens of pages, this sort of planning can twist your brain into a pretzel. If you build a custom menu, you can drag and drop your way to a good-looking menu. It still takes time and work, but it requires a lot less planning and thinking. Building a Custom Menu When you’re ready to replace your theme’s automatic menu with a menu of your own creation, here are the steps to follow: 1. Choose AppearanceÆMenus. This brings you to the sophisticated menu editor (Figure 7-9). 2. Click the “create a new menu” link at the top of the page to create a new, blank menu. The next step is to give your menu a name. 218 WORDPRESS: THE MISSING MANUAL 3. Enter a name for your menu in the Menu Name box. The name uniquely identifies the menu. Normally, you name the menu after its function (Main Menu, Navigation Menu, Page Menu, and so on). You shouldn’t name it based on its position (as in Top Menu Bar), because that detail may change if you switch themes. CUSTOM MENUS FIGURE 7-9 Depending on your theme, the menu editor may start out blank, or it may show you the commands that are currently part of the automatic menu, as it does here. Either way, you need to create a menu of your own before you can take control of its contents. 4. Click the Create Menu button. WordPress stores the menu as part of your site, so you can edit it anytime. Now you’re ready to fill it up with useful commands (Figure 7-10). 5. Decide whether you want to add a page, link, or category to your menu. If necessary, click the heading to expand the Pages, Links, or Categories section (Figure 7-11). A page is, obviously, a link to one of the pages you created. A link goes to some location on the Web, either on your site or another site. For example, you could create a custom link that points to a specific post (using its permalink), a Wikipedia page, a friend’s blog, or something else. A category is a link to a page that displays all the posts in a given category (in reverse-chronological order). It has the same effect as clicking a link in the Categories widget (page 112). Chapter 7: Adding Pages and Menus 219 CUSTOM MENUS FIGURE 7-10 The left side of the menu editor has three sections (Pages, Links, and Categories) that let you add various links to your menu. Right now, the Pages section is expanded. FIGURE 7-11 You can set options for only one menu section at a time. You choose which one by clicking the heading. For example, if you want to add a link but the Pages box is expanded (left), click the Links heading to open the Links box (right). 220 WORDPRESS: THE MISSING MANUAL 6. Enter the information for your menu item. If you’re adding a page, click the checkbox for the page you want to add. You can tick several checkboxes to add a whole group of pages at once. The Pages box lets you choose your pages from three different tabs. Use Most Recent to choose from the newest pages you created, View All to browse through all your pages, and Search to find a page by name (which is useful if your site has dozens or more pages). CUSTOM MENUS If you’re adding a link, fill in the address in the URL box and specify the link text in the Link Text box. If you’re adding a category, click the checkbox for the category you want. Adding a category is similar to adding a page—you can browse a list of your categories, choose from your most frequently used categories, or search for the category you want by name, depending on what tab you pick. You can also add multiple categories at once by ticking multiple boxes. TIP It makes sense to add a link named “Home” or “Posts” to most new menus. That way, your guests always have a way to get back to your home page. To create a home page link, choose the View All tab in the Pages box, turn on the checkbox next to Home, and then continue with the next step. GEM IN THE ROUGH Getting Even More Menu Links The menu editor makes it easy to link to another page on your site, to a category of posts, or to another website entirely. But you can get even more menu-creating options if you click the Screen Options button (found in the top-right corner of the page) and turn on the Posts and Tags checkboxes. If you do, you’ll get three more boxes for adding menu items. The Posts box shows a list of all your posts, letting you add a link to a specific post without needing to remember the permalink. The Tags box is similar to the Category box—it lets your visitors browse all the posts that have a specific tag. And the Format box lets you add links to different post formats (page 202), if you use the formats in your blog. For example, you can add a link that lets readers view all the Aside posts or all the Quote posts. 7. Once you make a choice, click the “Add to Menu” button. Your new item appears in the menu section on the right. 8. Optionally, customize the label and tooltip (title) of your menu item. When you first add an item, it shows up as a collapsed gray box. To change the options for that item, click the down-pointing arrow on the right side of the box. This expands the box so you can see (and edit) all the settings for that item (Figure 7-12). Chapter 7: Adding Pages and Menus 221 CUSTOM MENUS Here are the settings you can change: • Navigation Label, which is the link text that appears in the menu. If you add a page or a category, the navigation label is the name of that page or category, which keeps things simple. But you might want to edit the text if it’s too long to fit comfortably in your menu. • Title Attribute, which sets the tooltip that pops up when someone points to a menu item. Usually, the title attribute is blank, and the tooltip displays the name of the menu item. But you could get fancy and use the Title attribute to supply a more detailed description. • Remove, which does the obvious: deleting a menu item you don’t want anymore. FIGURE 7-12 In the menu editor, WordPress represents each menu item with a separate gray box. To see the settings for an item, you must expand this box by clicking the down-pointing arrow in its right corner. In this example, the menu includes three links (Home, Legal Disclaimers, and Referrals), but only one (Legal Disclaimers) is expanded. 222 WORDPRESS: THE MISSING MANUAL 9. Return to step 5 to add another item to your menu, and repeat these steps until you stock your menu with all the items you want. CUSTOM MENUS WordPress adds items to the menu in the order you add them. So the items you add first appear on the left of a horizontal menu, or at the top of a vertical menu. However, don’t worry about the order yet, because you’ll learn how to move everything around in the next step. 10. Now it’s time to arrange your menu items. Drag them around to position them and group them into submenus. Unlike automatic menus, custom menus don’t pay attention to your pages’ order or parent settings. This is good for flexibility (because it means you can arrange the same commands in different menus in different ways), but it also means you need to do a little more work when you create the menu. Fortunately, arranging menu items is easy. To move an item from one place to another, simply drag it, just as you move widgets in the Widgets page. WordPress displays items in top-to-bottom order, so if you use a horizontal menu (as the WordPress standard theme does), the topmost item is on the left, followed by the next menu item, and so on. Creating submenus is just as convenient, once you know the trick. First, arrange your menu items so that the child items (the items you want to appear in the submenu) appear immediately after the parent menu item. Then, drag the child menu item slightly to the right, so that it looks like it’s indented one level. Figure 7-13 shows what the result should look like, and Figure 7-14 shows the formatted WordPress page. Chapter 7: Adding Pages and Menus 223 CUSTOM MENUS FIGURE 7-13 By dragging the Assault Charges page slightly to the right, it becomes a submenu item under the “About the Practice” page, along with several other pages. Figure 7-14 shows the result. 224 WORDPRESS: THE MISSING MANUAL CUSTOM MENUS FIGURE 7-14 Now the “About the Practice” page has a submenu. NOTE You can easily create multilayered menus (menus with submenus inside of submenus). All you do is keep dragging items a bit more to the right. However, most well-designed WordPress sites stop at one level of submenus. Otherwise, guests may find it awkward to dig through all the layers without accidentally moving the mouse off the menu. FREQUENTLY ASKED QUESTION Creating a Menu Item That Does Nothing Can I make a submenu heading that visitors can’t click? WordPress menus work a little differently from the menus in traditional desktop computer programs. When you have a submenu in a desktop program, you click the parent menu item to open the submenu, and then you click one of the items inside the submenu. But in WordPress, you just point to the parent menu item to open it. The parent item is still a real menu item that leads somewhere—if you click it, you go to a new page, category, or custom URL. For example, in Figure 7-14 you can point to “About the Practice” to open its submenu, or you can click the title to go to the About the Practice page. But perhaps this isn’t the behavior you want. For example, you might want the “About the Practice” menu item to be a nonclickable heading, which exists solely to house the submenu underneath. To create an unlinked heading, add a new command from the Links box, set the label to “About the Practice,” and then set the URL to # (the number sign character—that’s all). To browsers, the # symbol represents the current page, so if you click the menu item (“About the Practice” in this example), you won’t go anywhere. In fact, you won’t even see the page flicker, which is exactly what you want. Chapter 7: Adding Pages and Menus 225 CUSTOM MENUS 11. Optionally, you can turn on the “Automatically add new top-level pages” setting. If you do, every time you create a new page, WordPress automatically tacks it on to the end of your custom menu. This is similar to the way an automatic menu works, although you can edit your custom menu any time to move newly added items to a better place. Most WordPress experts avoid this setting, because they prefer to control what gets into their menu and where it goes. 12. Turn on one of the “Theme location” checkboxes at the bottom of the menu box. Some themes let you decide where on a page your menu goes. For example, the Twenty Fourteen theme lets you put your menu at the top of the page (choose the “Top primary menu” checkbox) or the side (choose “Secondary menu in left sidebar”). Many themes have just one location for menus, however. If that’s the case for your theme, you’ll see a single checkbox with a label like Primary Menu. Even though you have no real choice about where to put the menu, you still need to turn on the checkbox to add the menu to your site. 13. Click Save Menu to make your changes permanent. Once you save your menu, you can try it out on your site’s home page. Multiple Menus Many themes support more than one menu. Consider, for example, the Oxygen theme you tried out in Chapter 6 (Figure 7-15). It allows no fewer than three menus. The primary menu appears under the page header, the secondary one shows up in the left-hand sidebar, and the tertiary menu appears below that, in the footer section. You can imagine using these menus for distinctly different tasks—using the top menu to navigate the whole site, for example, the side menu to drill into specific posts or categories, and the bottom menu to link to other sites with related content. NOTE You don’t need to use all the menus a theme provides. Initially, WordPress creates an automatic menu and uses it as the theme’s primary menu. Any additional menus start off hidden, and appear only if you attach custom menus to them. To use the Oxygen theme’s three menus, you need to create three custom menus. Repeat the process described in the previous section three times, clicking the “create a new menu” link to add each additional menu. Once you have more than one menu, WordPress adds a menu list to the top of the menu editor. Using it, you can choose which menu you want to see and edit (Figure 7-16). 226 WORDPRESS: THE MISSING MANUAL CUSTOM MENUS FIGURE 7-15 One page, three menus. All of them support pop-up submenus (not shown). FIGURE 7-16 The menu editor forces you to edit one menu at a time. You choose the menu from the “Select a menu to edit” list and click Select to open it. Once you create your custom menus, you need to put each one in the appropriate location in your theme. You do that using the checkboxes in the “Theme locations” section, under each menu. But if you have trouble remembering which menu goes where, you have another choice. Click the Manage Locations tab to see a list of all the menu placeholders in your theme. Next to each is a drop-down list of the menus Chapter 7: Adding Pages and Menus 227 CHANGING YOUR HOME PAGE you created. You can specify a menu for each area and then click Save Changes to make your changes permanent in a single step. The Custom Menu Widget There’s one more way to display a custom menu: in the Custom Menu widget. Now that you’ve played with menus in depth, the Custom Menu widget won’t impress you much. To use it, drag it onto your page (say, in a sidebar), give it a title (optional), and then pick the menu it should show. The Custom Menu widget shows a bulleted list of links, using nested bullets for submenu items. In fact, the Custom Menu widget looks a lot like the Pages widget, shown in Figure 7-8. The advantage of the Custom Menu widget is that it’s more flexible than the Pages widget. The Pages widget shows all (or almost all) of your pages, but the Custom Menu widget shows just the pages you want and can optionally include other category links and links to other websites, provided that you add them to your custom menu. TIP One nifty way to use the Custom Menu widget is to create a blogroll—a list of blogs you recommend, blogs by people you know, or sites that have content similar to yours. For example, a cooking blog might have a blogroll with other food-related blogs in it. All you need is a new menu (you can name it “Blogroll”), which you can then fill with links. Changing Your Home Page Right now, your WordPress site has a home page dominated by a familiar feature: the reverse-chronological list of your posts. Visitors can use your site’s navigation menu to travel somewhere else, but they always begin with your posts. This setup is perfectly reasonable—after all, your posts typically contain the newest, most relevant content, so it’s a good idea to showcase them up front. However, this design doesn’t fit all sites. If the list of posts is less important on your site, or if you want to show some sort of welcome message, or if you just want to direct traffic (in other words, give readers the option of reading posts or going elsewhere on your site), it makes sense to start by showing a page instead of a post. In the following sections, you’ll find out how. First, you’ll use one of your customcreated pages as your site’s home page, all in the interest of building a brochure site. Next, you’ll see how to get the best of both worlds: a fixed home page with the content you want and a list of posts, tucked away in another place on your site. Creating a Brochure Site The simplest way to change your home page is to ditch the post system altogether, using pages instead of posts throughout your site. The resulting all-pages site is sometimes called a brochure site, because it resembles the sort of informational pamphlet you might pick up in a store (Figure 7-17). 228 WORDPRESS: THE MISSING MANUAL CHANGING YOUR HOME PAGE FIGURE 7-17 This restaurant website is a collection of WordPress pages, including those labeled Location, Our Philosophy, and Our Menu. Unlike posts, pages aren’t related in any obvious way, nor are they dated, categorized, or tagged. To create a brochure site, you follow some simple principles: • Build a site that consists entirely of pages, each one hand-crafted by you. • Add these pages to a custom menu, and arrange the pages the way you want. • When visitors arrive at your site, the first thing they see is one of your pages and a navigation menu. You already know how to perform each of these tasks, except the last one (changing the home page). That’s what you’ll learn next. Chapter 7: Adding Pages and Menus 229 CHANGING YOUR HOME PAGE UP TO SPEED Should You Build a Brochure Site? A brochure site may make sense if you’re building a small site with very simple content. The restaurant site in Figure 7-17 is one example. if you include posts. Think of it this way: A brochure site feels like a statement, while a blog feels like a constantly unfolding conversation. But if you’re trying to decide between a brochure site and a post-based site, consider two questions. First, would your site be more attractive to readers if you included posts? Even the bare-bones restaurant site might be more interesting with posts that chronicle restaurant news, menu experiments, and special events. Not only that, but the fact that posts are frequent, dated, and personal makes the site more vibrant. In addition, if you want to get people talking on your site—for example, posting comments about recent meals or sending in requests and off-the-wall recipe ideas—you’ll have more luck Then again, you may decide that a brochure site is exactly what you want. Maybe you really don’t have time to spend updating and maintaining a site, so you simply want a place to publish some basic information on the Web and leave it at that. You can still take advantage of several of WordPress’s best features, like themes, which ensure that your pages look consistent. You’ll also get WordPress’s help if you want to track visitors (page 444), add sharing buttons (page 412), or add any one of a number of features described in this book. The key step in building a brochure site is changing your home page, replacing the traditional list of posts with a page of your own devising. So your first step is to create a substitute home page, using the familiar dashboard command Pages→Add New. You might want to make a few changes to the home page, since it serves as the welcome mat to your site. For example, you may want to include navigation links in the home-page text that take visitors straight to important content. However, that’s not necessary. As long as your theme includes a menu, visitors can use it to click through to more content. You may also want to tweak the comment settings for your custom home page. By default, all pages, just like all posts, allow comments. But it seems a bit unstructured to let people comment directly on the home page of your website. Fortunately, it’s easy enough to turn comments off for any page. First, use the Screen Options button (page 124) to open the Discussion box, and then turn off the “Allow comments” checkbox. Once you create your new, replacement home page, follow these steps: 1. Choose SettingsÆReading. 2. In the “Front page displays” setting, choose “A static page” (rather than “Your latest posts”). 3. In the “Front page” list underneath, pick the page you want as your new home page. 230 WORDPRESS: THE MISSING MANUAL 4. Click Save Changes at the bottom of the page. Now, when you surf to your site’s home page, WordPress automatically serves up the page you picked (although the URL won’t change in the browser’s address bar—it’s still the home page of your site). Similarly, when you click Home in the menu, you return to your custom home page. CHANGING YOUR HOME PAGE TIP If you use a custom page for your home page, you may want to jazz it up with a few more navigational features. Many themes provide page templates that can help you out by adding a widget-stocked sidebar beside your page content, for example. You’ll learn more on page 233. Creating a Custom Entry Page Even if you want to change your home page, you might not want to ditch the post system. In such a case, use a static home page (called a welcome page), and include a full complement of posts on another page. The trick to doing this is specifying a URL for the page that displays your posts. Here’s where things get slightly bizarre. To get the URL for your posts, you create yet another page. This page is just a placeholder—its sole purpose is to provide the web address for the posts page. You don’t actually need to put any content on this page, because WordPress automatically creates the list of posts. Here’s the process: 1. Decide on a URL for the posts section of your site. For example, if your home page is at http://magicteahouse.net, you might put the posts at http://magicteahouse.net/posts or http://magicteahouse.net/blog. NOTE If you use the self-hosted version of WordPress, you need to make sure you changed your site’s permalink setting to use post titles rather than post IDs (page 117). Otherwise, the link to your placeholder page will use the post’s ID, not its name. This is terribly confusing—it means you’ll end up with a permalink with a name like http://magicteahouse.net/?p=583 that actually shows your list of posts. 2. Create a page with a name that matches the URL you want. For example, you can create a page named posts or blog. 3. Optionally, add some content. You don’t need any content (and you probably don’t want any, either). But if you do add an introductory paragraph or two, WordPress displays it just above the list of posts. Don’t put any content in this page—think of it as a placeholder for your old home page. Chapter 7: Adding Pages and Menus 231 CHANGING YOUR HOME PAGE 4. Publish your page. Your placeholder page is ready. Now all you need to do is change your site settings. 5. Choose SettingsÆReading. Here, you specify your custom home page and your new posts page. 6. If you haven’t already set a custom home page, do that now. In the “Front page displays” setting, choose “A static page” (rather than “Your latest posts”). In the “Front page” list underneath, pick the page you want to use for your new home page. 7. In the “Posts page” list, pick the page you created in step 2. This step tells WordPress to start using your placeholder page to show the list of posts. 8. Click Save Changes at the bottom of the page. Now visitors can see your old home page—the list of posts—using the URL for the placeholder page you created in step 2. So if you created a page named Posts, when you request that page (say, http://magicteahouse.net/posts), you see your list of posts. But if someone requests the home page (http://magicteahouse.net), they’ll see the custom home page you picked in step 5 instead of the list of posts. 9. Optionally, edit your menu and add a new menu item for your new posts page. Even though you created a posts page, that doesn’t mean your visitors know about it. They need a way to get there, and the best option is a link in your site’s menu. Creating that is easy—you simply add a new menu item that points to your placeholder page (Figure 7-18). In some cases, you may decide not to lump all your posts together in a single reversechronological stream. In that case, you don’t need to create the placeholder page. Instead, you can add category links to your menu so that visitors browse all the posts that fall into a particular category. This is a great approach, but it may become less practical if you have a lot of categories, because you don’t want to burden your site with a crowded, clumsy menu. One solution—provided you have a self-hosted site—is to customize your home page with the theme-editing tricks described in Chapter 14. For example, page 527 shows a site that uses custom themes to create a hand-tailored home page with links that let you browse different categories. 232 WORDPRESS: THE MISSING MANUAL PAGE TEMPLATES FIGURE 7-18 Here’s the new home page for the Magic Tea House. You can continue on to the site by using the text-based links on this page, or by using the menu above the header image. The Posts link takes you to the posts page, which looks the same as the old Tea House home page. Page Templates In Chapter 6, you learned about the underused post format feature (page 202), which applies different styles to different types of posts. Pages have an analogous feature called page templates, which change the way pages look. Like post formats, page templates are an optional part of a WordPress theme. Your theme may include multiple page templates or none at all. For example, the Twenty Eleven, Twenty Twelve, and Twenty Fourteen themes all include a smattering of page templates, while Twenty Thirteen is unique in offering none. Table 7-1 shows the details. Chapter 7: Adding Pages and Menus 233 PAGE TEMPLATES TABLE 7-1 Page templates in the year themes THEME ADDITIONAL PAGE TEMPLATES Twenty Eleven Sidebar Template Showcase Template Twenty Twelve Full-width Page Template, No Sidebar Front Page Template Twenty Thirteen (None) Twenty Fourteen Contributor Page Full Width Page When you create a new page, WordPress assumes that you want to use the standard template. But switching to something else is easy. When you create or edit a page, choose the template you want from the Template list in the Page Attributes box. The page template feature faces the same challenge as the post format feature: Because a theme is designed to suit a variety of sites, and because there’s no way for a theme to understand the fine details of your site, it can’t provide templates tailored to your content. The WordPress year themes use page templates for two basic purposes: to control the appearance of your site’s sidebar, and to create improved home pages. The following sections explain how to do both. NOTE There’s one page template you won’t consider in this chapter: the Contributor Page template included with the Twenty Fourteen theme. It’s an unusual but innovative page that automatically gathers and displays author information in a site that has multiple contributors. You’ll try it out when you consider WordPress collaboration on page 391. Pages With or Without Sidebars With some themes, your site’s sidebar appears on every page, just as it appears next to every post. With other themes, WordPress displays pages without the sidebar. No approach suits everyone, and page templates let you change your theme’s built-in preference. For example, if you use the Twenty Twelve theme, ordinary pages always get a sidebar. But if you assign a page Twenty Twelve’s “Full-width Page Template, No Sidebar” template, that page will appear sidebar-free, with extra space for your content. Similarly, the pages in Twenty Eleven start out with no sidebar, but switching to the Sidebar template changes that. NOTE If you start adding sidebars to your pages, be consistent. For example, if you decide not to show sidebars on, say, pages with pictures or photo galleries, make sure the other pages on your site follow suit. Otherwise, your visitors may feel that your site is unpredictable or poorly organized. 234 WORDPRESS: THE MISSING MANUAL Better Home Pages Another reason that themes use page templates is to create souped-up home pages. These specialized pages include a spot for your static content, just like any other page, along with some extras. The extras can include more widget areas, featured image sliders, and a customized post list. The goal is to give you a way to create a more attractive entryway to your site. PAGE TEMPLATES The Twenty Twelve theme includes a Front Page template that serves this purpose. It lets you add one or two columns of widgets below the page content. These widgets appear on the front page only (Figure 7-19). Your site’s standard sidebar widgets, which appear on the other posts and pages in your site, don’t appear on pages that use the Front Page template. FIGURE 7-19 This version of the Magic Tea House home page uses the Front Page template on the Twenty Twelve theme, which gives the page a twocolumn footer of sidebar widgets. Chapter 7: Adding Pages and Menus 235 PAGE TEMPLATES You choose your front-page widgets using the familiar Appearance→Widgets section of the dashboard. Just drag the widgets to the theme’s First Front Page widget area and the Second Front Page widget area. The Twenty Eleven theme takes the concept a bit further with its Showcase template (Figure 7-20). It combines page content (which appears at the top), a group of featured posts (underneath), and a list of recent posts (at the bottom). FIGURE 7-20 The showcase page in the Twenty Eleven theme fuses together your page content, a gallery of featured posts, a list of recent posts, and a showcase sidebar. There’s no magic to creating a showcase page. You create a page, add the content you want, and then choose Showcase Template from the Template list. Finally, you publish your page. When someone requests a page that uses the showcase template, WordPress goes to work. 236 WORDPRESS: THE MISSING MANUAL Here’s how WordPress assembles a showcase page for the Twenty Eleven theme: • First, it takes your sticky posts (page 104), and adds them to the Featured Post gallery. To include a picture alongside a featured post, make sure you set a featured image (page 190). PAGE TEMPLATES • Underneath the Featured Post gallery, WordPress shows the content for the most recent non-sticky post. If you want WordPress to show only a portion of the most recent post, you need to use the More quicktag (page 196). • Underneath that, WordPress lists the titles of the next four most recent posts (not including sticky posts). To view one, your guest must click its title. • WordPress adds a sidebar to the left side of the page, next to the list of your most recent posts. However, this isn’t the standard sidebar you see on your normal home page (and all the pages that use the sidebar template). Instead, it’s called the showcase sidebar, and it appears on showcase pages only. To fill it with widgets, choose AppearanceÆWidgets, and then drag the widgets you want to the Showcase Sidebar area. It might occur to you that you like the showcase page, but you want to take the idea further. For example, maybe you want to control what posts appear in the list of recent posts, or you want to create several showcase pages that highlight different categories of posts, like the sections of a newspaper. Unfortunately, showcase pages don’t give you this flexibility. However, you can begin building a system like this if you’re running a self-hosted WordPress site and you’re not afraid to get your hands dirty. You’ll start exploring that option in Chapter 14. Chapter 7: Adding Pages and Menus 237 CHAPTER Comments: Letting Your Readers Talk Back 8 I n the chapters you’ve read up to this point, you learned to create the two most essential ingredients of any WordPress site, posts and pages. They’re the vehicles for your content—the way you’ll reach friends, potential customers, or hordes of devoted readers. Still left to explore is the WordPress commenting system, which is a keenly important part of almost every WordPress site, whether it’s a chatty blog or a buttoned-up business website. Used properly, comments can change your site from a one-way lecture to a back-and-forth conversation with your readers or customers. Commenting isn’t just a fun way to make friends—it’s also a serious tool for promoting your work, getting more traffic, turning casual browsers into repeat visitors, and even making money. In this chapter, you’ll learn how to manage comments on your site. You can banish offensive ones, insert yourself into the discussion, and even tweak the way WordPress displays comments by formatting them to make them more readable and adding author pictures. Once you understand the basics of comment management, you’ll be ready to confront one of the single biggest hassles that every WordPress site faces: comment spam—the messages that dubious marketers and scammers slap across every site they can find. You’ll learn strategies for preventing spam without aggravating your readers, and you’ll take a side trip to explore the spam-crushing Akismet plug-in. NOTE This chapter points out a few optional plug-ins that self-hosting WordPressers can use to fill in the gaps in WordPress’s commenting features. However, you’ll probably want to wait until you read Chapter 9, which explains how to manage plug-ins, before you try any of them out on your site. 239 ALLOWING OR FORBIDDING COMMENTS UP TO SPEED Why Your WordPress Site Needs a Community Once upon a time, people thought comments belonged only in personal blogs and discussion forums. Serious-minded web publishers ignored them. Small business avoided them—after all, if people really needed to get help or make their opinions known—well, that’s what email was for, right? Today, the website landscape has changed dramatically. Web commenting is an essential ingredient for sites small and large, fun and serious, casual and moneymaking. Here’s what a comments section can do for you: • Attract new visitors. New visitors immediately notice whether a website has a thriving conversation going on or just a single lonely comment. They use that to evaluate how popular a website is. It’s crowd mentality, working for you—if new visitors see that other people find a topic interesting, they’re more likely to dive in to check out your content for themselves. • Build buzz. If you’ve taken to the Web to promote something—whether it’s a new restaurant, a book, a community service, or whatever—you can only do so much to persuade people. But if you get your fans talking to other people, the effect is exponential. Comments help you spread the word, getting your readers to talk up your products or services. And once they’re talking on your blog, it’s just a short hop away for other bloggers to post about you on their blogs. • Build loyalty. A good discussion helps make a site sticky— in other words, it encourages people to return. Put another way, people may come to your site for the content, but they stay for the comments. • Encourage readers to help other readers. Often, readers will want to respond to your content with their own comments or questions. If you ask them to do that by email and your site is popular, you readers will easily overwhelm you. But with comments, your audience can discuss among themselves, with you tossing in the occasional follow-up comment for all to see. The end result is that your site still has that personal touch, even when it’s big and massively popular. Allowing or Forbidding Comments If you haven’t changed WordPress’s factory settings, all your posts and pages already support comments. You’ve probably already noticed that when you view an individual post or page, there’s a large “Leave a Reply” section just below your content. But it doesn’t always make sense to allow comments on everything you publish. Many static pages don’t lend themselves to discussion. You probably won’t get a great conversation going on an About Us or Our Location page, for example, so it makes sense to disable comments for these pages and let people have their say somewhere else. Posts usually allow comments, but you might want to disable them if you write on a contentious subject that’s likely to attract an avalanche of inflammatory, insulting, aggressive, or racially charged feedback. News sites sometimes disable comments to avoid legal liability (for libelous comments someone posts, for example, or for trade secrets someone reveals). Allowing comments on posts or pages isn’t an all-or-nothing decision—you can pick and choose what content allows comments. 240 WORDPRESS: THE MISSING MANUAL NOTE Comments apply equally to posts and pages. For convenience, most of the discussion in this chapter refers to posts, but everything you’ll learn applies equally to pages. ALLOWING OR FORBIDDING COMMENTS Changing Comment Settings for a Post You can turn off comments for an individual post or page by changing the comment settings when you create or edit that post or page. However, WordPress usually hides the settings. To see them, you need to click the Screen Options button in the top-right corner of the Add New Post or Edit Post page, and then turn on the checkmark next to Discussion. This adds a Discussion box to your post-in-progress, which offers just two settings (Figure 8-1). FIGURE 8-1 You can opt out of comments for a single post or page by turning off the “Allow comments” checkbox. You can also disable trackbacks and pingbacks, which you’ll consider on page 260. If you have a pile of posts that allow comments and you want to remove the comment feature from all of them, WordPress makes it easy by letting you edit posts in bulk. Here’s how to do that: 1. Choose PostsÆAll Posts. WordPress lists all your posts. 2. Turn on the checkbox next to each post you want to change. Chapter 8: Comments: Letting Your Readers Talk Back 241 THE LIFE CYCLE OF A COMMENT 3. Choose Edit from the Bulk Actions drop-down list, and then click Apply. The edit panel appears at the top of the post list, with a number of settings you can change (see page 129). 4. In the Comments drop-down list, pick “Do not allow,” and then click Update. You can use the same trick to turn commenting back on and to change the comment settings on your pages. Changing the Default Comment Settings Site-Wide To create a site that’s mostly or entirely comment-free, you probably don’t want to fiddle with the Discussion settings for every post. Instead, you should create a universal setting that applies to all new posts and pages. Choose Settings→Discussion on the dashboard, and then turn off the checkmarks next to “Allow link notifications from other blogs (pingbacks and trackbacks)” and “Allow people to post comments on new articles.” Then scroll down to the bottom of the page and click Save Changes. Now all new posts and pages will be comment-free. You can add the comment feature back to specific posts or pages by turning on “Allow comments” in the Discussion box, as shown back in Figure 8-1. There are many more options in the Settings→Discussion page that change the way comments work. You’ll learn to use them in the rest of this chapter. The Life Cycle of a Comment The easiest way to understand how WordPress comments work is to follow one from its creation to the moment it appears on your site and starts a conversation. Depending on how you configure your site, comments travel one of two routes: • The slow lane. In this scenario, anyone can leave a comment, but you need to approve it before it appears on the post. You can grant an exemption for repeat commenters, but most people will find that the conversation slows down significantly, no matter how quickly you review new comments. • The fast lane. Here, each comment appears on your site as soon as someone leaves it. However, unless you want your website drowned in thousands of spam messages, you need to use some sort of spam-fighting tool with this option—usually, it’s an automated program that detects and quarantines suspicious-looking messages. For most sites, the second choice is the best approach, because it allows discussions to unfold quickly, spontaneously, and with the least possible extra work on your part. But this solution introduces more risk, because even the best spam-catcher will miss some junk, or allow messages that aren’t spam but are just plain offensive. For that reason, WordPress starts your site out on the safer slow lane instead. 242 WORDPRESS: THE MISSING MANUAL In this chapter, you’ll consider both routes. First, you’ll learn the slow-lane approach. Then, when you’re ready to step up your game with more powerful spam-fighting tools, you’ll consider the fast-lane approach. THE LIFE CYCLE OF A COMMENT Leaving a Comment Leaving a comment is easy, which is the point—the more convenient it is to join the conversation, the more likely your visitors are to weigh in. Assuming you haven’t tweaked any of WordPress’s comment settings, visitors need to supply two pieces of information before they can make their thoughts known: their name and their email address. They can optionally include a website address, too (Figure 8-2). NOTE If you’re logged into your website as the administrator, you won’t see the commenting layout shown in Figure 8-2. Instead, you’ll see just the box for comment text, because WordPress already knows who you are. This won’t help you understand what life is like for ordinary readers, however, so before you go any further, log out (click “Log out” above the comment box) or go to the page from another computer or browser. Then your site will treat you like a stranger, and you’ll see the same commenting boxes your visitors see. Here’s what WordPress does with the information it gets from commenters: • Name. It displays the commenter’s name prominently above her comment, thereby identifying her to other readers. • Email address. WordPress doesn’t display this publicly, so commenters don’t need to worry about spam. In fact, WordPress won’t stop visitors from inventing imaginary email addresses (although it will prevent them from typing in gibberish that obviously doesn’t make sense). WordPress won’t even send would-be commenters one of those pesky “Confirm this is your address” email messages. However, email addresses are important if you want to display a tiny picture of each commenter next to each comment (see page 263 for details). • Comment text. This is the meat of the comment (Figure 8-2). • Website. If your commenter includes this detail, WordPress turns the commenter’s name, which appears above posts, into a link. Other readers can click it to travel to the commenter’s site. To see how comments work, try typing in one of your own. First, make sure you aren’t logged in as the administrator (if you are, you’ll bypass the moderation process described below, because WordPress figures you’ll always allow your own comments). Assuming you’re logged out and you see the text boxes shown in Figure 8-2, type in a comment and then click Post Comment. Chapter 8: Comments: Letting Your Readers Talk Back 243 THE LIFE CYCLE OF A COMMENT FIGURE 8-2 Ordinarily, a commenter needs to include his name and email address (although WordPress doesn’t verify either). Optionally, commenters can include a website address or leave this box blank. 244 WORDPRESS: THE MISSING MANUAL Now, WordPress plays a slight trick on you. When you submit a comment, WordPress immediately adds it below your post (Figure 8-3), making it look as though your comment has been published. But in reality, when you use the slow-lane commenting route, no one can see the comment until the site owner (that’s you) reviews it and formally approves it. This process is called moderation. THE LIFE CYCLE OF A COMMENT FIGURE 8-3 Here’s what your upcoming comment will look like when it’s published. Right now, no one can see it but you. Chapter 8: Comments: Letting Your Readers Talk Back 245 THE LIFE CYCLE OF A COMMENT GEM IN THE ROUGH Comments That Use HTML Most people who comment on a post or page will type in one or more paragraphs of ordinary text. However, craftier commenters may include a few HTML tags to format their comments. For example, you can use the and elements to bold and italicize text. Type this: I’m really annoyed. and your comment will look like this: I’m really annoyed. You can also add headlines, line breaks, bulleted and numbered lists, and even tables. You could use the
element to create a link, but that’s not necessary—if you type in text that starts with www. or http://, WordPress automatically converts it to a clickable link. Now that you know you can use HTML in a comment, the next question is, should you? Most site owners don’t mind the odd bit of bold or italic formatting, but they may trash messages that include shamelessly self-promotional links or ones that attempt to steal focus from the conversation with wild formatting—it’s like an attention-starved kid throwing a grocery-store tantrum. You can edit comments that use HTML inappropriately, but that takes time and effort. As a safeguard, some site owners don’t allow HTML elements at all. If you run a self-hosted site, you can ban HTML by creating a custom theme, an advanced task detailed in Chapter 13. Once you do, you need to edit its functions.php file (page 500) and add these instructions anywhere after the first line (which holds the element that points to your picture inside the Text widget (page 188). WordPress.com users have an easier (albeit less flexible) tool: the Image widget. And now that you signed up with Jetpack, you’ve got the same advantage. Here’s how to put the Image widget to use: 1. Choose AppearanceÆWidgets. This takes you to the familiar Widgets page in the dashboard. There you see a few new widgets that have Jetpack in the name, including one called “Image (Jetpack).” 2. Drag the Image widget to one of the widget areas on the right. When you drop the widget into place, it expands to show a number of text boxes where you can fill in important details (Figure 9-10). 3. Fill in the information for your widget. Obviously, the most important detail is the image URL—the location of the image you want to show. Usually, this is a file you uploaded to your site’s media library. If you don’t remember the address, you need to browse the Media→Library section of the dashboard, as explained on page 186. Along with the image URL, you can choose a title for the widget, give the picture a caption and alternate text, and turn it into a link that takes viewers to a web address you specify. You can also set a display size. If you don’t, WordPress displays the image as close as possible to its full, natural size, without exceeding the space available in the sidebar (or whatever widget area you placed it in). 4. Click Save. Now the widget appears on your site, showing the image you picked. 300 WORDPRESS: THE MISSING MANUAL THE JETPACK PLUG-IN FIGURE 9-10 You can add the Jetpack Image widget to your site’s sidebar, just as you can add WordPress’s standard widgets. Adding a Contact Form The Image widget is far from an essential tool, but it is a real convenience, as are many of Jetpack’s features. However, Jetpack also includes some features that would be significantly more work to duplicate on your own. One is its contact form, which lets you solicit readers for any sort of information you want (Figure 9-11). Chapter 9: Getting New Features with Plug-Ins 301 THE JETPACK PLUG-IN Often, you use contact forms to collect names, email addresses, postal addresses, or support questions. However, Jetpack is clever enough to let you build your own form, which you can edit to collect whatever information you want. To get started, you create a new post, and then click Add Contact Form (Figure 9-12) above the content box, to the right of the Add Media button. FIGURE 9-11 The idea behind a contact form is to solicit information from your guests. A reader fills in these blank text boxes (left), and then submits the form (right). WordPress collects the information, and passes it along to you in an email. FIGURE 9-12 If you wonder why you haven’t noticed the Add Contact Form button before, it’s because you didn’t have it until you installed Jetpack. Clicking the button adds a contact form to any post. Once you click Add Contact Form, the “Add a custom form” window opens (Figure 9-13) so you can design your survey. The window asks you to add “fields,” which is just a geeky way of saying that you need to specify the way a visitor can enter information, such as through a text box or drop-down list (see the box on page 304 for a detailed explanation). Here’s what you can do in the form builder: • Remove a field. Click the minus sign (-) on the right side of the field to delete it. 302 WORDPRESS: THE MISSING MANUAL • Add a new field. Click “Add a new field” and then enter the field information. Every field needs a label (the text above the field) and a “Field type” (the way the field collects information). Use Text for an ordinary single-line text box and Textarea for a big, multiline box, or pick one of the more specialized field types described in the box on page 304. Optionally, turn on the Required checkbox to force readers to complete a field before they can submit the form. When you finish, click “Save this field.” THE JETPACK PLUG-IN • Rearrange your fields. Point to the field you want to move until a “move” link appears in the top-right corner. Click the link and then drag the field up or down. (You can’t put fields side by side.) • Change your email settings. Ordinarily, WordPress sends the data from the form a visitor submits to your administrator email. If you want to use a different email account, click the “Email notifications” tab and fill in the new address. FIGURE 9-13 When you create a new form, Jetpack starts you out with four “fields,” in this case text boxes (Name, Email, Website, and Comment). You can remove the fields you don’t want and add new ones. Here, you added a field for a postal address. Chapter 9: Getting New Features with Plug-Ins 303 THE JETPACK PLUG-IN UP TO SPEED Contact Form Field Types WordPress’s contact form lets you choose from a small set of field types—the means by which you collect information. Here are your choices: • Text. This is your standard-issue single-line text box. • Textarea. This is a bigger text box that can hold whole paragraphs of information. Once you add a textarea box, you can drag the bottom-right corner to make it as big as you want. • Checkbox. This is a way to let guests turn options on or off. • Drop down. This is a list of values (which you specify) that you stuff into a drop-down list. The person filling out the form picks a single value from the list. • Radio. This is a list of values like the “Drop down” box, but the form-filler sees all his choices at once (they’re listed on the page). He clicks a small circle next to the option he wants. Usually, you use this field to list just a few choices, and use “Drop down” for a long list of options. • Email, Name, and Website. These field types look like ordinary text boxes, but WordPress is smart enough to automatically fill in the current guest’s email address and name if it knows those details (for example, if the person recently left a comment on your site). WordPress also performs some basic error checking to catch bad email addresses. When you finish perfecting your form, click “Add this form to my post” at the bottom of the window. Jetpack inserts a series of strange-looking codes into your post, wrapped in square brackets (Figure 9-14). TIP You can edit a post’s form by clicking Add Contact Form while you edit the post, which loads the form builder with the form, just as you left it. When someone submits a contact form, WordPress sends you an email. That person can fill out the form more than once (in which case WordPress sends you multiple messages). If you’re tired of juggling the notification emails, WordPress lets you review all the responses in a single place, the dashboard. Click Feedback in the dashboard menu to see a list of form submissions, arranged just like the dashboard’s comment list. 304 WORDPRESS: THE MISSING MANUAL THE JETPACK PLUG-IN FIGURE 9-14 To create a contact form, Jetpack uses shortcodes, a WordPress feature you’ll learn about on page 323. However, you don’t need to pay them any attention—as long as you leave them alone, your form will appear in the published post just the way you want it. (Adding content above or below the form code, however, is perfectly acceptable.) Adding a Mathematical Equation The creators of WordPress also included some more specialized, quirkier plug-ins. One intriguing example is the mathematic equation feature demonstrated in Figure 9-15, which is the last Jetpack feature you’ll look at in this chapter. FIGURE 9-15 This page mixes ordinary content with a properly formatted mathematical equation. Chapter 9: Getting New Features with Plug-Ins 305 THE JETPACK PLUG-IN To create an equation with Jetpack, you use the LaTeX typesetting language, a standard in the technical publishing industry. For example, you write the equation in Figure 9-15 like this in LaTeX: f(n) = n^5 + 4n^2 + 2 |_{n=17} LaTeX isn’t a kind of HTML markup, and browsers don’t know anything about it. To turn a LaTeX expression into a formatted equation for your web page, you need a translation program. A variety of JavaScript libraries can do the job, with varying degrees of success, but if you use Jetpack, you don’t need to worry about another plug-in. Instead, you slip your LaTeX expression between two special codes: [latex] and [/latex]. For example, to create the post shown in Figure 9-15, you type the equation right into the post editor, as shown here: To calculate the amount of steeping time, you need to know the weight of your tea leaves, the surface area where the water meets the tea leaf, the volume of water, the geometry of the tea pot, and the ambient temperature. For a rough approximation, use this formula: [latex]f(n) = n^5 + 4n^2 + 2 |_{n=17}[/latex] When WordPress processes this page, the Jetpack plug-in notices the [latex] code, and interprets the content inside as a LaTeX expression. It replaces the expression’s text with a series of stitched-together image files. The result is a properly formatted equation that any mathematician can understand (and any browser can display). NOTE Technically, the [latex] and [/latex] syntax is part of a WordPress shortcode—a way of getting WordPress to insert special content using an instruction in square brackets. WordPress recognizes a few shortcodes automatically, and plug-ins can add their own. You’ll learn more about shortcodes in Chapter 10. Of course, you can’t take advantage of Jetpack’s LaTeX wizardry unless you know a bit about the LaTeX standard (or you have a prewritten equation in LaTeX format). To learn more, start with the general tutorial at http://tinyurl.com/latexmath. If you find writing your own LaTeX expressions daunting, you can get some help from the LaTeX equation generator at http://tinyurl.com/latexequation. It lets you build a LaTeX expression by clicking your way through a mess of buttons. Finally, you can review WordPress’s documentation for the LaTeX feature at http://support.wordpress.com/latex, which covers a few extra, WordPress-specific details (for example, it explains how to change the size of the generated equation, and how to adjust its background color if you want it to stand out on your page). The next time you’ll use Jetpack is in Chapter 10, to give your site a photo carousel or slideshow. But now it’s time to review some other useful plug-ins. 306 WORDPRESS: THE MISSING MANUAL ADDING MOBILE SUPPORT Adding Mobile Support In Chapter 5, you considered a thorny question—what does your carefully crafted WordPress site look like if someone views it on a mobile device, like a smartphone or tablet? For self-hosted sites, the answer all depends on the theme you choose. If you use a mobile-aware theme (sometimes called a responsive theme), your site automatically adjusts its design when it detects a mobile device, substituting a simpler, streamlined layout that fits on the smaller display. The standard year themes, from Twenty Eleven on, are all mobile-aware. If your theme doesn’t have these built-in smarts, you get a result that’s much less ideal. When people visit your site with a mobile device, they see the normal, full-size layout, which means they need to zoom and scroll around it awkwardly. The effect is a minor inconvenience on a midsized device like an iPad, but a serious aggravation on a small device like an iPhone. Readers may find that reading your site isn’t worth the finger cramps. The solution is a plug-in that adds mobile support without disrupting your chosen theme. Several popular plug-ins handle the task, and they all work the same way, by swapping in a different theme when they detect a mobile device. The best plug-ins are smart enough to tailor the substitute theme for specific devices, so iPad owners see something a bit different from iPhone owners, for example. TIP Even if you do use a mobile-aware theme, you might still decide to use a mobile plug-in if the mobile representation of your site isn’t what you want. Maybe the mobile face of your site is too plain, performs sluggishly, or wastes too much space with a long post list. Perhaps the menus and widgets you chose for the desktop version don’t make sense in the cramped window of a smartphone, no matter how they’re arranged. Good mobile plug-ins give you a range of ways to tailor the appearance of your site on mobile devices. For example, you can change the menus, substitute a different home page, and even swap in smaller image files. WPtouch, a wildly popular WordPress plug-in with millions of downloads to its name, lets you create a distinct mobile face for your site. You can find it at http:// tinyurl.com/wptouch. UP TO SPEED Using the Plug-In Links in This Book In this chapter (and throughout this book), you’ll frequently come across links to useful WordPress plug-ins. These links take you to WordPress’s plug-in directory, at http://wordpress. org/plugins . There, you get extensive information about the plug-in, including how it works, the number of times it’s been downloaded, its star rating, and its compatibility information (just as you can in the plug-in details window shown in Figure 9-4). You can download a plug-in from the directory, presumably so you can upload it to your site later, from the Plugins→Add New page. But you don’t need to go through this two-step download-and-then-upload process. To install a plug-in discussed in this book, log in to your site’s dashboard, search for the plug-in by name, and then click the Install button to transfer it in one step. Chapter 9: Getting New Features with Plug-Ins 307 ADDING MOBILE SUPPORT The WPtouch Mobile Theme WPtouch recognizes a range of smartphones and touch devices, including Apple products (that’s the iPhone, iPad, and iPod Touch), devices running the Google Android operating system, BlackBerry devices, and even old-school Palm gadgets. When one of these devices hits up your site, WPtouch steps in and displays your content using its slick mobile theme. It doesn’t matter whether your original site theme is mobile-aware or not. WPtouch bypasses it completely. Once you install and activate WPtouch, you’re ready to try it out. Figure 9-16 shows what happens when a guest visits a WPtouch-enabled site with an iPhone. FIGURE 9-16 Left: Although Twenty Twelve is a responsive theme, it’s not a perfect match for mobile devices. For one thing, the post list on the home page includes the whole text of every post, which makes for a lot of scrolling. Right: WPtouch’s mobile theme keeps the list of posts simple, highlighting the title, date, and number of comments, but leaving the content out. The WPtouch mobile theme (Figure 9-17) departs from the average WordPress theme in several important ways: • WPtouch ignores widgets when it creates a mobile version of your site. This is quite different from the mobile version of the year themes, like Twenty Twelve. They retain all your widgets but place them before or after the main content. This ensures that the mobile view doesn’t sacrifice anything important from the desktop site, but it also creates a long and somewhat unwieldy page. 308 WORDPRESS: THE MISSING MANUAL • WPtouch doesn’t display any content in post listings. Instead, it simply shows the title, date, and number of comments for each post. Mobile surfers need to tap a title to read the post. Once again, this differs from the year themes like Twenty Twelve, which list all the content and force mobile readers to scroll the day away. (Incidentally, you can tweak the way WPtouch shows posts using post excerpts, as described on page 198.) ADDING MOBILE SUPPORT • WPtouch doesn’t load all your posts at once. Instead, the page ends with a Load More Entries link. Click it, and the page fetches a new batch of posts and adds them to the bottom of the page. The page uses clever JavaScript code to stuff in just the new content without refreshing the whole page (Figure 9-17, right). FIGURE 9-17 Left: If you use featured images, WPtouch shows them off in a slider at the top of the home page (to switch the slider off, see page 311). It also displays the images in a circle next to each post. Right: Scroll to the bottom of the screen and you see a link to load more posts, along with a button named Desktop that lets you turn the WPtouch mobile theme off. Click the button, and WPtouch refreshes the page, handing control back to your site’s original theme. Configuring WPtouch The WPtouch mobile theme overrides your standard theme completely. That means that even if your current theme has its own mobile-specific version, WPtouch replaces it. (If you do want to use the mobile version of your theme, deactivate the WPtouch plug-in on the Plugins page.) Chapter 9: Getting New Features with Plug-Ins 309 ADDING MOBILE SUPPORT That said, WPtouch does give you some leeway to customize the way it looks. To review your options, browse through the many pages in the WPtouch menu. For example, the WPtouch→Core Settings page includes these gems: • Site Title. Remember, WPtouch displays the title of your site but no header picture. If you want to change the site title that appears in the mobile theme without changing the site title for everyone else, you do that here. This is handy if you need to shorten a long title so it fits comfortably on smaller screens. • Landing Page. Ordinarily, WPtouch respects your WordPress settings, meaning that visitors start at the list of posts on your home page or on a static page, depending on your “Front page displays” setting (page 230). But you might decide that mobile viewers should start somewhere other than that. Maybe you want them to bypass the ordinary home page because it’s too long and bloated with graphics. Or you want them to start with a page that provides links to specific posts (Figure 9-18). • Preview Theme. Click this button to open a tiny browser window with a preview of your site. Here’s the clever part: The preview window shows the mobile version of your site, which saves you the trouble of breaking out your iPhone to check out every change you make. FIGURE 9-18 Top: Right now, the WPtouch home page uses WordPress’s “Front page displays” setting to decide what to put on the main page of your mobile site. Bottom: If that’s not what you want, choose “Select from WordPress pages” and pick a different front page for the mobile version of your site. WPtouch has many more options in the WPtouch→Theme Settings page. Here are a just a few of the most noteworthy: • Number of posts in post listings. This determines how many posts appear on the home page before the Load More Entries link. It also sets the number of 310 WORDPRESS: THE MISSING MANUAL listings in the category-browsing and tag-browsing pages (page 123), if you use them. BACKING UP A WORDPRESS SITE • Excluded categories and excluded tags. Perhaps there are some posts on your site that aren’t appropriate for mobile viewing or aren’t likely to interest mobile users. As long as these posts belong to a specific category or have a specific tag, you can tuck them out of sight. Excluded posts won’t appear in the mobile site’s home page, in search results, or in category-browsing or tag-browsing pages. To exclude a category or tag, you need to enter its ID, which you can find in the PostsÆCategories or PostsÆTags section of the dashboard. (To exclude several categories or tags, write the whole list in the text box, separating each ID with a comma.) • Show post categories and tags and Show post author. As you saw in Figure 9-16, WPtouch shows just a few essential details in its post list: title, date, and number of comments. Tick these checkboxes, and WPtouch adds the category, tag, and author information as well. • Enabled featured slider. Turn this option off to hide the featured image slider. Or tweak the settings underneath to control what pictures the slider shows and change whether the slider “slides” (cycles through its pictures) automatically. You can play with plenty of other WPtouch settings. Dig around a bit, and you can change WPtouch’s color scheme or WPtouch’s mobile theme. Or visit the WPtouch→Menus page to modify the mobile version of your menus and give each menu item an eye-catching icon, which you choose from a gallery of ready-made pictures. Clearly, WPtouch offers far more flexibility than you get with the average mobilefriendly theme. By comparison, the WordPress year themes don’t let you change any aspect of their mobile appearance. Some WordPress developers are even more ambitious. They like the basic WPtouch theme but feel it’s a bit generic. They want to add touches of style and distinguish their site from competitors’. If you fall into that camp, the free version of WPtouch won’t completely satisfy you. However, the creators of WPtouch sell an enhanced version named WPtouch Pro. It offers more ready-made themes, more extensive theme customization, and with a pile of extra features (see http://tinyurl.com/ wptouchpro). Currently, WPtouch Pro costs $49 for a single website, $99 for five. Although you certainly don’t need the Pro version, it’s money well spent if you expect that a large portion of your audience will visit your site using a mobile device. Backing Up a WordPress Site It’s easy to be casual about the safety of the files on your website. After all, even small web hosting companies take reliability seriously. They use systems that have a high level of redundancy—web servers with multiple hard drives, for example, and groups of computers that work together so that a hardware failure in one won’t sideline Chapter 9: Getting New Features with Plug-Ins 311 BACKING UP A WORDPRESS SITE an entire website. Many web hosts also perform some sort of backup, copying the files they host to a storage location so they can recover them after catastrophes, like floods and fires. But these measures, no matter how well-intentioned, aren’t enough to protect your WordPress site. Unless you do your own backups, your site is exposed to serious risks that your web hosting company can’t prevent. For example, an attacker could break into your administrator account and sneak some advertising or malware into your site. In some cases, these attacks are stealthy enough that you won’t notice any effect for weeks. By that point, the only backup your web host still has may be a copy of the infected site, making it useless and forcing you to rebuild from scratch. Other problems can occur, too. The Web has plenty of backup horror stories, including cases where a host’s backups go mysteriously missing, or an unexpected event puts a web host out of business, taking its websites with it. To give your site a better chance of weathering crises like these, you need an independent backup solution. You have two choices: • You can use an automated backup service that visits your site every day and transfers its content to another set of servers elsewhere in the world. • You can do the work yourself, periodically downloading your content to your own personal computer for safekeeping. In the following sections, you’ll consider both approaches. Using an Automated Backup Service This approach is the most convenient. Once you sign up with the right company, the process happens automatically, without another thought from you. The premiere example for WordPress is VaultPress (http://vaultpress.com), a backup service run by Automattic that stores every post, page, comment, and setting change from the moment you sign up. VaultPress gives you the ability to roll back to any point in the past if disaster strikes. Automated backup services have a significant drawback—they aren’t free, and what you pay for backups can easily outweigh your hosting fee. The basic VaultPress package costs $15 per month, and its no-frills competitor blogValue, which stores just 30 days’ worth of backups, charges $10 per month. If you have the money to sign up with an automated service, and you’re willing to pay to save a little time and a few headaches, check out VaultPress. It comes as part of Jetpack, although it’s not activated. To use it, you need to sign up at http:// vaultpress.com/jetpack. If you’re willing to take a slightly more hands-on approach, consider BackupBuddy (http://ithemes.com/purchase/backupbuddy). You can get a license for up to two sites for $80 per year, or a license for up to 10 business sites for $100 per year. However, BackupBuddy isn’t in the storage business, it’s just the tool that schedules and performs your backups. To use it, you need an account with a web storage service, so BackupBuddy has somewhere to store the backups it creates. BackupBuddy 312 WORDPRESS: THE MISSING MANUAL supports several such services, including Dropbox (www.dropbox.com), which is free for the first 2 GB of storage; Google Drive (http://drive.google.com), which is free for the first 15 GB; and Amazon S3 (http://aws.amazon.com/s3), which costs pennies per gigabyte. So if you have a modest-sized site (one that doesn’t include a library of 5,000 pictures or massive video files) and you don’t mind juggling a storage account, BackupBuddy is a reasonable compromise. BACKING UP A WORDPRESS SITE Backing Up with a Plug-In If VaultPress is too pricey and you don’t want to fiddle with BackupBuddy, you need to take charge of backups on your own. Fortunately, plenty of free plug-ins can help you out. But before you get started with any of them, you need to understand one key fact. Every WordPress site needs two types of backup: • A backup of your database. As you learned in Chapter 1, WordPress stores every post, page, comment, and stitch of content in a database on your web server. This is the most important part of your site, because without content all you have is an empty shell. • A backup of your files. These files include the contents of your media library, including every picture and resource you uploaded to your WordPress site, the theme files that tell WordPress how to lay out your content, and any plug-ins you installed. NOTE You back up theme files for two reasons. First, as you become a more advanced WordPress designer, you may begin customizing the themes (as explained in Part 4). Second, it’s always possible that the particular version of a theme you’re using will disappear from the Web, making it difficult to restore an old copy of a backed-up site. If you’re handy with an FTP program, you can back up your files anytime. All you do is browse to your web hosting account and copy the contents of your WordPress folder to your computer. If you use Windows, this is as simple as firing up Windows Explorer, pointing it to your web host’s FTP site, logging in, and dragging the folder you want (the one with your WordPress site in it) onto your desktop. However, even if you copy every file you see, you still won’t get the contents of your WordPress database, which is the heart of your WordPress site. To get that, you need a tool that can access the database, extract its contents, and put it in a file. (This tool also needs to be able to do the reverse, copying the data from a backup file into a new database, in case you need to re-create your site.) Unless you’re a MySQL guru, your best bet is to use a WordPress plug-in to help you out. Many WordPress plug-ins concentrate on backing up a site’s database. They leave you to figure out an approach to copy the actual files on your site. Plug-ins that work this way include the popular WP-DB-Backup (http://tinyurl.com/wp-db-backup) and WP-DBManager (http://tinyurl.com/wp-dbmanager). Chapter 9: Getting New Features with Plug-Ins 313 BACKING UP A WORDPRESS SITE However, there are a few plug-ins that back up your site’s database and its files. Two good examples are BackWPup (http://tinyurl.com/backwpup) and Online Backup for WordPress (http://tinyurl.com/wponlineb), the plug-in described in the next section. WARNING There’s no perfect backup tool for everyone. (That’s why this book discusses so many backup plug-ins.) Every plug-in provides a different set of options, and some have strange quirks or don’t work well with certain web hosts. For example, your web host may restrict PHP email to fight spammers. If your backup tool works by sending backed-up data to an email account, it might not be able to finish its work. Backup tools also differ in their ability to deal with unexpected errors, like corrupted data or databases that appear to be locked. For all these reasons, you need to test whatever backup plug-in you pick, and regularly check to make sure it’s backing up your site. The Online Backup for WordPress Plug-In Online Backup for WordPress gives you two ways to back up your site: • Manually. You perform a complete backup via the dashboard, and then download the backed-up data in one big ZIP file. • Scheduled. You schedule a backup to run at certain times (for example, every night at midnight) and then have the backed-up ZIP file emailed to an account you specify. If you choose this route, you may as well create a dedicated Gmail account (at http://mail.google.com) for your back-up emails. With 15 GB of free storage, Gmail lets you stash quite a few backups without paying a penny. The first thing you should do once you install Online Backup for WordPress is try a manual backup. That way, you’ll know if the plug-in works properly, and you’ll have at least one complete backup of your website to start you off. Here’s how: 1. Choose Online Backup from the dashboard menu. This brings you to the control panel for Online Backup for WordPress, where you can start a manual backup, schedule a backup, or change back-up settings. 2. Click the Backup link at the top. Choose what you want to back up (Figure 9-19). 3. Make sure you turn on both the Database and Filesystem checkboxes. That way, you’ll back up the contents of your database and all the files on your website, packaged up in a single ZIP file. 4. Choose Local for the backup type. Your other options are sending backups to the WordPress Vault or to an email address. The WordPress Vault is a service offered by BackupTechnology, the creators of the Online Backup for WordPress plug-in. The catch is that the Vault grants you just 100 MB of space—to get more, you need to pay. 314 WORDPRESS: THE MISSING MANUAL NOTE If you want to use the WordPress Vault, you first need to sign up. You can get the process started by clicking the Online Backup Settings link. BACKING UP A WORDPRESS SITE The email option tells WordPress to send the backed-up data to the email address you supply. This option is more useful when you use scheduled backups, but you might use it with a manual backup if you’re backing up a huge site and you don’t want to stick around, waiting for the process to finish. FIGURE 9-19 A manual backup lets you create an image of your entire website. 5. Click Start Manual Backup. The Online Backup for WordPress plug-in starts gathering your website data and archiving it into a single compressed file, which it puts in a temporary location on your web server. While it works, you see a progress bar ticking away. TIP You don’t need to stay and supervise the backup—if you navigate to a different part of the dashboard, or log out of the dashboard altogether, the backup process continues. However, if you leave, you need to return eventually to download the final result—the file with your backup in it. When you’re ready, choose Online Backup from the dashboard menu and click the Local Backups & Decryption link, which shows you a list of all the backups Online Backup has stored on your web server. When Online Backup for WordPress finishes the backup, it displays a new button, named Download (Figure 9-20). 6. Click Download. Your browser may start downloading the file immediately, or it may first ask you where you want to store the backup and what you want to name it. The download process may take some time, depending on your Internet connection Chapter 9: Getting New Features with Plug-Ins 315 BETTER PERFORMANCE WITH CACHING and the size of your site. Once you have the backup file safe and sound on your computer, your work is done. If you need to reclaim space on your web server, you can delete the backup (once you copy it to a safe place) by clicking Delete. However, unless your site is gargantuan, there’s no reason to worry. The next time you perform a full backup, the Online Backup for WordPress plug-in overwrites your old backup with the new one. FIGURE 9-20 This website has a recent backup, which is stored on the web server in a single file that’s roughly 16 MB. You can download this file or delete it. To see all the backups that Online Backup has created, click the Local Backups & Decryption link at the top of the page. TIP It’s a good idea to peek inside the backup file to make sure it has everything it should. (Remember, it’s just an ordinary ZIP file that you can view on your computer.) Inside, you’ll find two folders. The Database folder includes a file that has the SQL instructions needed to rebuild your database and fill it with your data. The FileSystem folder holds all the folders and files from your website, exactly as if you’d downloaded them from your web host over FTP. Better Performance with Caching As you learned at the very beginning of this book, WordPress websites are powered by code. When a visitor arrives at one of your pages, the WordPress code grabs the necessary information out of your database, assembles it into a page, and sends the final HTML back to your guest’s browser. This process is so fast that ordinary people will be blissfully unaware of all the work that takes place behind the scenes. However, even the fastest web server can’t do all that work (run code, call the database, and build a web page) instantaneously. When someone requests a WordPress page, it takes a few fractions of a second longer to create it than it would to send an ordinary HTML file. Normally, this difference isn’t noticeable. But if a huge crowd 316 WORDPRESS: THE MISSING MANUAL of hits your site at the same time, the WordPress engine will slow down slightly, making your entire website feel just a bit laggy. BETTER PERFORMANCE WITH CACHING POWER USERS’ CLINIC Scheduling Regular Backups You can do a perfectly good job of disaster-proofing your site with manual backups. The problem is that it’s up to you to start every backup, download the final product, and keep your backed-up files somewhere smart. As time passes, you might find yourself forgetting to make backups, leaving your website at risk. The solution is to tell your plug-in to do the backup work for you, at regularly scheduled intervals. For Online Backup for WordPress, you do this by choosing Online Backup from the dashboard menu and then clicking the Schedule link (at the top, just under the “Online Backup for WordPress” title). You can ask it to perform weekly, daily, twice-a-day, four-times-aday, or hourly backups (which is probably excessive, and may earn you the ire of your web hosting company). You can then choose the type of backup—either an incremental backup that grabs the changed files only and stores them in the WordPress Online Vault, or a full backup that sends the results to an email address you supply. When you finish, click Apply Schedule. You can keep an eye on your scheduled backups by clicking the Overview link (at the top). There, you’ll see basic information about when the last backup took place, whether it succeeded, how big the backup file was, and when the next backup will occur. You can get a more detailed summary of recent backup activity by clicking the Activity Log link, which is handy if you need to track down a mysterious error that interrupted one of your scheduled backups. Finally, if you decide to send regular backups by email or store them on the WordPress Online Vault, it’s a good idea to encrypt them to make sure that Internet eavesdroppers can’t peek at your data. To do that, click the General Settings link, pick a type of encryption (the recommended AES128 algorithm is fine), and then type in an encryption key. This is a password used to encrypt your data, without which you can’t decrypt it. Writing this password down on paper is a very good idea, because it’s rather frustrating to have a crashed WordPress website and a full backup that you can’t open. However, there’s a trick called caching that will satisfy even the most performanceobsessed WordPresser. The basic idea is this: The first time someone requests a page on your site, WordPress goes to work, running its code and generating the page dynamically. But once it delivers the page, the plug-in stores the result as an ordinary HTML file on your web server. Now here’s the ingenious part: The next time a visitor asks for the same page, the caching plug-in sends back the previously generated HTML, sidestepping the usual page-generating process and saving valuable microseconds (Figure 9-21). This shortcut works no matter how many people visit your site—as long as the plug-in has an ordinary HTML copy of the finished page, it uses that instead of creating a new copy all over again. Caching plug-ins can use other tactics, too, such as caching just part of the content, compressing the cached data, and discarding cached copies after a certain amount of time. NOTE Caching takes extra space on your website, because it stores extra HTML files. However, these files are rarely big enough to worry about. Caching plug-ins don’t attempt to cache your site’s pictures (or the other resources you uploaded to the media library). Chapter 9: Getting New Features with Plug-Ins 317 BETTER PERFORMANCE WITH CACHING FIGURE 9-21 The idea behind caching is to generate a page once and reuse it for as many people as possible. That’s because sending back an alreadygenerated page is always faster than building a new one (and less work for the web server, too). There are several caching plug-ins in the WordPress directory, but by far the most popular is WP Super Cache (http://tinyurl.com/wpsupercache). To use it, install the plug-in, activate it in the usual way, and then turn on caching. To perform this last step, choose Settings→WP Super Cache, click the Caching On option at the top of the page, and then click the Update Status button (Figure 9-22). 318 WORDPRESS: THE MISSING MANUAL BETTER PERFORMANCE WITH CACHING FIGURE 9-22 WP Super Cache packs in a pile of settings, but the most important is the Caching On option shown here—unless you turn it on, WP Super Cache sits idle. To confirm that WP Super Cache is working, open a new browser window and look at a couple of posts. Then, return to the WP Super Cache settings and click the Contents tab. Finally, click the “Regenerate cache stats” link. WP Super Cache will report how many cached files it created (Figure 9-23). Even though these pages don’t look any different in a browser, WordPress sends them to your visitors more quickly, bypassing most of the processing the WordPress engine ordinarily does. Chapter 9: Getting New Features with Plug-Ins 319 BETTER PERFORMANCE WITH CACHING FIGURE 9-23 This site currently has four cached pages. To see them, click the “List all cached files” link. You can also use the Delete Cache button to discard every cached page, which is important when you test WP Super Cache or if you change the design of your site. WORD TO THE WISE WP Super Cache’s Effect on Other Plug-ins Caching changes the way your website works, and it can have unexpected side effects on other plug-ins. Here are some tips to help you steer clear of plug-in conflicts: • Check the documentation for your plug-ins. WP Super Cache is popular enough that other plug-in creators often test their plug-ins with it. To see if the plug-ins you use need special settings to get along with WP Super Cache, look up the plug-in in WordPress’s plug-in directory ( http://wordpress.org/plugins) and check the FAQ tab. • Visit the Plugins tab in the WP Super Cache Settings. There are a few plug-ins that get special attention from WP Super Cache. If you have one of them, you can tell WP Super Cache to change the way the cache works to avoid disrupting the other plug-in. To do that, go to SettingsÆWP Super Cache, click the Plugins tab, find your plug-in, and then click the Enabled option next to 320 it. (The WPtouch plug-in you used earlier in this chapter is in this list, for instance.) • Delay caching until you’re ready to go live. Switching on caching is the very last thing you should do with your WordPress site, after you polish your theme, tweak your layout, and start using your site for real. • Learn to troubleshoot. If something goes wrong, you need to be ready to track it down. Usually, the most recently activated plug-in is the culprit—try disabling it and seeing if your site returns to normal. If that doesn’t work, you need to deactivate every plug-in, and then activate them one at a time, testing your site after each step. Also, be on the lookout for theme vs. plug-in conflicts, which are less common but occasionally occur. If you change your theme and part of your site stops working, switch off all your plug-ins and then activate them one at a time. WORDPRESS: THE MISSING MANUAL You’ll notice that the cached pages appear in two lists in Figure 9-23, representing two slightly different types of caching. WP Super Cache automatically chooses the type of caching that makes sense for your page. For example, if you visit your site as a logged-in user, the plug-in uses less powerful WP Cache caching instead of WP Super Cache caching. But you don’t need to worry about these technical details, because WP Super Cache makes sure your pages are as fast as possible—which is always faster than they would be without caching. BETTER PERFORMANCE WITH CACHING NOTE WP Super Cache is smart enough to know when it needs to regenerate the cached copy of a page, most of the time. For example, if you update a post or a visitor leaves a new comment, WP Super Cache takes notice and regenerates the page. However, WP Super Cache doesn’t pay attention to site design changes, so it won’t notice if you change the theme or rearrange your widgets. In this situation, you need to manually clear the cache to make sure your visitors see the latest version of your site. To do that, use the Delete Cache button shown in Figure 9-23. Once you verify that your site still works properly, you’re ready to adjust a few WP Super Cache settings. Click the Advanced tab and look for settings that have “(Recommended)” next to them, in italics. This indicates a setting that improves the way WP Super Cache works for most people, but may cause problems in rare situations (and, for that reason, may be initially switched off). One example is the “Compress pages so they’re served more quickly to visitors” setting, which improves performance for most people but causes trouble with some web hosts that don’t support compression properly. You can try turning this setting on, but leave the other, more advanced options alone, unless you really think you know what you’re doing. Chapter 9: Getting New Features with Plug-Ins 321 BETTER PERFORMANCE WITH CACHING PLUG-IN POWER Even More WordPress Plug-Ins In this chapter, you considered several of the most useful Word-Press plug-ins. However, in a directory of thousands, it’s no surprise that there are many more worth considering. You’ll learn about some of these plug-ins in the following chapters (and some you’ll need to discover on your own). Here’s a list of some of the most popular: • Akismet. This spam-fighting tool is the only plug-in that ships preinstalled (but not activated) with WordPress. You learned about it in Chapter 8. • WordPress SEO by Yoast. Search-engine optimization (SEO) is the art of attracting the attention of web search engines like Google, so you can lure new visitors to your site. SEO plug-ins are among the most popular in the WordPress plug-in directory, and WordPress SEO by Yoast is an all-in-one package by one of the most renown developers in the WordPress community. You’ll take a closer look at it on page 441. • WordPress Importer. Moving your WordPress site from one web host to another? The WordPress Importer handles the job with relatively few speed bumps. (In Appendix A, “Migrating from WordPress.com,” you’ll use WordPress Importer to migrate from WordPress.com to a self-hosted site.) Automattic developed WordPress Importer. • TinyMCE Advanced. You learned about this slick editor, 322 suitable for beefing up your post-writing powers, on page 179. • WooCommerce. If you want to sell products on your site, complete with a professional shopping cart and checkout process, this could be the plug-in for you. Although you won’t use it in this book, you’ll try out a simpler shopping cart plug-in on page 545. • BuddyPress. If your website is bringing together a tightly knit community—for example, the students of a school, the employees of a business, or the members of a sports team, you can use BuddyPress to add instant social networking features to your site. Users get profiles, the ability to message one another, add photos, create content, and talk together in groups. To learn more, visit http://buddypress.org. • WP-Optimize. This tool cleans up the junk that’s often left cluttering your database. It can remove unapproved junk comments (page 282), old post revisions (page 387), and other unnecessary data that can expand the size of your database, slowing down your site and bloating your backups. • Limit Login Attempts. This plug-in helps defend your site against hackers who use brute-force password-guessing attacks. You’ll learn more on page 567. WORDPRESS: THE MISSING MANUAL CHAPTER Adding Picture Galleries, Video, and Music 10 B y now, you know that the simplest way to enhance any WordPress post is to toss in a picture or two. The Web is a visual medium, and a bit of eye candy is essential for capturing (and keeping) your readers’ attention. But modern websites rarely stop with ordinary pictures. Today’s Web is splattered with rich media, including video clips, webcasts, podcasts, slideshows, and song players. In traditional websites, these ingredients can require hefty chunks of HTML and JavaScript code. But WordPress makes it easy to add media, thanks to two slick features you’re about to meet: automatic embeds and shortcodes. In this chapter, you’ll use all the tools WordPress provides to add rich media to your site. First, you’ll supercharge your pictures by replacing ordinary images with slideshows and galleries, and you’ll learn how to transform your entire site into a photoblog or portfolio. Next, you’ll see how to embed a video window in a post, and how to host your video files on YouTube or your own web server. Lastly, you’ll get readers jammin’ with audio tracks, playlists, and podcasts. Understanding Embeds and Shortcodes You’ll rely on two WordPress features throughout this chapter. They’re called embeds and shortcodes. Both serve the same purpose: They let you slip special types of content (like slideshows and videos) into your posts and pages without forcing you to type in a bunch of JavaScript code or HTML markup. Instead, when you use embeds and shortcodes, you ask WordPress to fill in the necessary details for you. 323 UNDERSTANDING EMBEDS AND SHORTCODES If you use the free WordPress.com hosting service, embeds and shortcodes aren’t just about convenience—they’re the only way to embed media. That’s because WordPress.com prevents you from adding JavaScript code to your posts or using HTML’s media-embedding