Professional Documents
Culture Documents
Create Your Own Website Using WordPress in A Weekend
Create Your Own Website Using WordPress in A Weekend
your own
Website
{ using
Wordpress }
In a weekend
Website
{ using
Wordpress }
In a weekend
aLaNNaH Moore
o f
Ghettoizatio Ghettoizatio
Ghettoizatio
CREATE YOUR OWN WEBSITE Ghettoizatio
Ghettoizatio
Ghettoizatio
Ghettoizatio
Ghettoizatio
GhettoizatioGhettoizatio
Ghettoizatio
Ghettoizatio Ghettoizatio
USING WORDPRESS IN A WEEKEND Ghettoizatio
Ghettoizatio Ghettoizatio
Ghettoizatio
Ghettoizatio
54 The background
55 Creating pages
56 Choosing your home page
57 Working with the text editor
60 Adding pages to the menu
62 Adding images to your site
67 Adding video and audio to your site
68 Your blog or news area
72 Your widgets
74 The plugins you need
81 Basic site completion checklist
6 9
82 SELLING FROM YOUR WEBSITE 1 28 YOUR LIVE SITE
83 Using Paypal 128 Growing your audience
84 Paypal buttons and shopping cart 132 Maintaining relationships with your visitors
135 Tracking your visitors
7 137 Search engine optimization (SEO)
88 EXPLORING THEMES 142 Integrating social media with your website
89 Free or premium?
90 How to choose a theme 10
92 Where to find themes 1 46 USEFUL THINGS TO KNOW
93 How to install a theme 146 Legal issues
94 Themes: Business 149 Maintaining your WordPress site
96 Themes: Portfolio 150 My site isn’t showing up in Google
98 Themes: Magazine/Blog 151 Working with other users
100 Themes: E-commerce 151 Getting help
152 WordPress in other languages
8 154 Adding functionality with plugins
102 IN FOCUS 155 Going further with WordPress
102 Business theme
109 Portfolio theme 156 Resources and glossary
114 Magazine theme 159 Index
120 E-commerce theme 160 Acknowledgments
Today, every small business and many individuals building. Every reader will be able to complete
need a website. Your website presents you or your their aim of getting their website set up online
business to the world. It is essential that it looks after just a few hours’ work. If you are already
professional and that it presents you as you want computer-savvy, you’ll find the book is full of
to be seen, because it may well be your first and pointers on how to develop your WordPress
only chance to create the right impression. website at a more advanced level.
You do not need to have any specialist knowledge And you may even find you enjoy building your
to follow the steps in this book—it is written for website so much that you’ll want to dig in next
people who are new to the world of website weekend, too.
WordPress is a web-based system that can be used your internet browser (Internet Explorer, Safari,
for free by anyone to build a website—all you need or whatever it is you use), without having to know
to do is install it on your web host, which usually anything about programming or coding. It is ideal
takes just a few clicks, wait for a confirmation for people who are setting up small businesses
email, and away you go. and don’t want to spend a lot of money working
with a web designer in order to get online. And
That’s where the fun begins. WordPress is highly of course, if you set the whole thing up yourself,
customizable, and there are thousands of beautiful you can update the site as often as you want to.
templates (called “themes”) available to choose
from to create the look you want. Many of these There are two versions of WordPress you can
are free, but even the “premium” themes (that use. The simplest method is to set up a website
you have to pay for) are surprisingly inexpensive. that is hosted for you at WordPress.com. This is
an excellent way to get up and running quickly;
WordPress was originally created as a blogging however it does have its limitations (as outlined on
tool, but it has widened its reach vastly over the page 10). The “full” version of WordPress requires
past few years, and is now used to create all kinds you to have your own domain name and your own
of websites. It is the most widely used content hosting, but it offers you many more possibilities.
management system (CMS)—which is simply
a system that allows you, the website owner, to The full version is what we will be concentrating
easily log in, publish, and make changes through on in this book.
a n i n t r o d u C t i o n t o w o r d P r e s s / / / W H AT M A K E S W O R D P R E S S A G O O D C H O I C E ?
a Good ChoiCe?
You don’t have to be dependent on Home Showcase Themes Plugins Mobile About Docs Blog Forums Hosting Download
a webmaster to create or maintain Forums username or email password Log in (forgot?) Register
it’s easy to use for the first time to creating your own themes and plugins. How-To and Troubleshooting 322,711 1,097,689
—Once it’s running
■
Welcome to the WordPress Support Forum
New to WordPress — Where to Start Plugins and Hacks 256,118 768,377
computer-savvy. ■ Frequently Asked Questions about Installing WordPress —Extensions and modifications
Multisite
WordPress can be used to create Search 8,574 55,944
—Problems running network of WordPress sites
Hot Topics
websites of all kinds: business sites, categories category Comments contact form 7 css database
Localhost Installs
—If WordPress is or will be installed on your computer
544 2,873
blogs, portfolios, magazine sites, error header Help image images page pages php plugin Your WordPress 11,413 39,551
it offers themes
There are thousands of beautifully
designed, full-featured, high-quality Help is always at hand for WordPress users.
themes you can choose from, so
you’re bound to find a look that’s
just right for you. It’s also very easy
to change themes further down
the line if you need to.
it has a ready-made
suPPort community
Because so many people use it,
there is a huge support network
to fall back on if you ever need
any help.
You don’t have to worry about any technical You can’t add plugins—extra components
WordPress.org is the version of
matters, such as security and backing up your that add to the scope of your site.
WordPress that you install on your site, as these are all taken care of for you.
own host, also known as “self-
hosted” WordPress. It’s referred to You will get some website traffic just from You can’t tweak the code if you ever need
as “WordPress.org” because that’s being part of the WordPress.com community. to (or get anyone else to tweak it for you).
the central website you go to in
order to download the software. There is no concern about your site ever going You have limited storage space.
(It’s likely you won’t actually have to down or being unavailable—but then again,
do this, though, since most hosting if you are using a quality host, this should
companies have an easy-install
never be an issue.
system that enables you to install
They sometimes put ads on your site,
it with just a click or two directly
and you have no control over this
from their control panel—we’ll go (unless you pay to remove them).
through this later.)
You can’t run your own ads on your site,
should you want to.
Costs
Free setup and hosting
Your own domain (mydomain.com instead of mysite.wordpress.com)—$13–$25/year
Optional paid-for themes—starting at $39 (once-only payment)
Optional “No-Ads” upgrade—$30/year
Other optional “upgrades” such as increasing your storage space—various prices
Switching to self-hosted at any point in the future (they’ll do it for you; some hosting
companies offer this service free when you switch over to them)—$129
10
You can fiddle with the code if you need to The WordPress interface is fairly simple,
(or get someone else to). but you will have to acquire some technical
knowledge.
costs
Your own domain—around $10 a year (this may be included in your hosting package) Below left: WordPress.org—the home
Hosting—depends on your host; at its lowest, approximately $30 a year, more usually of the self-hosted version of the system.
around $100 a year
Optional paid-for theme—starting at $30 (a once-only payment) Below: WordPress.com—sign up here
to set up your hosted WordPress site.
Search WordPress.org Go
Showcase Themes Plugins Mobile Support Get Involved About Blog Hosting Download
Password
WordPress 3.5.1 Maintanance and Security Find a Web Host and get great hosting
Release while supporting WordPress at the
WordPress 3.5.1 is now available, Version 3.5.1 is Themes • Store • Features • News • Stats • Terms of Service • Privacy Policy • An A U T O M AT T I C App
same time.
the first maintenance release of 3.5, fixing 37
bugs. It is also a security release for all previous Download & Install WordPress with our
WordPress versions. For a full list of changes, famous 5-minute installation. Feel like a
consult the list of tickets and the changelog, rock star.
which include:Editor: Prevent certain HTML
elements from being unexpectedly removed or Read the Documentation and become a
11
12
8
4
6
5
13
Before you start building your website, there are the cost of your domain in their price, so
two things you need: depending on whom you choose for your host,
> a domain name you may not need to set the two up separately.
> hosting for your website
We’ll look at some places to register your domain
A domain is the web address of a website. For name on page 17.
example, Google’s domain name is www.google.com.
The second thing you will need is hosting for
For a self-hosted WordPress site, you will need your website. You can consider your hosting
to buy a domain name. If you use WordPress.com, company as the “landlord” of the plot of ground
you will be given an address that looks something in cyberspace on which you will construct your
like this: mysite.wordpress.com. Or you can purchase website.
your own domain and use it with your WordPress.
com site. I recommend you do this if you’re using It’s essential that your hosting company is
the hosted version, as having a website with reliable—your website should never be “down”
wordpress.com in it doesn’t look very professional. or unreachable, which can happen from time
to time with less-reliable hosting companies.
Domain names cost in the region of $10 a year,
and they can be purchased from a company called We’ll address how to choose a reliable host
a registrar (or, if you’re using WordPress.com, you suitable for your needs shortly. First, there
can purchase it through them at a cost of $18 [at are some things you should bear in mind
time of writing]). Some hosting companies include when choosing your domain name.
14
These are:
> your brand or business name
> a search-engine-friendly name
> a more creative name
15
Domainsbot.com Namestation.com
Here are a few ways you can come up with original > misspell words—Flickr, Digg, Goowy
brand/domain names: > change or add a letter to create variations on words—
> put two words together to create compounds— Zune, iPhone, iTunes
YouTube, Firefox, Facebook > add prefixes and suffixes—Friendster, Napster, Biznik
> use phrases—StumbleUpon, MySpace, SecondLife > invent words—Etsy, Odeo, Bebo
> use slogans—justdoit.com (Nike), haveityourway.com > use words from other languages—Rojo, Vox
(Burger King), powerofdreams.co.uk (Honda UK) > play around with unusual or country-specific
> combine parts of words—Microsoft, Farecast, extensions—del.icio.us, foot.ie, designm.ag
Wikipedia
16
17
18
19
2
Discussion Forum Edit Profile Logout
Manage Account
Manage Domains Account Status
if your hosting company requires you Manage Domains Return to domain listing
Manage Email
Fully Hosted
to register a separate domain name,
MySQL Databases
(Upload your site to our servers and we’ll serve it up!)
One-Click Installs
Domain name
or if you have purchased a country- Main Menu
Domain to host:
Dream Host sub-domains are okay!
specific domain that your hosting Welcome Do you want the www in your URL? Leave it alone: Both http://www.example.com/ and http://example.com/will
cPanel Importer work.
company can’t supply you with, you Rewards Add WWW: Make http://example.com/ redirect to http://www.example.com/
sign up with a hosting company Run this domain under the user: alannah (on luthor)
Green Hosting
This affects which FTP account will have
The DreamHost Shop
access to the domain, as well as what
separately, and then link the two. Suggestions user PHP and CGI scripts will run as.
Donations (To You!)
Web directory: /home/username/
Partner Offers
Logs directory: /home/username/logs//http
Give to Charity
(can’t be changed)
Once that’s done, when your site Buy Gift Card
Domains
Web Options
visitors type your website address Manage Domains
Registrations
PHP mode: PHP 5.2.x FastCGI (default)
1. NS1.DREAMHOST.COM
2. NS2.DREAMHOST.COM
3. NS3.DREAMHOST.COM
4.
5.
Save Changes
20
21
If this is the case, a simple website, such as the A magazine (or blog) site (3)
basic model site we will build together in Chapter 5, This covers both personal blogs and news or
may be all you require. However, if you’re planning magazine sites focused around a particular field
to create something that looks slicker or has a more of interest. Page 98 will give you a taster of some
corporate feel, you’ll want to look at the selection of the themes you can use, and on page 114, we
of business themes in “Exploring Themes” (Chapter will follow a step-by-step guide to the creation of
7), or use the chosen business theme we focus a site using one of my favorite themes (pictured).
on in Chapter 8. Looking ahead and visiting other
sites for comparison will help you clarify your
ideas while you’re at the initial planning stage.
22
p l a n n i n g Y o u R W E b S i t E / / / W H AT K I N D O F S I T E A R E Y O U P L A N N I N G T O B U I L D ?
Are you going to be selling from your site? There are quite designed specifically as an online store. We’ll look at the
a few options for doing this, which are discussed in Chapter setup of one of these in detail on page 120.
6 (page 82). It makes sense to decide now on which one
you’re going to implement—it may be that you want to Many websites will, of course, be hybrids—for example,
choose a regular theme and just add payment buttons, a blog can be added to any kind of site, and business sites
or it may be that you want to kick off with a theme often contain a portfolio to showcase samples of work.
23
your site?
24
p l a n n i n g Y o u R W E b S i t E / / / W H AT ’ S T H E P U R P O S E O F Y O U R S I T E ? / / / W H AT C O N T E N T D O Y O U N E E D O N Y O U R S I T E ?
YouR SitE?
For a basic business website, you Home like to see on your home page. What
will probably need to include the The “Home” page is what your would convince you this was the
following pages (although you may website visitor will see first. Here right website to be on; that you had
choose to name them differently): you should let the visitor know found the right people to deal with?
clearly what it is you do and why Striking a decisive chord with your
> Home they should be dealing with you. ideal customer is your primary aim.
> About
> Services The text should not be too lengthy, Remember to check your spelling,
> Products and you should remember it is your grammar, and punctuation—it couldn’t
> Testimonials first—and possibly only—chance to be easier with a spell-checker—and
> Blog impress and engage your visitor, as ask someone to proofread your copy.
> Contact they are able to click away at any time. It’s so easy to avoid messing up your
first impression with glaring spelling
Put yourself in your ideal visitor’s or grammatical mistakes on your
shoes and imagine what you would home page.
TIP
25
It could include:
> the people involved in the business
> how long the business has been
established
> the story behind the setting up
of the business
> your personal/professional
background
> the team
> photographs of you, or the team,
or other photographs of interest
> perhaps a “human touch” or a bit
of humor to remind the visitor
there are real people behind This restaurant “About” page gives background information to site
the text on the page visitors in a friendly and inviting manner. (http://grandbocca.com)
services
I’m not overly keen on the title
“Services” for a website, as it seems
rather dry and uninviting—I prefer
friendlier alternatives such as “Work
With Us,” but obviously those aren’t
always appropriate and “Services”
may be your only real option.
26
P L A N N i N G y o u r W e B s i t e / / / W H AT C O N T E N T D O Y O U N E E D O N Y O U R S I T E ?
details on your website is also an issue
that only you can decide. If in doubt,
you can test both options once your
site goes live and see if there is a
marked difference in results.
PRODUCTS
Similar to “Services,” this page title can
be very unengaging; an alternative
such as “Our New Designs” might
be more inviting.
TESTImONIAlS
There’s nothing that impresses people
more than testimonials from happy—
better still, ecstatic—customers. If
they are lukewarm, or don’t convey
enthusiasm simply because the
person doesn’t write particularly
well, don’t include them. Their job
is to sell you, and it has to be 100
percent convincing.
BlOG
Whether you call it “Blog,” or label
it something different like “News” or
“What’s Happening,” I can’t think of
a website that wouldn’t be enriched
by having a blog section built into
it. Regularly updated, it is a great way
to make your business look dynamic Client testimonials appear at the bottom of the web pages for this Texan holiday cabin
and bring projects you’re working website; labeled “feedback,” this is a nicely discreet way of integrating testimonials.
on to your visitors’ attention (see
(http://cabinsatsmithcreek.com)
page 134 for more).
27
28
Contributor Name
Editorial
Search Clear
an image is used to underline each
of the company’s or product’s unique
VIEW BY CATEGORY:
Abstract
Animals/Wildlife
29
http://www.clipart.com*
*Thisoneworksoutasvery
inexpensiveifyoufigureout
Learn to build your own website
whatyouneedinadvance— This is a dummy website set up to accompany Chapter 5 of Create Your Own Website Using WordPress
you’reallowedupto250
in a Weekend.
imagesinaweekataflat
In this chapter of the book we see how the WordPress default theme “Twenty Twelve”, released as the
default theme as from December 2012, can be used to create a simple website for any kind of busi-
ness of personal site, or blog.
rateof$14.95,asattime
ofwriting.)
The header image for the WordPress “Twenty Twelve” theme is 960 pixels wide.
Consider using illustrations rather you either use an online photo-editor an image for your website header
than photographs (also available such as Pixlr (http://pixlr.com) or image, 960 pixels is the maximum
from stock-image sources)—they download Gimp, a free software for width you will need.
can look more individual. both Mac and PC. We’ll go through
each step of creating a custom If you’re purchasing stock photos
Get some ideas from other sites in header with Pixlr in Chapter 5. for the pages of your website, rather
your domain (whether you like or than the header image, you will be
dislike their choices), and also look Digital photographs are huge in able to buy small, or even extra-
at the images used in WordPress size. If your hosting package offers small, images. It is unlikely that your
themes (see page 90), as these you limited storage space, it may be photos will ever need to be wider
always incorporate dummy visuals. practical to reduce the size of your than 630 pixels, so choose a size
digital images before uploading that accommodates this easily.
Working on Your oWn pHotos them. Again, you can use Pixlr to do
You don’t need to buy special image- this. Open the photographs, reduce You won’t normally need to resize
editing software to create your site. the image size (by half, for example— your photographs before you upload
WordPress includes a built-in resizing, check the guidelines that follow them to the site; WordPress does
rotating, and cropping mechanism, to make sure you don’t reduce them this for you. The above sizing
and with the default theme we’ll use too much), and save them to your guideline is to bear in mind when
for the model website, you can crop computer before uploading them purchasing stock images or when
your photos for the header area to WordPress. reducing the size of images yourself,
through an easy-to-use interface. in order to save space on your site.
imAge size
However, you may need to work on Images for websites are measured in Do You neeD A logo
your images in order to create a pixels. To give you an idea, the header for Your site?
custom header image—perhaps one image of the WordPress “Twenty Not every website needs an actual
that incorporates your logo or your Twelve” theme is 960 pixels wide. logo. One way to brand yourself
business name. For this, I suggest So, when purchasing or preparing without using a logo is to choose
30
31
“Lil Tree,” “Abstract,” and “Paper” by http://backgrounds.mysitemyway.com. A Google search for “free website backgrounds” will bring up
dozens of sites where you can get background designs like the ones above. (Remember to credit the designer, if this is required.)
32
PLANNING Y OU R W E B S IT E
Adding videos to your website is a Hosting your video on YouTube
very popular way of adding life to it. or Vimeo is also a great way of
In order to show a video on your site, attracting new clientele. THIRD-PARTY sites
it has to be hosted by a third-party
Content can easily be added to your site
from the following third-party sites:
site such as YouTube or Vimeo; once Audio can also be included in a
YouTube
hosted, WordPress makes it very easy similar way, although the result isn’t
Vimeo
to “embed” videos into your site so yet quite as smooth; we’ll look at
DailyMotion
that they actually appear on your including both video and audio in
Flickr (both videos and images)
own web page, rather than the Chapter 5.
SoundCloud (via a plugin)
visitor having to go to another
site to watch it.
You can easily incorporate videos on your website by hosting them on YouTube.
33
1. Log into Dreamhost. Go to Goodies > Username: You can change this if you like,
One-Click Installs on the left-hand menu. but it is fine to keep it as “admin.”
2. Scroll down the page a little and click on Password: As you like, but keep the details
“WordPress.” somewhere safe, as this will be the password
3. Click the blue box labeled “Custom Installation.” you use each time you log in.
4. Select your domain and click “Install it for me now!” Your email address: This will be the email address
5. Check your email and look for an email from where you’ll be informed of any updates to WordPress,
Dreamhost, which will arrive in just a few minutes. so make sure it is your main email address.
Click the first link in the email, underneath where Privacy: Uncheck the box, as you don’t want the
it says, “Please create an admin user at:” search engines to visit your site until it is ready;
6. On the web page, fill in the details as follows: we’ll come back to this in Chapter 5. Now click
Site Title: Your business name or the name of “Install WordPress.”
your website (this can be changed later). 7. You’re done! You can now log in.
34
Flash Media
Custom One-Click Installer
Media Streaming 4
Install to: Select a domain
Jabber IM
Please be sure there are no files there now
Select Database: Automatically Create Database
Deluxe Install ?
Htaccess/WebDAV Install it for me now!
Block Spiders
Now.... 5
Google AdWords
1. Please create an admin user at:
Chartbeat Analytics http://www.alannahmoore.com/wp-admin/install.php
Information needed
Please provide the following information. Don’t worry, you can always change these settings later.
Site Title
Username admin
Usernames can have only alphanumeric characters, spaces, underscores, hyphens, periods and the @
symbol.
Password, twice
A password will be
wordpress.org/Installing_WordPress.
35
com), your setup will be even easier, 1 Get started with WordPress.com by filling out this simple form:
and you’ll have your blog up and E-mail Address We’ll send you an email to activate your account,
so please triple-check that you’ve typed it
correctly.
1. Go to http://wordpress.com, click Password Great passwords use upper and lower case
characters, numbers, and symbols like !"£$%^&(.
Hide
.wordpress.com Free
Choose an address for your blog. You can change
the WordPress.com address later.
Thinking about upgrading? Grabbing the upgrade bundle on signup can save
Custom Design
custom design, and an HD video Create Your Own Website Using... Upgrade to Pro New Post Alannah
Home
Dashboard
Screen Option Help
1 4
My Blogs Write a post
Store
Your dashboard address is only visible to you and it’s at:
wordpress2blog.wordpress.com/wp-admin/ Visual HTML
Status Draf
sibility:
General settings
Your profile
Need help getting started? Visit our zero-to-hero guide
Select your theme
3
00:00 02:05 24/7 Support
Pages
Learn WordPress.com: Our zero-to-hero guide.
Comments
Remind Me Later Hide this screen
Feedbacks
Users
Settings Content Discussion Have you tried our new home page quick post form yet? Try it now
Add Media
36
1 Dashboard
Domains
Store
First steps
1. Domain—if your site is to carry any
weight, you must have your own
domain name. You may want to
familiarize yourself a little further
with the system before you commit;
when you are ready, go to Store >
Domains, and follow the instructions.
(Your domain can also be purchased
as part of the “Value Bundle.”)
2. Settings—Alter the title and
tagline of your site and set the Activate Live Preview Details
time zone on the Settings >
General page.
To help you choose your theme, WordPress offers you a “Live Preview” option that
3. Profile—Fill in details about lets you play around with the colors and the header, and with certain other elements
yourself at Users > My Profile. (depending on the theme), before you choose to go live with it.
4. Theme—If you skipped this step
during the setup, you can now
choose your theme by going to
Starting to blog
Appearance > Themes. You’ll find
1. Create your first post at Posts > Add New. (You’ll also want to delete
the customization options in the
the existing dummy post from the Posts > All Posts page.)
Appearance > Theme Options,
2. Create any pages you want to add to the site (for example, an “About”
Header and Background areas
page) in the Pages > New Page area.
(options vary theme to theme).
3. Add sidebar widgets (including Facebook and Twitter, if you use them)
by going to Appearance > Widgets.
4. Categorize your posts at Posts > Categories.
See the example site at http://create 5. Customize your menu at Appearance > Menus.
yourwebsiteinaweekend.wordpress.com 6. Check and reply to your comments in the “Comments” area.
37
This walkthrough uses the WordPress default theme. website. Some of you may want to start
We can consider this a “starter recipe” from which immediately on something more complex; do
you can move on to more advanced setups once follow the walkthrough in its entirety, however,
you have mastered the basics. The current default as you will learn things here that you will need
theme has a clean, simple, and attractive design, to know later on, when customizing a more
and you may find this is the perfect theme for your complex template.
38
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / I N T R O D U C I N G T H E D E F A U L T W O R D P R E S S T H E M E “ T W E N T Y T W E LV E ”
site. This one is purely decorative,
but you may want to include a 2
logo or business name in yours. Create Your Own Website Using WordPress in a Weekend
8. The sidebar. Your blog pages Demo site using the Twenty Twelve theme 1
include a column to the right-hand HOME ABOUT FULL-WIDTH PAGE BLOG CONTACT
3
side, but for the main pages, you
Learn to build your own website
4
you may choose to omit the
sidebar and have the text cover
This is a dummy website set up to accompany Chapter 5 of Create Your Own Website Using
WordPress in a Weekend.
the full width of the site. In this chapter of the book we see how the WordPress default theme “Twenty Twelve”,
content you like in the sidebar. It’s The new default theme has a clean and fresh design and is fully responsive, meatning that it
This is a useful widget area where you might choose to put more information This is the blog section of the site
about you on the front page, so that visitors get more information at a glance
This is an aside
which they might otherwise miss.
This is an image post
This is a link
This is a quote
5 Search
6
Proudly powered by WordPress
Copyright © 2012 Alannah Moore. All rights reserved.
com/twentytwelve 7
> Has a clean and modern, This is the blog section of the site
This is an aside
39
AdmIn AreA
Header
Your admin area—also referred to FULL-WIDTH PAGE GAL
40
look when you first log into it. Dashboard Screen Options Help
Dashboard
Home
Updates
Dismiss
On your left, you will see a navigation Posts
Welcome to WordPress!
Media 1
column (1) that takes you to different Pages
We’ve assembled some links to get you started:
of sub-menu items becomes visible. Users or, change your theme completely
Tools
These options are also visible if you Settings
Right Now QuickPress
roll your mouse over them. Collapse menu
Content Discussion
Enter title here
1 Post 1 Comment
Upload/Insert
1 Page 1 Approved
The larger, main area of the page 0 Category 0 Pending
Media
Publish
Users
Page Attributes
TIP Tools
Parent
Settings
(no parent)
Collapse menu
Order
page: http://www.yourdomain.com/wp- Word count: 0 Need help? Use the Help tab in the upper right
of your screen.
41
stePs
At this point you’re probably keen to STEP 1: GEnEral SETTinGS 3. You can also change the time
dive into the fun part of customizing 1. On the left-hand navigation, zone to correspond to where
your new demo site, but before you click Settings > General. you are, so that your blog or
begin, you need to carry out a few 2. Here you can change the site news posts are stamped with
preliminary steps. title and tagline that you set up the correct time.
during the installation, as well 4. You don’t need to change
You’ve probably noticed that there as the email address where the anything else on this page.
are several useful links on the WordPress update notifications When you have finished, click
dashboard inviting you to begin will get sent. the blue “Save Changes” button.
setting up your website. You will
be able to explore these at your
leisure, but for the purposes of this
walkthrough, we will follow a series
of steps that will help you to get up
Settings General
and running more quickly.
Writing
Remember that WordPress is a very Collapse menu
full-featured software that can be
Reading
made to do all kinds of things. As Discussion
you navigate around the admin area,
you will see many different options Media
offered to you. For now, you only
Permalinks
need to follow the steps in the
walkthrough. Other, more complex
setups will require you to implement
some of these alternative options,
Save Changes
but for our initial purposes, you
won’t need them.
42
Discussion Settings
Default article settings Attempt to notify any blobs linked to from the article
Allow link notifications from other blogs (pingbacks and trackbacks)
Allow people to post comments on new articles
(These settings may be overridden for individual articles.)
43
bloG or nEwS PoSTS into the appropriate fields, and a nickname into the nickname field
1. Go to Users > Your Profile. When look at the drop-down menu and select it on the drop-down.
you post a news item in your blog below—you will see that various 3. There is no need to change
area, it will show up as having been arrangements of your name have anything else now, so just click
posted by “admin,” unless you magically appeared as options to the blue “Save Changes” button
choose to set it to something choose from. You may not want at the bottom when you’ve
that looks more personal. your real name to show on the finished.
Name
First Name
Last Name
When you have the Jetpack plugin installed on your site (see alannahmoore
page 75), site visitors will be able to find out more about the
Paris/London
44
Permalink Settings
By default WordPress uses web URLs which have question marks and lots of numbers min them, however WordPress offers you the ability to create a custom URL stucture
aesthetics, usability, and forward-compatibility of your links. A number of tags are available, and here are some examples to get you started.
Common Settings
45
heAder
Appearance Themes
Click on Appearance > Header
Widgets
Plugins on the left-hand navigation.
Menus
Users Header
Tools Background
Editor
Settings
You will be taken to a page
Collapse menu
like the one below.
Dashboard Help
Custom Header
Posts
Header Image
Media
Preview
Pages
Comments
Create Your Own Website Using WordPress in a
Appearance Weekend
Themes Demo site using the Twenty Twelve theme
Widgets
Menus
Header
Select Image You can select an image to be shown at the top of your site by uploading from your computer or choosing from your media library. After
Text Color
Select Color
Save Changes
This page is where you choose > just a header image, which Have a look at the example
whether your site will have: incorporates your website title screenshots to see how the different
> a text heading or business name, and your logo, layouts appear, then play around
> a text heading with a header if you are going to use one with the options to decide which
image beneath it is best for your own site.
46
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / T H E H E A D E R
The clean design of the default
theme ensures that your website Japanese Cookery Classes
title, or business name, looks Learn Japanese cooking at your own home
attractive simply written in text HOME ABOUT CLASSES MENUS GALLERY BLOG CONTACT
Learn how to create perfect Japanese dishes at your own home. Our classes
provide a wonderful, informal way of learning the delights of Japanese cooking.
If you choose the text-only option,
Choose from the following courses:
you will want to add some visual
•
interest on the front page by adding •
Sushi and Sashimi
Noodle dishes
•
a picture alongside your home page •
Canapes
Dumplings
•
text, as I have done here. Gourmet course - a series of six classes
Our teachers are experienced and friendly and will bring all the equipment and
ingredients you need to your own home.
47
Help
Crop Header Image
Choose the part of the image you want to use as your header.
48
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / T H E H E A D E R
image you want to use for the
To display random images:
header—see opposite.
If you choose the random option, your site visitors will see a different
header image displayed on each page they visit.
You can move the selected area
around and resize it by moving the
1. Upload and crop some more header images in the usual way.
borders with your mouse. (If you
2. Click the radio button next to “Random: Show a different image
lose your selected area, just click and
on each page.”
select again; if you are uploading a
3. Click the “Save Changes” button at the bottom of the page.
digital photo, you will need to scroll
to the right to include the full width Random: Show a different image on each page.
of the image.)
49
If you choose to leave out the text site has a heading. This, you can’t
heading and put only an image at do inside WordPress—you’ll need
the top of your website pages, you to use an external image-editor such
will want to incorporate your website as Pixlr (see below).
Learn how to create perfect Japanese dishes at your own home. Our classes provide a wonderful, informal way of learning the delights of
website looks.
Japanese cooking.
Images
2) This will take you to our website
3) Download the product
Advertisement
Go to Image > Image size.
50
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / T H E H E A D E R
of your photograph for your header,
set the width at 960 pixels. If you Image size
4 5
only want to use part of it, try it Width: 960 pixels OK Tools
slightly larger at, for example, 1200 Height: 717 pixels Cancel
pixels (you may need to experiment a
Constrain proportions
little to get the right size). Keep the
box next to “Constrain proportions”
checked, so that the image doesn’t File Edit Image Layer Adjustment Filter View Language Help
5 Constraint: Aspect ratio Width: 960 Height: 125
become distorted; do not change the No restriction
Tools Aspect ratio
figure given for the height, as this Output size
51
S: 0 G: 0 S: 27 G: 169
L: 0 B: 0 L: 76 B: 194
to choose the color of the text. # 000000 # 8da9c2
S: 0
52
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / T H E H E A D E R
header New image:
2
Note that you will need your logo Name:
on a transparent background before header
Width: Height: 3
1. Open the Pixlr editor as before 960 125
6 name 7
I have set a height of 125 pixels).
(Ignore the drop-down titled
“Presets”.) When you are finished,
click “OK.” 100 % 373x45 px
Flickr
53
BACkGround
You’ve customized the header part of your website; now it’s time to look
at the background. Appearance
Themes
Click on Appearance > Background.
Widgets
From this page, you can either upload an image file that will act as a page Menus
background, or choose a different background color.
Edit CSS
For a more personal site or a blog, a background image or pattern can Header
work really well, as it will make your site look completely unique. For a
Background
business site, I recommend a plain color—a background can work, but
make sure the one you choose is subtle. Editor
54
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / T H E b A C k G R O U N D / / / C R E AT I N G P A G E S
PAGes
Now that you have the basic Create Your Own Website Using WordPress... New Howdy, admin
Search Pages
All (1) | Published (1)
you are ready to move onto the Media
Bulk Actions Apply Show all dates Filter 1 item
Links
Plugins
Bulk Actions Apply 1 item
Settings
At the moment, there is only one Thank you for creating with WordPress.
Let’s start with your home page. Create Your Own Website Using WordPress... New
Dashboard
1. Click either the “Add New” button Posts Enter title h Publish
Media
at the top of the page, or the Pages
Save Draft Preview
Page Attributes
one on the right. Plugins
Users Parent
Default Tem te
Path: p Need help? Use the Help tab in the upper right of
55
56
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / C H O O S I N G Y O U R H O M E P A G E / / / W O R k I N G W I T H T H E T E x T E D I T O R
text edItor
Pages
Bulk Actions Apply Show all dates Filter 6 items
Tools
Full-Width Page admin 2012/10/18
Settings Published
Paragraph
To add content to your pages, go familiar to you from using Word beneath. This button is known as
to Pages > All Pages. Click the title or other text-editing software. the “Kitchen Sink” button; the idea
of the page you want to edit (or is not to clutter up too much of
the small “Edit” link that appears Over the page is a guide to the your screen with buttons that you
underneath it when you move your various items you can use when may not need to use—but it can
mouse over it), and you will be taken editing text. be confusing if you haven’t come
to the “Edit Page” area for that page. across it before.)
(If you can’t see both rows of buttons,
Inside the “Edit Page” area, you’ll see click the button indicated above and
many formatting buttons that will be the second row of buttons will appear
57
1 3 5 7 9 11 13 15
2 4 6 8 10 12 14
26 Add Media
Visual Text
Paragraph
17 19 21 23 25
16 18 20 22 24
1, 2, 3, 17 Bold, italic, strikeout, 18 Left or right justify button. 12 Inserts a “Read More” link (this
and underline buttons. 10, 11 Add or remove a link button. To does not work for pages; it is used
4, 5 Bullet and numbered list keys. add a link, select the text to be made only for blog posts).
6 Blockquote—a way of making your into a link, click the link button, and a 13 Spell-checker button.
text stand out. Highlight the text you window will come up; then, type the 14 Full-screen button—it is sometimes
want to display in this way and then web address in the “URL” field, check easier to type with a full screen, as the
click the blockquote button. the box so the link will open in a new text appears more clearly and there
7, 8, 9 Left-align, center, or right- window, and click “Add Link” (see are fewer distractions.
align buttons. below right).
Insert/edit link
6 About 10
Enter the destination URL
Paste from Word
This is where you will write a bit of information about you or your business. URL http://www.createyourwebsiteinaweekend.com
Title
This is an example of text set out with the “blockquote” format. It’s a good way of making Open link in a new window/tab
your website text stand out.
58
different heading options will give This is a dummy website set up to accompany Chapter 5 of Create Your Own Website Using
In this chapter of the book we see how the WordPress default theme “Twenty Twelve”, released as
with “Heading 1” being the largest the default theme as from December 2012, can be used to create a simple website for any kind of
business or personal site, or blog.
otherwise it will bring extra code and 16 This is an example of text written in “Paragraph” style.
Paste from Word
Use CTRL + V on your keyboard to paste the text into the window.
21
formatting with it from the original. This is an example of “Heading 1” Style.
In the same way, use the “T” button This is an example of “Heading 2” Style.
59
menu
After you have added your items, drag and drop to put them in the order you want. You can also
Settings
Pages Main
5. Click the “Select All” link and then Comments Theme Locations Menu Name Main Automatically add new top-level pages
Background Save
Add to Menu
Collapse menu
can then drag them around to
Pages
reorder them with your mouse. Most Recent View All Search
About
link, and the “Contact” page last. Delete Menu Save Menu
Home Page
Gallery Page
Save Menu
60
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / A D D I N G P A G E S T O T H E M E N U
ThaT’S diffErEnT from
a PaGE hEadinG
Create Your Own Website Using WordPress in a Weekend
You may want the heading visible
Demo site using the Twenty twelve theme
in the menu). In the screenshot of In this chapter of the book we see how the WordPress default theme “Twenty Twelve”, released as the
the live demo site, we can see “Learn default theme as from December 2012, can be used to create a simple website for any kind of
business or personal site, or blog.
is the main heading, whereas the really good on smartphones and tablets.
page (Pages > All Pages > Home). Paragraph Published on: Oct 18, 2012 @ 11:38 Edit
2. Change the title of the page, and This is a dummy website set up to accompany Move to Trash Update
Chapter 5 of Create Your Own Website Using
then click the “Update” button.
3. Go back to the “Menus” page
(Appearance > Menus). You will Main
3
see that the menu item has Menu Name Main
Automatically add new top-level pages
changed to the new title. Delete Menu Save Menu
61
your sIte
addinG imaGES This is where you will write a bit of information about you or your business.
To add an image to a page:
1. Click in the text-editing area where
Insert Media
3
Insert Media
you want the image to appear. Create Gallery Upload Files Media Library
if that is easier.)
4. Allow the image to upload. When 4 ATTACHMENT DETAILS
ATTATCHMENT DISPLAY SETTINGS
“Caption” field.
62
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / A D D I N G I M A G E S T O Y O U R S I T E
own page, if the visitor clicks on something. Choosing “None” will and check how it looks on your
it (we’ll see how to set this option obviously keep the image in its live site.
in just a moment). If you want to unlinked format; choose “Custom URL” 6. If you want to make any changes
do this, you can optionally type a if you want to link it to another web or resize the image, click on the
description of the image that will page, and paste in the web page image in the text editing area.
show up only on the image’s own address. “Attachment Page” is the A button will appear at the top
page; type this in the field labeled setting you choose if you want to left; click on this to adjust the size,
“Description,” otherwise you can create a separate page displaying the position, title, or caption. Take care
leave it empty. image at larger size, plus any not to click on the red button, as
description. “Media File” will open the this will remove the image.)
Set the alignment (that is, the image at its original size in the browser 7. Make your change and click
positioning) of the image in the window without any description. “Update,” remembering to also
drop-down labeled “Alignment,” click the “Update” button on your
underneath “Attachment Display Finally, you need to choose the size editing page to save the change.
Settings.” In the example, I chose at which you want to display the
“Left,” as I wanted the text to appear image (you can fine tune this once Note that you can use the size
to the right of the image. the image is saved on the page). slider (indicated in the screenshot)
to make the image smaller by
Scroll down inside the window; the 5. When you’ve chosen your incremental degrees of 10%. If you
next drop-down (screenshot opposite) settings, click “Insert into page,” want to make it larger, you will need
is where you choose whether you then click the blue “Update” to upload it again at a larger size.
Title
Caption
Update Cancel
63
Columns
Attachment Page
ATTACHMENT DETAILS
left (as indicated). Caption this image... Caption this image... Caption this image...
Edit Image
Delete Permanently
Title Sashimi
Description
Sashimi
Should you experience any difficulty HOME ABOUT FULL-WIDTH PAGE BLOG CONTACT HOME ABOUT FULL-WIDTH PAGE BLOG CONTACT
3. Click “Create a new gallery.” to have the thumbnails appear in to have appearing in each gallery
random order—see the checkbox row, which will determine their size.
At this next screen, you can set your to the right under “Gallery Settings.”
title and alt text for each image, and 4. Click “Insert gallery” when you’re
optionally also your caption and In the “Gallery Settings” area, choose done, and finally click “Update”
description (the description will show whether the images should open to save the page. Now you can
with the larger version of each image at large size in the browser window check how your gallery looks.
when clicked on from the gallery). when clicked on (“Media File” in the
You can reorder the images by drop-down) or in a separate website
dragging and dropping them. page (“Attachment File”); you can
Alternatively, there is the option also choose how many thumbnails
64
EdiTinG a GallEry
To edit a gallery, click on the gallery
Cancel Gallery Edit Gallery
in your editing page, then click on Add Media
Drag and drop to reorder images.
Columns
Attachment Page
ATTACHMENT DETAILS
over it. Caption this image... Caption this image... Caption this image...
Edit Image
Delete Permanently
Title IMG_1211 1
Description
65
3 4
image. For best results the scaling should
be done before performing any other File type: JPG
operations on it like crop, rotate,etc. Note
that if you make the image larger it may Dimensions: 2592 x 1936
become fuzzy.
Original dimensions 2592x1936 Delete Permanently Update
1 2592 x 1936 Scale 6
Image Crop (help)
Cancel Save
Current thumbnail
Apply changes to:
7
All image sizes
Thumbnail
All sizes except thumbnail
EdiTinG imaGES from To crop an image, first select the You can also do the following
wiThin wordPrESS area with your mouse (1). If you want within the editing area:
As we have seen, WordPress has an this crop to be used as the thumbnail > Rotate the image (4).
image-editing facility that is useful for the image, then it must be square; > Flip the image vertically or
for resizing and rotating images, as WordPress has a neat tool to make horizontally (5).
well as creating different thumbnail this easy. First, roughly select the > Resize the image keeping the same
images if the ones automatically area you want to use as the thumbnail. proportions (6).
generated by the gallery don’t display Then write “1” and “1” in both the > Choose the versions of the images
the image to its best advantage. boxes labeled “Aspect Ratio” (2). to which the change will apply (7).
Click back inside the selected area This tool is often used only for
To edit an image, go to Media > with your mouse and move it thumbnails (the main image will
Library, find your image in the list slightly—you will find the selected remain the same).
of uploaded images, and click on the area automatically squares itself. > Undo your changes if necessary (8).
image title (or use the “Edit” link that Move the selected area around until
appears below it when you move you’re happy with the crop and when Click “Save,” then click “Update when
your mouse over it). At this point you are, click the “Crop” button (3). you’re done.
you can change the title, caption,
alt text and description, but to make
changes to the image itself, click the
“Edit” button underneath the image.
66
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / A D D I N G V I D E O A N D A U D I O T O Y O U R S I T E
vidEo
WordPress has made adding videos address of the video from your audio
to your website as easy as possible. browser address bar. To upload audio to your site,
the file must be in MP3 format.
1. If you want to show your own 3. Paste this into your page editing
video, open an account (free) box, where you want the video to 1. Click in your page editing box
with a video-sharing site such as appear, on a separate line of its where you want the audio link
YouTube or Vimeo, and upload own (as shown below). to appear.
your video there. 4. Click “Update,” and you’ll see the 2. Click the “Add Media” button
2. For YouTube, navigate to the video embedded into your site. as though you were uploading
video you want to show on your an image, and upload the MP3
website, then click “Share” below (This simple one-line paste also to your Media Library.
the video, and copy the web works with other video- or image- 3. In the “Title” field, write the
address that appears beneath it. sharing sites, such as DailyMotion text that you want people to
For Vimeo, simply copy the web and Flickr.) click on to listen to the audio.
Select “Media File” in the “Link
to:” drop-down.
4. Click “Insert into page.”
5. Click the blue “Update”
2 button to save your page.
ATTACHMENT DETAILS
fj.mp3
Febuary 26,2013
Delete Permanently
Maree Pigdon Learn To Sew Sewing Classes - Baby Sewing.mpg Title Click here to listen
mareepigdon 78 videos
1,539
Subscribe 201 3 0 Caption
Like About Share Add to
Description
http://youtu.be/D1oQcJkAZtU Start at: 0:00
http://youtu.be/D1oQcJkAZtU
67
To delete the dummy post and caTEGoriES and TaGS Categories and subcategories can be
create your own blog posts, go One feature blog posts have that added directly from the blog-editing
to Posts > All Posts. pages do not is that they can be page, or from the special “Categories”
categorized into different topics of area of the left-hand navigation.
Move your mouse over the dummy interest. The benefit of doing this is
“Hello world!” title, and click “Trash” that you can add a list of your To assign a post to a category
to remove it. categories into the sidebar, allowing while you are working on it, use
visitors to choose which blog posts the “Categories” box to the right,
Now, click on “Add New,” either at they want to read, according to topic. as shown in the screenshot.
the top of the page or in the left-hand
navigation (under “Posts” rather than Although this feature is optional, To rename the “Uncategorized”
“Pages”), and then type in and publish if you don’t choose to assign your category, go to Posts > Categories.
your own blog post —including any blog posts to different categories, Move your mouse over
images, audio, or videos if you like, they will show up as having been “Uncategorized” and click the “Edit”
in exactly the same way you did classed as “Uncategorized,” which link that appears underneath it.
with your site pages. can look clumsy. The best way around Change the category name and the
this is to change the name of the slug and click “Update.” (The slug is
“Uncategorized” category. You could simply how the category will look as
change it to “Blog” or “News,” or a web address. Just type the same
something more specific that is title as you did into the “Category
suitable for your site. Name” field and WordPress will
68
All Posts
Publish
Add New Save Draft Preview
Categories
Add Media Status: Draft Edit
Tags Visual Text
Comments
Move to Trash Publish
Appearance
Plugins
Format
Users
Standard
Tools Aside
Image
Settings Link
Quote
Collapse menu
Status
Categories
Tags
Add
format it as it needs it.) After that, area, which you access from the cloud”—a group of tags of different
click “Update”. left-hand navigation, or from the sizes, the largest being the ones you
“Tags” box on the main editing use most.
You can also assign “tags” to your page, found underneath the
blog posts, which is a different “Categories” box (as shown in There is no obligation to use either
way of allowing people to find the screenshot above). categories or tags—they can quite
posts according to areas of safely be ignored—but if you are
interest. Categories are general You can show your tags in your going to do a lot of blogging, your
ways of grouping posts together— sidebar in the form of a “tag readers will find them useful.
filing them, if you like—whereas
tags can relate more specifically
to the topic of the blog post;
The DIffeReNCe BeTWeeN CATeGoRIeS AND TAGS
you can consider them as
It can be difficult to grasp the difference between categories and tags. Here’s a wardrobe
keywords that relate to the metaphor that may help. You classify your clothes by type—socks, jackets, shirts, and so
subject matter of the post. on; these you can consider your categories. Tags will be the way you describe the individual
Like categories, tags can be items of clothing—knitted, purple, woollen, silk, vintage, summer, evening.
managed in their own
69
Number of Columns: 1 2
Search Posts
required. All (6) | Published (6) | Sticky (1) | Trash (1)
Bulk Actions Apply Show all dates View all categories Filter 6 items
4. Click the blue “Update” button
to save your changes. Title Author Categories Tags Date SEO Title
SEO
Keywords
SEO
Description
Slug
a plugin that protects you from this-is-the-blog-section-of-the-site
Format Standard
Cancel Update
70
RECENT POSTS
Featured post
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / Y O U R b L O G O R N E W S A R E A
This is the blog section of the site
This is an aside
blog posts in different ways. If your Enter your email address to subscribe to
this blog and rcceive notifications of new
posts by email.
blog is going to be a major feature of
Email Address
Leave a reply
alternative formats you have an example of a “Standard” blog post. I’ve made it “Sticky” so that it stays at the top of the
page. Any type of blog post can be made “sticky,” but it’s only standard-format blog posts that 402 people like Alannah Moore.
> Quote
Fatyy Gillian Jordi
This is a blog post saved with the “Aside” format. An aside is a very short blog post with a Facebook social plugin
Format
This is a blog post saved with the “Image” format. You can add text to an image post - perhaps
Standard to explain the image - but its title won’t show up, in order not to detract from the impact of the
image itself.
Aside
This is an image post
Leave a reply
Link
Quote
This is a post saved with the “Link” format. LINK
Status http://www.google.com
Leave a reply
feATuReD ImAGeS This is a blog post saved with the “Quote” format. Its title doesn’t show up. it’s perfect for a
to them which will stand out more than an October 18, 2012
Leave a reply
a Featured Image” button from the lower This is a blog post saved with the “Staus” format. It shows the name and “gravatar” of the
right-hand side of your post editing page. person who wrote the post. (if you have gravatars enabled in the Settings > Discussions area of
the admin).
Leave a reply
71
Proudly powered by WordPress
Copyright © 2012 Alannah Moore. All rights reserved.
Widgets are the little bits of content WordPress automatically puts in for them from the central area to the
—recent posts, search boxes, etc.— you; we need to get rid of these, so “Main Sidebar” box—you can easily
that you can put in the sidebar that you can put the widgets you do reorder them with your mouse.
area of your pages and, with this want in there.
particular theme, in the footer of The best way to decide which
the home page. 1. Go to Appearance > Widgets in widgets you want to show on your
the left-hand navigation. site is to experiment with them.
WordPress comes with certain 2. In the box on the right-hand side
widgets built-in; however widgets labeled “Main Sidebar,” you will see
exist to do pretty much anything, the widgets WordPress puts into
and we’ll see more of these when we your sidebar by default when you
look at plugins in the next section. first set up your site. Drag these
RemoVING The SIDeBAR
With the default theme, you have the
out of the box with your mouse so
option of choosing to create pages without
addinG widGETS that you can start afresh. (These
a sidebar, and therefore without widgets.
To your PaGES are standard widgets, which you
See the live demo for an example—I have
You will have noticed that in the can always add back in later.)
created a page entitled “Full-Width Page”
sidebars of your site there are 3. Now choose which widgets you
to show you what this will look like. To
already some elements that want in your sidebar by dragging
save a page with the full-width format,
go to the editing screen for that page
and in the box to the right entitled “Page
Attributes,” choose “Full-width” from the
drop-down. (This was what you did when
Appearance Themes
1 you assigned the Front Page Template to
Widgets
Plugins
Menus your home page.) Save the page with the
Users
Header
blue “Update” button, as usual. Note that if
Tools Background
Editor
you keep your sidebar empty, the sidebar
Settings
area will disappear automatically from all
your blog posts and pages.
Create Your Own Website Using WordPress... New Howdy, admin
2 Dashboard
Widgets
Screen Options Help
Posts
Media
Available Widgets Main Sidebar
Page Attributes
Drag widgets from here to a sidebar on the right to activate them. Drag widgets back here to deactivate them and delete their
Pages Appears on posts and pages except the
settings.
optional Front Page template, which has
Comments
its own widgets
Archives Calendar
Appearance
A monthly archive of your site’s posts A calendar of you site’s posts Search
Themes Parent
Widgets Categories Custom Menu
Recent Posts
Menus A list of dropdown of categories Use this widget to add one of your custom
Header menues as a widget.
Recent Comments
(no parent)
Background
Editor Meta Pages
Log in/out, admin, feed and WordPress Your site’s WordPress Pages Archives
Plugins links Default Template
Users
Recent Comments Recent Posts
Categories Front Page Template
Tools
The most recent comments The most recent posts on your site
Meta
Full-width Page Template, No Sidebar
Settings
72
the “Categories,” “Tag Cloud,” and We’ll now move on and look at
“Recent Comments” widgets as well. plugins; when we install the Jetpack Display as dropdown
Show post counts
plugin, you’ll find that some other
Delete | Close Save
You can also add widgets to the useful—not to mention fun—widgets
“First Front Page Area” and “Second become available.
TWo VeRy uSeful WIDGeTS > “Custom Menu”—remember how Custom Menu
> The “Text” widget is very useful for we created a menu for the site and
writing small snippets of text, such labeled it “Main”? You can actually
Title:
as your telephone number or address, create any number of menus, attach
or for highlighting a special offer. pages to them, and display them
Snippets of code can also be pasted in the sidebar as additional menus
into “Text” widgets, if you ever need using the ‘Custom Menu” widget. Select Menu: Sidebar Menu
to do this. This is useful if you have a lot of
pages on your site, but don’t want to Delete | Close Save
clutter up the main menu with them.
73
A plugin is a component that you 5. Go back to your plugins page and without you having to moderate
can add to WordPress to make it do click the link that says “Go to your them, but Akismet will have filtered
things that it doesn’t do right out of Akismet configuration page.” out any that are spam. Do keep
the box. We’re going to install the 6. Paste the key in the field (as an eye on your comments in the
plugins you need to complete your indicated below), and then click “Comments” area on the left-hand
website, and then it will be fully “Update Options.” navigation of your admin area,
functional and ready to go. as very occasionally Akismet will
Now that Akismet is activated, you misjudge a comment as spam when
akiSmET can go to the Settings > Discussion it isn’t, and vice versa. But it does
Akismet is a plugin so essential that area and uncheck the boxes next to a very good job—if you check the
it comes bundled with WordPress. “Before a comment appears.” This “Akismet Stats” area, you’ll see just
It does the very important job of means that comments will go up how much spam it filters out.
stopping you getting spam, either
through the “Comments” area on Monitor and reply to your comments from the “Comments” area of the admin. You’ll find
your blog posts or from the contact Akismet almost never publishes spam by mistake, but you should still keep an eye out.
form we will set up in the next step.
All you need to do is activate it by
putting in a special passcode so
that it can start working.
Plugin Description
3 Akismet Used by millions, Akismet is quite possibly the best way in the world to protect your blog from
For business accounts you need to Deactivate | Edit | Settings comment and trackback spam. It keeps your site protected from spam even while you sleep. To
get started: 1) Click the “Activate” link to the left of this description, 2) Sign up for an Akismet API
sign up for a paying account—$5 key, and 3) Go to your Akismet configuration page, and save your API key.
Version 2.5.6 | By Automattic | Visit plugin site
a month at the time of writing—
whereas for personal sites it is free
(or you pay voluntarily). Sign up for 6 Akismet Configuration
whichever is applicable to you—you
Akismet is almost ready. You must enter your Akismet API key for it to work.
really do need an Akismet account.
For many people, Akismet will greatly reduce or even completely
eliminate the comment and trackback spam you get on your site. If one
1. Go to Plugins > Installed Plugins. does happen to get through, simply mark it as “spam” on the moderation
screen and Akismet will learn from the mistakes. If you don’t have an API
2. Find “Akismet” at the top of the
ket yet, you can get one at Akismet.com.
list of plugins that come ready
Akismet API Key
installed, and click the “Activate”
link underneath it. Please enter an API key. (Get your key.)
74
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / T H E P L U G I N S Y O U N E E D
Jetpack is a plugin bundle containing
many tools that were, until recently, Plugins
Screen Options Help
3 Add New
First, we’ll install the Jetpack bundle, Password Forgot your password?
A N A U T O M AT T I C A I R L I N E
2. Find “Jetpack” in the list of plugins Howdy wordpressjetpack, Jetpack wants to connect www.alannahmoore.com/twentytwelve to WordPress.com.
To connect using an account other than wordpressjetpack please sign out first.
Jetpack
Media
Comments
The features below are now active. Click the learn more buttons to explore each feature.
Feedbacks
Settings friends.
—click on it and you’ll see a range of Collapse menu Learn More Learn More Configure Learn More Configure Activate Learn More
75
Pages
can see next to the button you All Pages
Add Media
Visual Text
appropriate (not everyone writing Here’s what your form will look like
to you will have a website)—do How does this work?
Name (required)
this by clicking on the “-” sign next By adding a contact form, your readers will be able to
submit feedback to you. All feedback is automatically
to it; then 2) change the title of Email (required)
scanned for spam, and the legitimate feedback will
be emailed to you.
the “Comments” field to “Message”
by moving your mouse over it so Website
Can I add more fields?
that the “Edit” link becomes visible. Sure thing. Click here to add a new text box,
textarea, radio, checkbox, or dropdown field.
Comment (required)
Click “Edit,” change the label, and move edit
Can I view my feedback within WordPress?
save the field.
Yep, you can read your feedback at any time by
4. Now click the “Email notifications” clicking the “Feebacks” link in the admin menu.
76
s t e P - B y- s t e P : C r e At I n G A B A s I C m o d e l W e B s I t e / / / T H E P L U G I N S Y O U N E E D
You now have a contact form on
your contact page that makes it easy
1
for visitors to your site to contact Install Plugins
you via your website. However, as
explained when planning your Search | Upload | Featured | Popular | Newest | Favorites
website in Chapter 3, it adds
credibility to your site when people
Plugins extend and expand the functionality of WordPress. You
can see your real email address.
If you are a blogger, this may not
be an issue; however, if you have a Search
real-world identity that your site
is promoting, then it is important. email protector Search Plugins
The problem is that once your email
address is posted on your website,
spammers can “harvest” your email
2 Name Version Rating
address. You need to protect it, and
that’s where the “Email Protector” Pixeline’s Email Protector 1,2,3
plugin comes in handy. Details | Install Now
77
78
a copyright line when you’re using the default theme, ‘twentytwelve’ ); ?>” rel=”generator”> <?php printf( _ _( ‘Proudly powered by %s’,
‘twentytwelve’ ), ‘WordPress’ ); ?> </a>
</div><!-- .site-info -->
whereas many of the premium themes do. So to add </footer> <!-- #colophon -->
</div> <!-- #page -->
are going to continue with the default theme, this will ‘twentytwelve’ ), ‘WordPress’ ); ?> </a> <br> Copyright © 2013 Alannah Moore. All rights
reserved.
</div> <!-- .site-info -->
be a finishing touch. </footer> <!-- #colophon -->
</div> <!-- #page -->
name. All rights reserved. ‘twentytwelve’ ), ‘WordPress’ ); ?> </a> <br>Copyright © 2013 Alannah Moore. All rights
reserved.
</div> <!-- .site-info -->
</footer> <!-- #colophon -->
</div> <!-- #page -->
Your code should now look like this (4). Note that as the years pass, you will want to
extend your copyright notice so that it reads
5. Click the blue “Update file” button, and check “Copyright © 2013-14 Your name or business
how it looks on the live site. name. All rights reserved.”—and so on.
79
This is a dummy website set up to accompany Chapter 5 of Create Your Own Website Using WordPress
in a Weekend.
In this chapter of the book we see how the WordPress default theme “Twenty Twelve”, released as the
default theme as from December 2012, can be used to create a simple website for any kind of bus-
iness or personal site, or blog.
The new default theme has a clean and fresh design and is fully responsive, meaning that it looks re-
ally good on smartphones and tablets.
This is a useful widget area where you might choose to put more information This is the blog section of the site
about you on the front page, so that visitors get more information at a glance
This is an aside
which they might otherwise miss.
This is an image post
This is a link
This is a quote
Search
80
81
Accepting payment online can be a complicated beginning of the book, you have been able to get
business involving internet merchant accounts, everything organized in advance before starting
complex shopping carts, and payment gateways. to build your site.
While this may be appropriate for you further
down the line, if you want to set up your website You may also want to think about allowing your
in a weekend and take payment online as easily site visitors the additional options of mailing you
and painlessly as possible, using PayPal as your a check or arranging to pay you via a bank transfer,
payment processor is probably the best option. but this will mean extra work on your part. These
options should always be in addition to—not
It may take several days to get your PayPal account instead of—making payments via an instant,
up and running, so hopefully, as suggested at the online method, which most people prefer.
82
S E L L I N G F R O M Y O U R W E B S I T E / / / U S I N G PAY PA L
Personal Business Email address forgot? Password forgot? Log In Sign up
which will then add a payment About PayPal Merchant services PayPal blog PayPal Labs Jobs Site map eBay
button—funds accumulated via Copyright © 1999 - 2012 PayPal. All rights reserved. | privacy policy Legal agreements
83
You can add simple “Buy Now” a shopping cart and pay for them in
buttons if you’re just selling a few one go; in this case, choose the “Add
individual articles. If you imagine to Cart” button instead. Both options
your visitors making more than one are a snip to implement—all you
purchase at a time, it makes sense need to do is add a morsel of code
to let them add their purchases to to your pages or posts.
Learn how to create perfect Japanese dishes at your own home. Our
classes provide a wonderful, informal way of learning the delights of
Japanese cooking.
Our teachers are experienced and friendly and will bring all the equipment and ingredients you
need to your own home.
Invite up to six of your friends to your own personal Japanese cooking class.
For s i x g u e s t s $ 1 8 5 . 0 0 U S D
Buy Now
A “Buy Now” button with a drop-down menu; see over the page to see
the “Add to Cart” button and other buttons you can set up with PayPal.
84
S E L L I N G F R O M Y O U R W E B S I T E / / / PAY PA L B U T T O N S A N D S H O P P I N G C A R T
to your site
1. Log in to your PayPal account. Step 1: Choose a button type and enter your payment details
3
Go to “Merchant Services,” then Choose a button type Which button should i choose?
underneath the “Get Started” Item name Item ID (optional) What’s this?
click on “Create button now.” Add drop-down menu with price/option Example
Sushi & Sashimi evening
open at the “Buy Now” option; For four guests 150 USD
the different options available Add drop-down menu without prices Example
Intergration tips
iii. You can also opt to change <form action= “https://www.paypal.com/cgi-bin/webscr” method=”post”> Buyer’s View
<input type= “hidden” name=”cmd” value=’_s-xclick”>
the size of the button; add <input type= “hidden” name=”hosted_button_id”
value= “FN5ZA36QM44WN”>
Sushi & Sashimi evening
For six guests $185.00 USD
credit-card logos; change the
<table>
<tr><td><input type= “hidden” name= “on0” value=”Sushi &: Sashimi
evening”>Sushi &: Sashimi evening</td></tr><tr><td><select Buy Now
language of the button; or name= “os0”>
change the wording to “Pay Select Code Go back to edit this button
v. Under the “Step 2” set of options, Japanese cookery classes at your home
add inventory details, if you wish. Permalink: http://www.alannahmoore.com/wordpress_walkthrough/ View Page Get Shortlink
Upload/Insert
vi. Go to “Step 3” and choose
Visual Text
b i link b-quote del ins img ul ol li code more lookup close tags proofread fullscreen
the customer’s postal address, < t r > < t d > < i n p u t t y p e = “h i d d e n ” n a m e = “on0” v a l u e = “S u s h i & a m p : S a s h i m i e v e n i n g ” > S u s h i & a m p : S a s h i m i e v e n i n g < / t d > < / t r > < t r > < t d >
< s e l e c t n a m e = “o s 0 ” >
< o p t i o n v a l u e = “F o r s i x g u e s t s ” > F o r s i x g u e s t s $ 185 .00 USD< /o p t i o n >
if you need them to give you < o p t i o n v a l u e = “F o r f o u r g u e s t s ” > F o r s i x g u e s t s $50 . 0 0 USD< /o p t i o n >
< o p t i o n v a l u e = “F o r t w o g u e s t s ” > F o r s i x g u e s t s $100 . 0 0 USD< /o p t i o n >
etc. Ignore the “Advanced <input t y p e = “image” s r c = “https://www.paypalobjects.com/en_US/GB/i/btn/btn_buynowCC_LG.gif” border= “0” name= “submit”
alt= “PayPal – T h e s a f e r, e a s i e r w a y t o p a y o n l i n e . ” >
< i m g a l t = “ “ b o r d e r = “ 0 ” s r c = “ h t t p s : / / w w w. p a y p a l o b j e c t s . c o m / e n _ G B / i / s c r / p i x e l . g i f ” w i d t h = “1” height= “1”>
variables” field. (See page 87 </from>
for notes on creating a “Thank Word count: 78 Last edited by admin on July 2, 2012 at 11:46 am
85
PayPal saves your buttons so you can create Choose a button type
similar ones for other products, which is a real Buy Now
time-saver.
Note: Go to My saved buttons to create a new button similiar to an exsisting one.
The different buttons, and payment Step 1: WHAT TYPE OF BUTTONS DOES PAYPAL HAVE?
Choosing a button
types, offered by PayPal. The Steps
Step 2:
in the column on the left offer helpful Creating a button Buy Now Add to Cart Donate
Step 5:
Buy Gift Certificate Subscribe Automatic Billing
Testing a button
86
87
The content of your site may be what’s really importance of your selling points; and so on. So,
important, but it is the theme that will bring it to it is essential that you choose the right theme in
life and create the image of your site—and you or order to create the best impression and convey
your business—that the world will see. your message effectively.
The theme controls not only the “look” of your The stunning quality of the themes available—
site —its colors, font, background, and so forth— and the sheer quantity of them—is one of the
but also the way the information is displayed: what joys of building your own website using WordPress;
you include on your front page; whether you use however, choosing exactly which one to use can
images in your header panel to bring home the be challenging.
88
89
The vast number of themes out there Other items to check for are: Themes in Use on Live siTes:
can make choosing the right theme > availability of different color
for your website bewildering. schemes, preferably unlimited
> multiple sidebars—allowing you
Here are some guidelines to to create different sidebar content
help you. for different pages (This can always
> Is the theme going to fit with what be done via a plugin, but you want
you actually need? For example, if to make it as straightforward as
you’re going to create a business- possible.)
type site that will be mostly > the option to upload your own
text-based, don’t be seduced logo (You might think this may be
into choosing a beautiful-looking obvious, but many free themes
theme that is designed primarily don’t allow for this.)
to showcase images—no matter
how gorgeous it looks. Before you make maximum
Becky’s Blissful Bakery is using “Boutique Theme”
> Will it display your content as you customizability a criterion, ask
from Elegant Themes
want it to be displayed? Don’t let yourself which options you actually (http://www.beckysblissfulbakery.com).
the theme layout determine how need. Many slightly older, and most
you arrange your content. You need free themes, may not offer a great
to display your message and the level of customization, but may be
rest of your content in the most perfect for your needs as they are.
suitable way for your website and
your business. Some other aspects to consider:
> How customizable is it, and how > Is it “responsive”? If a theme is
customizable do you need it to be? responsive, that means its format
The more recent premium themes will adapt to fit a cell phone. This is
tend to be more customizable, but not an absolute necessity, although
don’t assume they are—read the it is a current (and probably lasting)
descriptions carefully. trend. If in any doubt, check it out
> How much control does the theme on your cell phone to see if the
allow you to have? If you don’t want theme is legible. It may be that
the content displayed as it is on the you don’t actually need a
theme-demo home page, check responsive theme.
that you have control, or the degree > Do you want to run ads on your
of control you need, over the home site? Some themes do allow spaces
page layout. (This may be described for ads. If there is no specific ad
as a “drag-and-drop homepage space allocated on your theme, you
builder,” or more vaguely as will still be able to add ads in your
“multiple home-page layouts.”) sidebar as widgets.
Harley-Davidson in Barcelona is using
“Natural Theme” from Organic Themes
(http://www.espaciohd.com).
90
TIP
91
92
WordPress comes with a number free theme from another source: Media
Search for themes keyword.
Search
Create Your Own Website Using WordPress... New Howdy, Alannah Create Your Own Website Using WordPress... New
Dashboard
Dashboard Help Manage Themes Install Themes
Manage Themes Install Themes Jetpack
Jetpack
Posts Current Theme
Posts
Search | Upload | Featured | Newest | Recently Updated Twenty Twelve
Media
By the Wordpress team | Version 1.1
Search for themes by keyword. Links
Media
Pages The 2012 theme for WordPress is a fully responsive theme that looks great on any devi
Search
Links front page template with its own widgets, an optional display font, styling for post forma
Comments single views, and optinoal no-sidebar page template. Make it yours with a custom menu, he
Pages background.
Feature Filter Products
Settings
You can search the WordPress Free Themes directory directly from inside The “Live Preview” feature allows you to try out the
your admin area. themes before activating them.
93
94
U-design* (premium)
from internq7 (ThemeForest)
http://themeforest.net/item/udesign-
wordpress-theme/253220
95
porTfoLiUm (free)
from WP Shower
http://wpshower.com/themes/
portfolium imBaLance (free) shaken grid (free and premium
from WP Shower versions) from Shaken & Stirred
http://wpshower.com/themes/ http://shakenandstirredweb.com
imbalance
96
EXp
e
http://udthemes.com/studio8-wordpress-themes
PLOR
r Ii N G T
tHhE
eMmE
eS /// S
TUHB
EHME
EASD
: IPNOGR T F O L I O
sideswipe (premium)
from Graph Paper Press
http://graphpaperpress.com/themes/
sideswipe
edgeLine (premium)
from Dessign voLUmes (premium)
http://www.dessign.net/edgeline- from Themezilla (ThemeForest)
theme-responsive http://themeforest.net/item/
volumes-responsive-portfolio-
wordpress-theme/2311911
97
98
99
sLiding (premium)
from WooThemes
http://www.woothemes.com/2011/12/sliding
100
101
Now that we’ve had a look at some of the themes I’ve chosen this theme for the business section
available, we’re going to focus on one theme for because of its amazing flexibility—it can be
each of the “types” of website we are looking at customized to suit absolutely any kind of business.
in this book—business, portfolio, magazine, and You will see that you can purchase add-ons to
e-commerce. For each of the chosen themes, I’ll increase the theme’s functionality, however this
walk you through the steps necessary to set up walkthrough will use only the elements that you
and customize it to suit your own needs. are provided with when you install the theme.
Business theme
Adventurous readers will relish the high degree
of customization possible and will be able to allow
their creativity full rein when working with this
theme. Less technically savvy readers may feel
“Pagelines” (Lite) Theme confused when they see the sheer amount of
(free, with premium add-on options) by PageLines options available inside the admin area. Do not
http://www.pagelines.com be dismayed, however; the walkthrough will lead
The theme is listed in the WordPress Free Themes you step-by-step through the customization of
Directory, so it can be installed directly from inside the theme, allowing you to create a site just like
the admin area of your website. the one in the demo, and leaving experimentation
to those who feel like an extra challenge.
See the functioning demo of this theme at This theme can be translated into any language using
http://www.createyourwebsiteinaweekend.com/pagelines the Codestyling Localization plugin—see page 152.
102
of Create Your Own Website Using WordPress in a Weekend. To find out more about the This is a blog post
book, please click the orange button above, or This is another blog post
visit:http://www.createyourwebsiteinaweekend.com.
Home About
Workshops WordPress Training Website Design
Blog Services Learn to create your own website using One-to-one WordPress training. Whatever type of website you need, we can
WordPress in a one-day workshop. design and create it for you.
Contact
WordPress workshop dates (Paris) - 13th + 15th Nov & 20th + 22nd Nov (2 sessions) - let me know if you’re interested. http://t.co/1BCXvnFb
_ alannahmoore
Learn how to
build your own
website
If you can build your website yourself.
103
Recent Posts
“Page Background” blank, and
Hello world!
Recent Comments
1. Install the theme at Appearance selected white for my “Content
> Themes > Install Themes. Search Background.” I’ve also chosen to
Mr WordPress on Hello world!
Archives
Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!
Meta
Read Full Article →
2. Just as we did in the “First Steps” the footer text so that it is visible
Log in
Entries RSS
Comments RSS
WordPress.org
section for the default site (see against the light gray of the
page 37), adjust your site title and background. (It may be useful to
Sample Page
Global Content Width (px) Main Column Width (px) Sidebar1 Width (px) Content Percent (%)
104
11
Use draggable sections to control the design of your site’s templates.
You don’t need to complete the (these represent different menu 1. Select Template Area
content of these pages yet—for this choices but it is easiest simply Header
Wrap (Pro)
Page Templates
Morefoot (Pro)
Footer
want one—you don’t need to write entitled “Template 1” to the home Active Sections Available / Disabled Sections
anything here, just as in the default page; we’re now going to determine Branding Options
Boxes
Callout
Masthead
BrandNav
demo setup, as the system will put how that template is going to look.
Nav Classic Options
Hero
NavBar
automatically. While you’re in the Go to PageLines > Drag & Drop from
Pages area, you can delete the the left-hand navigation. You can see
“Sample Page” that WordPress that the header area (indicated in the
put in for you. screenshot) is colored blue, which
means we are editing the header
Now, in Settings > Reading, in the area of the home page. You have a
section labeled “Front page displays,” few different options here regarding
select the radio button next to “A the layout of your logo and your
static page,” and choose the Home menu. For my demo site, I have
page from the drop-down. If you’re chosen the “BrandNav” layout which
going to have a blog section on your puts my logo to the left and the
site, set the “Posts page” drop-down menu to the right—this suits my site,
to your blog or news page. If you as there are just a small number of
don’t want a blog page, leave this menu items. If you have a larger
105
Header
solid menu bar underneath it, for elements in the “Active Sections” box;
which you will be able to choose you may also, optionally, choose to
Wrap (Pro)
Page Templates
SB1 SB2
Content Area (Pro)
Morefoot (Pro)
Footer
from several color options; blue, add the “Hero” element, most likely
black, orange, etc. underneath the Quickslider, which
Editing → Site Header
I’ll talk about in a moment. Your
Global Scope
Boxes Masthead
the items you need from the right- the screenshot at bottom left, with
Branding
hand box into the “Active Sections” or without the “Hero” element.
Options
Callout BrandNav
Nav Classic Options
NavBar Options
want from the “Active Sections” box. 13. Fill in your home page content
(The selection being made in the on the home page editing page,
Global Settings Lite Edition
screenshot is the one corresponding if you don’t yet have any content
You Are Using PageLines Lite Edition to Option a above.) there. (Your home page content
Website Setup PageLines Lite is the free version of PageLines Frame
Upgrade to the Pro edition for more sections & options
will show up where you can see
Layout Editor
NavBar
Fixed NavBar - Select Theme
shown in the screenshot—the fixed
Advanced Black Transparent (Default) menu bar option is not available for 14. We now need to put some
Custom Code Standard NavBar - Select Theme the free version of the theme.) images into our slider; go to
Orange
PageLines > Page Options and
The default setting for the menu bar click the “Quickslider” box under
12
1. Select Template Area
Header
is to include a search box on the right. “Site Defaults.” Here, you can
If you want to remove this, scroll a configure the number of images
Wrap (Pro)
little further down the page until you you want to show in the slider,
Morefoot (Pro)
Footer
For Which Type of Page? see a checkbox labeled “Standard and a number of other settings,
NavBar—Hide Searchform?” and such as including an arrow,
Template | Default Template | 1 Template | 2 Template | 3 Template | 4 Template | 5
Editing → 1 Page Template Area check the box. Click “Save Options” setting the slider to transition
2. Arrange Selections in Area With Drag & Drop
and see how your new menu bar automatically, and so on.
now looks.
Active Sections Available / Disabled Sections
Hero
Content Options
12. Now that you have your menu upload the images; you will need them
Masthead
Boxes Options
looking the way you want it, we all to be the same height. You can
are going to continue customizing size them to any dimensions you like,
106
Media Library, scale to 930 width, 16. Now let’s look at the boxes at Slide Image
crop to 930 x 320, and save. Then the bottom of your home page.
http://www.alannahmoore.com/wordpressdemo/wp-content/uploads/2012/11/websites.jpg
add them to the slider using the These are a great way of drawing
“Select from Library” button. (If attention to the services your
your slider images are already the business offers; you don’t need to
Image Alt
desired size, you can upload them have just three, you can have as
directly to the slider area using the many or as few as you like. Create
Slide Text
add text to your slider images and the box content editing page. Slide Text Location
if you like, link the slider images to Note that as with the slider images, Template Setup
pages on your site. you will need your box images to be 17 Drag & Drop Template Setup
Use draggable sections to control the design of your site’s templates.
Note: If you can’t see as many places neat on the page (the system will Header
Wrap (Pro)
to upload slides as you have specified, automatically take care of the width).
Page Templates SB1
Content Area SB2
(Pro)
Morefoot (Pro)
click “Save Options” and they will The easiest way of doing this is to
Footer
become visible. choose a size for them all and scale Editing → Site Header Global Scope
and crop them to this size from within Active Sections Available / Disabled Sections
Click “Save Options” when you have the Media Library (I sized mine to TwitterBar Options
Hero
finished configuring your slider. 600 x 448 px). When you have Simple Nav Options
15. The “Hero” element is the boxed- the “Save Meta Settings” button.
out area you can see on the live
demo site where I talk about this Next, select the “default-boxes”
book and show the cover. Including checkbox in the “Box Sets” area
this section won’t be suitable for just below the blue “Publish” button, 17. The last part of the page
all kinds of business, but for some, and then click “Publish.” When you layout that we need to set
it will be the ideal way to showcase have created your boxes, delete the up is the footer area. Click
a special offer or event, and you example boxes from the Boxes > PageLines > Drag & Drop
can even, optionally, include a Boxes area. and then select the footer
striking button to make your area of the template; drag
special content really stand out. Now, go to PageLines > Page Options the “TwitterBar” and “Footer
> Site Defaults area; click on the Columns Sidebar” elements
If you want to use this element, “Boxes” box. Here is where you can into the “Active Sections” box.
you can configure it in the PageLines configure your boxes as you’d like (You may, or may not, want to
> Page Options > Site Defaults area, them to appear. I’ve set mine to have include the “TwitterBar;” we will
as you did for the slider; click on the image appear on top, with the talk more about Social Media
the “Hero Unit” box instead. When image size at 280 px, with a frame, in Chapter 9, so don’t worry if
you have finished inputting your ordered by Date, in ascending order. you’re unsure at this stage if this
content and choosing how you’d Save your settings when finished. will be appropriate for you.)
107
Wrap (Pro)
Morefoot (Pro)
Footer
layout of the home page, we also When entering your page content,
Which Content Area Type?
need to configure the layout of remember that we have configured the
Template | Default
Blog Post
Template | 1
Blog
Template | 2 Template | 3 Template | 4 Template | 5
the blog page. If you look at your settings so as not to have page titles
Editing → Blog Content Area
blog page now, you will see a mini appearing automatically—this is to
2. Arrange Selections in Area With Drag & Drop
version of your front page slider prevent “Home” or other text appearing
appearing at the top of your very prominently on the front page, which
Active Sections Available / Disabled Sections
Boxes Masthead
PostLoop Options
Callout Content Sidebar
blog posts. If you are happy with
to create a page heading for each page
QuickSlider Options
108
theme
Avriar Graphic Design
Components of a book into a coherent whole. Front matter,
or preliminaries, is the first section of a book, and is usually
the smallest section in terms of the number of pages.
Incorporating the content, style, format, design, and sequence
of the various components of a book into a coherent whole.
Front matter, or preliminaries, is the first section of a book,
and is usuallythe smallest section in terms of the...
This theme is not responsive but Copyright 2011. All Rights Reserved. Design & Developed by Dessign.net
Visual
Home About Facebook Twitter
Portfolio Blog
demo of this theme at: http://www. This is an example site using the Visual Theme
createyourwebsiteinaweekend.com/visual
This is a dummy site set up to show readers of Create Your
Website Using WordPress in a Weekend how the Visual
Theme by Marios Lublinski of Dessign can be set up. Visual
Theme is a free, minimalist portfolio theme that can be used
by any kind of creative - designers, illustrators
photographers, artists, architects; download the theme
at http://www.dessign.net. In case you have come across
this site via the ...
install your own language version of Copyright 2011. All Rights Reserved. Design & Developed by Dessign.net
109
110
7
Dashboard
Add New Page
right of the page-editing screen, Posts
Publish
Media
Plugins
Page Attributes
Tools Parent
Order
Path: p Need help? Use the Help tab in the upper right of
Featured Image
Set featured image
and create a new menu called To create a custom menu, give it a name above and click Create Menu. Then choose
“header_menu.” items like pages, categories or custom links from the left column to add to this menu.
111
platforms you use (e.g. Facebook, This is a dummy site set up to show readers of Create Your
Website Using WordPress in a Weekend how the Visual
Theme by Marios Lublinski of Dessign can be set up. Visual
Theme is a free, minimalist portfolio theme that can be used
Twitter, Google+, etc.) with the by any kind of creative - designers, illustrators
photographers, artists, architects; download the theme
at http://www.dessign.net. In case you have come across
this site via the ...
11 Posts
Edit Post Add New
will go where (see the screenshot at All Pages Abstract background Publish
top right).
Add New
Permalink: http://www.alannahmoore.com/visual/abstract-background/ Edit View Post Save Draft
Preview Changes
Categories Get Shortlink
Tags Status: Published Edit
Upload/Insert Visual HTML
Media Visibility: Public Edit
Comments
Users
Categories
Settings Blog
the site, but the six most recent blog Allow comments
Allow trackbacks and pingbacks on this page.
112
113
structure theme
theme HOME ABOUT CONTACT
by Organic Themes creAte Your WeBsite this site is An eXAmPLe site usinG structure theme
in A WeeKenD
http://www.organicthemes.com/
theme/structure-theme structure theme
eXAmPLe PAGe
Even the free version of the “Structure” theme looks great on a smartphone or tablet.
You can see the functioning demo of this
theme at: structure theme structure theme
http://www.createyourwebsiteinaweekend.
com/structure eXAmPLe PAGe creAte Your WeBsite in A WeeKenD
structure theme
eXAmPLe PAGe
Premium version of iLLustrAtive DesiGn BY JuLie West this site is An eXAmPLe site usinG structure theme
“structure theme”
The premium version of this theme offers
an image or video slider at the top of the
page, which enables you to display more creAte Your WeBsite usinG WorDPress
iLLustrAtive DesiGn BY JuLie West
than one featured post, multiple page
in A WeeKenD-out sPrinG 2013
114
5 Custom Header
theme from the Organic Themes Header Image
free_v3.” Remove Image This will remove the header iamge. You will not be able to restore any customizations.
115
Appearance
Create Your Website in a weekend Choose the page title you wish to display as the
featured headline.
different from the gray of the menu.
Themes Featured Article Category It’s also crucial that your chosen
Widgets
Menus Structure Theme Choose the category you wish to display in the background doesn’t render the
homepage featured section.
Theme Options
Header
Home Blog Category
writing too difficult to read.
Background
Editor Choose the category you wish to display for the
Blog
homepage blog posts.
Plugins
7. Now, for some of the more
Users Home Blog Posts Displayed
Tools
Enter the number of posts you would like displayed
advanced customization: first,
3
Settings
in the homepage blog. Pagination occurs after
entered number of posts. you need to decide if you want to
include the large heading on your
Collapse menu
Home Sidebar Catergory
Editor’s Picks Choose the category you wish to display for the
featured homepage sidebar posts.
site (1, left). If you do, you need to
Home Sidebar Posts Displayed create a page (Pages > Add New)
3 Enter the number of posts you would like displayed
in the featured homepage sidebar.
using the page title you want to
appear on the home page. You will
The “Theme Options” area of the “Structure” theme admin. also need to create content for
that page to go with the title, as
the title will be clickable, meaning
8
that visitors will be able to go to
structure theme the page.
1
HOME ABOUT CONTACT
116
117
(again, it should be a title that Options” area allows you to make menu (Appearance > Menus).
makes sense to your viewers). some color changes to the As with the demo site, first create
different kinds of links on your a menu, which you can name
You can, of course, assign existing site; if you make any changes, whatever you like, and then save
blog posts that already belong to click the button, as usual, to it. (There is no need to assign the
the previous category to the new save them. menu to a certain position on the
category, but this will cause some page, as we did with the demo
repetition on the home page, as the site, so you can just ignore the
same posts will appear in the main “Theme Locations” box on the
area as to the side. menu page.)
118
14 Dashboard
Widgets
Screen Options Help
Themes
Categories Custom Menu
your site to create the home page.)
Widgets
Menus A list or dropdown of categories Use this widget to add one of your custom
menus as a widget.
Theme Options
Header Home Sidebar Left
Links Meta
Background
Note that with this theme, you do Editor Your blogroll Log in/out, admin, feed and WordPress
links
Home Sidebar Right
Plugins
not need to create a “Blog” page Users Pages Recent Comments Left Sidebar
Your site’s WordPress Pages The most recent comments
Settings
Right Sidebar
Recent Posts RSS
posts inside the Settings > Reading Collapse menu The most recent posts on your site Entries from any RSS or Atom feed
Footer Left
A search form for your site Your most used tags in cloud format Footer Mid Left
The “Structure” theme gives you various options to display your widgets
in different positions.
119
theme Mystile
This is a demo e-commerce
site
£0 Search Products
products/mystile
Featured Products Featured Products
Product Categories
professional e-commerce theme Wall cabinet Wooden chair Turquose chair Two
glass lamps
Cart
Mystile
Mystile
Recent Products
Featured Products
Recent Products
120
5 Dashboard Help
theme for you; however, you need WooDojo WooDojo 1.5.0 POWERED BY THEMES
it to be zipped, so zip it again by Posts WooDojo is a powerful toolkit of features to enhance your website. Select only the functionality that you need, without unnecessary code. Enhance your
website with WooDojo, today.
Media
right-clicking on the “Mystile” folder Pages All (16) | Bundled Features (8) | Downloadable Features (4) | wordPress Plugins (4) Open All Close All
Plugins
Appearance > Themes > Install
The WooDojo Custom Another classic
The WooDojo HTML WooDojo feature,
Code feature adds the Upload/Insert
Users term description
facility to easy add WooDojo- Login
3. You will see a screen full of WooDojo - ShortLinks 1.0.3 WooDojo - Social Widgets 1.1.2 WooDojo - Tab Grouping 1.0.1
but before we look at these, notice WooDojo- ShortLinks online social profiles. order. Popular
automatically Comments
generates short URLs Activate Activate
121
8 Dashboard
Media VIEW CHANGELOG VIEW THEMEDOCS VISIT FORUM Save All Changes
Subscription Settings
grey.css
Select your themes alternative color scheme.
Theme Options
Display Options
these steps:
WooCommerce
Dynamic Images
Products Site Description
Footer Customization
Plugins
Quick Start. Here you can adjust Users
Advertising
Custom Favicon
Contact Page
the color with the “Theme
Upload a 16px x 16px ico image that will
Tools Upload
represent your website’s favicon.
Settings
122
I N F O C U S / / / e - c ommer c e T H E M E
image. You can choose whether to vii. You do not need to change this once you have read the
have a large image visible at the top anything on the “Dynamic “Search Engine Optimization”
of the home page, as on the demo Images” tab. pages in the next chapter.
site—if so, check the box labeled viii. “Footer Customization” allows Alternatively, you can use the All
“Display a banner on the home you to decide how many columns in One SEO Pack plugin that we
page?” then upload your image you’d like to display in the footer will look at in detail; if you prefer
and decide what wording (if any) area. You can also choose to to use this, you will need to check
you want to add to run across it. replace the default left and right the box labeled “Use 3rd Party
Ideally, the image should not be text at the bottom of the page Plugin Data.”
too high, as a very large image will with your own text. Since this is xiii. The last thing you will want
take up a disproportionate amount a free theme, I have decided to to look at inside the Mystile
of space on your home page. leave the “WooThemes” credit; configuration area is the
however I did choose to include “Sidebars Manager.” “Mystile”
Note: when choosing or taking a an affiliate link in the “Custom allows you to create different
photograph for this space, bear in Affiliate Link” field (you can sidebars, to which you will then
mind that you will have to crop it sign up as an affiliate on the be able to add widgets (inside
into a horizontal rectangle. WooThemes site, meaning that the Appearance > Widgets area).
if anyone makes a purchase Here, I have not set up custom
The “Sidebar,” “Products,” and following clicking on the link on sidebars on the demo; however,
“Blog” tabs allow you to decide your website, you will get a cut you may find them useful—for
what content you will display on of the sale). example, to show different
your home page. You can come ix. In the “Subscribe & Connect” widgets to the side of your blog
back to this later once you have area, you can set up the social pages than those you will show
added some products to your store media links to put in your sidebar on your “Products” pages.
and have some fun playing around as a widget; you can also ask your
with the different options. visitors to subscribe to your You do not need to make any changes
MailChimp newsletter (see to any of the other areas within the
Here, I have included two blog Chapter 9). Mystile configuration area.
entries on the front page of the x. I suggest you skip the “Advertising”
demo site; including blog posts on tab, because it makes no sense to
your home page may not be suitable include Google or any other ads
for all types of e-commerce sites, but on your own online store. (Why
it can be a good way to add some would you want to drive potential
personal interest to the front page of customers away from purchasing
an online store, which can otherwise your products?) But if you did
look a bit dry—it will help this page wish to run ads on your site, here
look more dynamic. is where you would put the code.
xi. Finally, under the “Contact” tab,
vi. U
nder the “WooCommerce” tab, you can put your email address
you will have the same “Products” for the built-in contact form on
screen as appears under the the contact page you will set
“Home” tab, but there is also up shortly.
another screen that allows you xii. In the main navigation, under
to choose whether or not to have the “Mystile” tab, there is an
sidebars appearing on your “SEO” menu item; you will
123
9 Dashboard
General Catalog Pages Inventory Tax Shipping Payment Gateways Emails Integration
to WooCommerce > Settings. WooDojo
WooCommerce is a full-featured
Pages
Currency US Dollars ($)
Comments
plugin that allows you a wealth Feedbacks Allowed Countries All Countries
Mystile
Localisation Use informal localisation file if it exists
Orders
Checkout and Accounts
your online store, such as inventory Reports The following options control the behaviour of the checkout process and customer accounts.
Coupons
Checkout Enable guest checkout (no account required)
Settings
Users
Registration Allow registration on the checkout page
Allow registration on the “My Account” page
Register using the email address for the username
Settings
Customer Accounts Prevent customers from accessing WordPress admin
Clear cart when logging out
documentation (see the web address Collapse menu Allow customers to repurchase past orders
set your country-specific elements Media VIEW CHANGELOG VIEW THEMEDOCS VISIT FORUM Save All Changes
WooCommerce Enable text-based Site Title and Tagline. Setup title & tagline in General Settings.
124
Jetpack
Edit Product Add Product
42–45 for the demo site).
WooDojo
Posts
Feedbacks
Add Media Visual HTML Status: Published Edit
(Products > Categories); you can
Visibility: Public Edit
Mystile
A longer description can go here. Published on: Sep 1, 2012 @ 16:37 Edit add an image for each category,
then create the products (Products
WooCommerce Catalog visibility: Catalog/search Edit
Products
Copy to a new draft
Products
Add Product
Move to Trash Update
> Add Product), assigning them to
Path: p
Categories
Tags
Word count: 5 Draft saved at 9:09:49 pm. Last edited by admin on September 2, 2012 at 9:08 pm
Product Categories the correct categories. When adding
a product, use the “Featured Image”
Shipping Classes All Product Categories Most Used
Attributes
Product Data – Simple product Virtual: Downloadable:
Furniture
box for the main image (on the right-
General Taxes Inventory Shipping Related Products
Appearance Accessories
Plugins Attributes Advanced
Users
SKU
hand side of the screenshot). You can
add a description of the product in
Tools
Settings
Regular Price (£) 1,500
Collapse menu
Sale Price (£) 1,320 Schedule
the regular editing box, a short
+Add New Product Catergory
description in the “Product Short
Weight (kg) 0.00 Weight in decimal form
Visual HTML
Choose from the most used tags additional photos or even a photo
Upload/Insert
Featured Image
gallery (in the same way as you
Short description goes here.
would add an image gallery to
a blog post—see page 64).
Path: p
Reviews
Add comment
It’s useful to know how to set a
No comments yet.
Remove featured image
product variation (for example,
Mystile Custom Settings different colors or sizes). First, select
General Settings SEO
“Variable Product” from the drop-
Layout
125
Now, create the other pages needed you can title “Primary” and “Top.”
for your site (e.g. “About,” “Blog,” Assign these to the correct locations
You can select a product as “Featured”
“Contact,“ “Privacy,” and “Terms & in the “Theme Locations” box to the
by clicking the star that appears next to
it in the “Products” view (as shown on Conditions”). When you create your left. The smaller menu that runs
the screenshot). As you would with a blog “Blog” page, don’t forget to assign it along the top of the page will be
post, you can also make quick edits by the blog layout, which you do in the ideal for “Terms & Conditions” links,
hovering over the space underneath the “Page Attributes“ box at the same whereas the main pages of the site,
product title with your mouse, and clicking time you create the page (it’s down together with the store links, will go
the “Quick Edit” link. at the lower right on the editing into the main menu.
page). The same goes for the
“Contact” page—this has a layout Scroll down the page a little to look
incorporating a form created at the “Pages” box on the left. Here
especially for it, which you select you will see the pages you have just
11. After you’ve added your products, in the same way from the “Page created, together with the store
the next step is to set up your Attributes” box. pages WooCommerce created for
pages and then make them visible you. You may not want all of these
on the site by attaching them Note: it will reduce the likelihood to appear in the menu—the choice
either to the main menu or to a of canceled orders if you can add a is yours. As we did with the demo
small menu at the top of the site. telephone number to your “Contact” site, check the pages you want to
page, as well as a visible email address, include and then add them to the
First, let’s look at your pages. Go to as we did with the demo site, using menu by clicking the button. In the
Pages > All Pages; you will see that the Email Protector plugin. screenshot (facing page), you can
WooCommerce has automatically see how I chose to arrange the
created a number of pages for you Once you have created these pages, pages on the main menu in the
that relate to the functioning of the you can assign them to the correct demo store, which may help you
store. You may not want to include menus so that they show up on the as a guideline; you may wish to
absolutely all of these in your store; site. Go to the Appearance > Menus include different store pages,
we’ll see about that in a moment. area and create two menus, which or to arrange them differently.
126
127
128
1
website:
The most obvious way for people Google Search I’m Feeling Lucky
your site for the search engines Search About 1,000,000,000 results (0.31 seconds)
Images
Book B&Bs in Paris - The Unique Alternative To Hotels. 10500 Hotels in France
www.airbnb.com/Paris www.booking.com/France-Hotels
Videos Paris B & B s From $60/Night! Book your Hotel in France online.
3
Google AdWords. These are the Home Campaigns Opportunities Tools and Analysis Billing My account
adverts you see at the top and Welcome to AdWords! Learn more
on the right-hand side of Google Create your first campaign Getting Started with Google AdWords
Getting started
when you conduct a search; you 1. Choose your budget
a person clicks on the advert to 3. Select keywords that match your ads to potential customers
Common questions
Click,” or “PPC.” This can be a very Choose one of the following and get started with the full range of AdWords
features
•
•
Where will my ads appear?
How much does AdWords cost?
• How do I choose a budget?
your site, and you can specify your Search help center Go
129
130
131
132
133
Your Subscriptions
Subsriptions
integrate your blog subscribers with Settings
134
Jetpack
Site Stats
plugin that comes with Jetpack. It Posts
Media
how many visitors you’ve had each Links
You’re fueled up and ready to go.
day; if they’ve been referred from Pages The features below are now active. Click the learn more buttons to explore each feature.
Comments
Plugins
Tools
most popular.
The Jetpack “Stats” plugin.
If you want more detailed information,
such as where your site visitors are WordPress Walkthrough 21 New Howdy, admin
Dashboard
located and what time of day they Jetpack
Stats for September 18, 2012, 10:56 am WordPress Walkthrough (Dashboard)
Posts
Media
Links
Pages
Comments
Products Aug 29 Aug 31 Sep 2 Sep 4 Sep 6 Sep 8 Sep 10 Sep 12 Sep 14 Sep 16 Sep 18
Feedbacks
Appearance 24 0 8
views all-time views today views on your busiest day. August Summary Tables
Plugins 13, 2012
Users
Tools
Referrers Top Posts & Pages
Settings
Today Yesterday Summaries Today Yesterday Summaries
Collapse menu
No referrers. A referrer is a click from another site that links to yours. No top posts or pages. This panel shows your most viewed posts and
pages.
Subscribe2
Subscriptions
Followers
135
website, providing the required Enable enhanced ad features and an improved experience with AdWords, AdSense and other Google products by sharing your website’s Google Analytics
data with other Google services. Only Google services (no third parties) will be able to access your data. Show example
User Agreement
3
with “UA-” (as indicated).
Alannah Moore - http://www.alannah...
Home Standard Reporting Custom Reporting Admin Help
Alannah Moore [DEFAULT]
Application Tracking
to you.
Search.
Website Tracking
Property Name Alannah Moore
6
Settings.” You’ll now be able to
Home Standard Reporting Custom Reporting Admin Help
Mobile
Visits
140
visitors). Custom
Visitors Flow
70
Advertising
Content
1,692 people visited this site
Conversions
Visits: 2,463
Help
The Visitors Overview Report Unique Visitors: 1,692
Comparing Metrics
Pageviews: 7,270
Using the Interactive Table 60.78% New Visitor
1,497 Visits
Common Report Controls Pages/ Visit: 2.95
Video: Add Advanced Segments 39.22% Returning Visitor
Google and the Google logo are registered trademarks of Google Inc., used with permission.
136
Y O U R L I V E S I T E / / / S E A R C H E N G I N E O P T I M I Z AT I O N ( S E O )
What you can External
do on your site Factors
The wording of
your site pages needs Traffic
to contain the right
keywords
Your Site
1 in the 3
search Marketing
engines
Do the technical
part properly—use Links in
the All in One SEO
Pack plugin
2 3
Search Engine Optimization (or the key words and phrases for they need to be—I’ll explain how
“SEO,” as it is most commonly which you will concentrate on to configure this. These two areas
known) is, in a nutshell, what you getting a good ranking for your concern what you can actually do
can do to make sure your site gets website. These need to be on your website to prepare it for the
the best possible position in the incorporated into the actual text search engines.
search engines. SEO has evolved that appears on your web pages.
into a vast and complex science all The third area deals with the external
of its own; I won’t be able to cover Secondly, there are a number of factors that will impact your site’s
all the ins and outs here, but I will technical points you need to pay ranking in the search engines. You
tell you the basics of what you need attention to, concerning these key may have less control over these
to know, and show you how you can words and phrases and the way external factors, but the way you
prepare your site to best advantage. you describe your website pages market your website will have a
for the search engines. Luckily, serious impact.
This section is divided into three a plugin will help you make sure
parts. Firstly, you need to identify you have these set up the way
137
webmaster can do to ensure a good number of websites to compete with, less-important keywords for the
position, and you can’t buy a good and that you would stand very little secondary pages on your site—for
site ranking—the best you can do for chance of coming up high enough example, to continue with the
your site is to make it as interesting in the listing to get any site visitors previous example, the site owner
and engaging as possible, fill it full at all. However, if we try to be a bit might create a page listing activities
of relevant and useful content, and more specific by typing “B and B in and around their area, and choose
follow the advice in 1–3 below. Normandy,” we can see that the the following key phrases to focus
number of competitors gets much on: “Activities on the Normandy
1. Optimizing your pages with more reasonable—at 2,950,000, Coast” and “Things to do around
your key words and phrases though, this is still pretty challenging. Etretat.” These pages may attract
The actual text that is on your visitors, and they’ll also boost
website pages is one of the major “B and B Normandy Coast” has the position of the site as search
things the search engines look at a smaller number of sites listed for engines will comprehend the pages
when they are trying to classify your it—1,440,000—and if we are just a as worthwhile and relevant material
website. You therefore need to make little more specific, we’ll find that in the same broad area of interest.
sure your pages contain the words “B and B Etretat” has even fewer
and phrases people will most —308,000 sites are returned. So in
logically use to type into Google, this case, I consider that concentrating
or another search engine, if they on both “B and B Normandy Coast”
are looking for a website such as and “B and B Etretat” would be a
yours. These are referred to as good strategy. We would hope to
keywords or key phrases. catch people looking more generally
for somewhere to stay along the
To work out what keywords you Normandy coast, as well as people
should focus on for your site, do who already know precisely where
some brainstorming with a pen and they want to stay.
paper to come up with a list of the
words and phrases you yourself You could also get a little bit
might use if you were searching for creative and think of other ways
a site like yours. But there’s a catch. to catch potential visitors—for
You can’t be too generic, as the example, if you Google “Weekend
internet is a crowded place. If you break in Normandy,” you will find
show up on page ten of Google, 260,000 sites listed, so it may
people won’t find you, so you need be worthwhile including this key
to choose keywords that are neither phrase as well.
too much in demand, nor so obscure
that only a tiny number of people When you have worked out your
will be looking for them—that way, keywords, take a look at your page
you might find yourself at the top of text and see how you can rework it.
the list, but attract only a handful Your major keywords need to be at Don’t “stuff” your page text full of
of site visitors. the top of your home page, preferably keywords in a way that makes your text
in a title, and repeated in the body of read bizarrely—there is nothing that will
Let’s take an example: if you type the text a couple more times too if annoy or alienate your site visitors more
“B and B France” into Google, there possible without it reading strangely.
than this.
are 1,360,000,000 results. I would Focus on your major keywords for
138
Images
750 Hotels in Normandy -Lowest price guarantee Beat Normandy B&Bs
www.booking.com/Normandie-Hotels - 1,018 seller reviews www.housetrip.com/Normand
Videos Book your Hotel in Normandy online Beautiful B&B Alternatives! Pl
762 552 people + 1’d o r follow Booking.com & Reviews. Book Now From 3
News 106 people + 1’d or follow
Most Popular Hotels Best Reviewed Hotels
HouseTrip.com
Budget Hotels Luxury Hotels
Shopping
Google gives you some suggestions for keywords and phrases as you type in your search item—it’s worth checking these out.
Google and the Google logo are registered trademarks of Google Inc., used with permission.
139
140
Y o U r L I v E s I t E / / / S E A R C H E N G I N E O P T I M I Z AT I O N ( S E O )
You’ve now done what you can do to prepare
Click on option titles to get help!
your site for the search engines, as far as the
I enjoy this plugin and have made a
donation:
site itself is concerned. But there are two other
Plugin Status: Enabled major factors that determine how your site will
Disabled
be ranked:
Home Title:
> how much traffic it gets
Home Description: > how many relevant inward links it has
(that is, other people mentioning your
Home Keywords (comma
separated):
site on their website and linking to it)
Canonical URLs:
How much traffic you can send to your site at
Rewrite Titles:
the outset depends on how much traditional
Post Title Format: %post_title% | %blog_title%
and word-of-mouth marketing you can do;
Page Title Format: %post_title% | %blog_title%
trying to achieve inward links from other sites
Category Title Format: %category_title% | %blog_title%
in the same broad area as you is also essential—
Archive Title Format: %date% | %blog_title%
it sends Google the message that your site is
Tag Title Format: %tag% | %blog_title%
recognized by others, and therefore deserves
Search Title Format: %search% | %blog_title%
a good ranking.
Description Format: %description%
404 Title Format: Nothing found for %request_words% At the beginning, you may only have a little
Paged Format: - Part%page% traffic and just a few inward links, but with
SEO for Custom Post Types: consistent promotion, you will see both
Custom Post Types for SEO Column:
Support:
Page
wpsc-product
increase, and will be able to watch your
wpsc-product-file
slideshow site moving up in the rankings.
Google Plus Profile Sitewide Default:
141
“Social media” is the label given to I’m assuming that you’re already Which social media you choose to
a group of web-based “tools” that familiar, at least to some extent, with use will depend on the kind of world
allow users to share and exchange the broad concept of social media— you’re in; here we’ll look at the six
information and ideas with a network Facebook and Twitter, for example, most-used social media, but there
of other users. are regularly mentioned in the are others that may suit you as well
mainstream media. But even if you (see the box on page 145 entitled
Social media provide fabulous feel that social media really isn’t your “Other Social Media”).
communication tools for the thing, I do suggest you consider it if
website owner, enabling you to: only for website promotion purposes.
> reach more people This section will look at how social
> remind them about you media can be used specifically for
> engage with them more fully this and integrated into your website.
Keeping in touch:
if someone “likes” or “follows”
you, you can reach them again
Social
media &
YoUr
wEbsItE
Promotion: Repurpose
by “liking” or “following” you, your content:
people spread the word about you;
they can also come across you if you put your website content
accidentally, e.g. on YouTube on social media, or your social
or StumbleUpon media content on your website,
you can introduce your content
to a different audience
142
Help center
143
REBELMOUSE you can establish yourself as an Adding a Pinterest button to your site
RebelMouse authority in your domain and gain Log into your Pinterest account.
(http://www.rebelmouse. a following of fresh new site visitors Go to http://pinterest.com/about/
com) incorporates your who would never have come across goodies/; scroll down until you see
Facebook, Twitter, Google+ (and you otherwise. Of course, whether the “‘Follow Button’ for Websites”
other) posts into one “front page” this is a suitable means of promoting heading. Choose the button you want
that resembles a Pinterest pinboard. your site will depend on what it is on your site and copy the code. Back
The RebelMouse WordPress plugin you do. To create a YouTube account, in your admin area, go to Appearance
gives you a tall, thin sidebar widget sign in at http://www.youtube.com > Widgets and drag a text widget
perfect for the blog pages of your with your Google account (or create into your sidebar. Paste the code into
site, or lets you create a page that one by clicking “Sign In” then “Create it and save the widget. You can also
you can easily incorporate into an account”). use the “Social Media Icons Widget”
your site. for Pinterest; the “Social Sharing
You can put a button that links to your Toolkit” plugin is also very useful (see
YouTube channel in your sidebar using opposite), allowing you to easily add
LINKEDIN the “Social Media Icons Widget,” or “Pin it” buttons to your pages.
LinkedIn is mostly for you can embed your videos directly
professional networking, but if your into the site. GOOGLE+
site is a presentation of you and your Whether you choose to
professional skills, it may be useful to PINTEREST include Google+ depends
include a button on your site that will Pinterest has become on whether you think your visitors
take visitors to your LinkedIn profile. a huge phenomenon; will be using it, but along with the
To get a LinkedIn account, sign up if your site is artistic or creative, rest of the suite of Google tools, it’s
here: http://www.linkedin.com. you will have a lot of fun creating definitely here to stay.
“pinboards” of images you like and
Adding a LinkedIn button to your site allowing users to interact with them Integrating Google+ into your site
Log into your LinkedIn account; go to by commenting, “liking,” or “repinning” Go to https://developers.google.
http://www.linkedin.com/profile/ your images to their own boards. To com/+/plugins/badge/; fill in your
profile-badges. Choose which button sign up with Pinterest, either go to Google+ web page address and
you want to use, and then copy the http://pinterest.com, or sign up for a choose how you’d like your button
code in the box next to it. Go to your business account at http://business. to appear. Copy the code. On your
Appearance > Widgets page and drag pinterest.com. Widgets page, drag a text widget
a text widget into your sidebar. Paste into your sidebar; paste the code
in the code and save the widget. For business sites, you’ll need to into it and save the widget.
Alternatively, use the “Social Media verify your site. Choose the option Google and the Google logo are registered
Icons Widget” (see opposite). to “Verify with a meta tag.” Copy the trademarks of Google Inc., used with permission.
144
Include all your buttons in your sidebar In the “Sharing” area, you can also see how, using the Jetpack “Publicize”
at once feature, you can integrate your blog posts with other social media so that
The “Social Media Icons Widget” is a useful each time you post on your blog, your material also appears on the selected
plugin that allows you to add all your social social media.
media buttons to your sidebar simultaneously.
All you need to do is install the plugin via
the Plugins > Add New area, then drag the
widget to your sidebar in the Appearance > Create Your Website Using WordPress in a.. 4 New Howdy, Alannah
Jetpack
Help
Media
Notifications Publicize WordPress.com Stats Jetpack Comments
Pages
Monitor and manage Connect your site to Simple, concise site A new comment
Comments popular social stats with no system that has
your site’s activity
and Pinterest “Pin it” buttons from the posts and comments
to recieve a
galleries into an
immersive full-screen
your personal email
account.
interwebs. Share
content with
same interface. Create Your Website Using WordPress in a.. 4 New Howdy, Alannah
Users
Settings
> Flickr
> Reddit Enabled Services
Facebook Twitter Pinterest
Services dragged here will be hidden behind a share
Services dragged here will appear button.
> Instagram
> Tumblr
The Jetpack “Sharing” plugin.
145
Legal issues
You may or you may not be doing business from Cookies
your website; however, there are certain rules all New laws concerning cookies (text files that contain
websites need to comply with, and you will need information—usually a site name and unique user
to make sure you are aware of these from the ID) and other web-tracking tools have recently been
outset. In addition to general business regulations, enacted in the EU, so if you are doing business
take care to check out specific rulings concerning with any of the affected countries, you will also be
online business—as noted below. liable to comply with these laws. (See this link for
some useful information: http://www.ico.gov.uk/
Privacy policies for_organisations/privacy_and_electronic_
Specific laws, depending on which state or region communications/the_guide/cookies.aspx)
of the world you are in, demand that you publish a
privacy policy declaring—among other elements— You may think your site doesn’t use cookies, but
how you collect data from your website visitors and if you are using Google Analytics or running any
what you plan to do with it. Make sure you stick to advertising, it does—therefore, you will need to
these rules, as you don’t want to be accused of find out which laws (federal, state, and international)
violating the privacy of site visitors (see SBA’s apply to your website or business, and make sure
website: http://www.sba.gov/community/blogs/ you include a way to obtain users’ consent on your
community-blogs/business-law-advisor/creating- site. A simple statement may be adequate, but make
privacy-policy-your-online-business). sure you check out the particular recommendations
that apply to where you live.
146
TIP
The SBA website (http://www.sba.gov) is a good place to find out about business,
federal, and state law and regulations for U.S. citizens or residents.
TIP
147
legal requirements
If you are doing business from your
website, you need to research all of
the legal requirements relevant to
your type of business—you may also
need a business license and permit
to work from home. Take note that
as well as varying from country to
country, these rules can also be
different from state to state. If you
are doing business with other
countries, you will also need to
ensure you adhere to international
trade laws (for more information,
visit: http://www.hg.org/trade.html).
148
uPdating WordPress
WordPress is constantly being
tweaked and improved, so it makes Create Your Own Website Using WordPress... New
Dashboard Help
WordPress Updates
Jetpack
You have the latest version of WordPress.
Updat ugins
Appearance
Users
Select All
It’s also easy to update
All in One SEO Pack
Settings
You have version 1.6.14.5 installed. Update to 1.6.15.1. View version 1.6.15.1 details.
Compatibility with WordPress 3.4.2: 100% (according to its author) plugins, but you need to
make sure everything
Google Analytics for WordPress
case anything goes wrong—see Compatibility with WordPress 3.4.2: 100% (according to its author)
Select All
an update.
“Backing up” below.
149
Dashboard
XML Sitemap Generator for WordPress 3.2.9
Jetpack
Media The sitemap wasn’t built yet. Click here to build it the first time. Plugin Homepage
If you encounter any problems with the build process you can use the debug function to get more information. Suggest a Feature
Pages
There is a new beta version of this plugin available which supports the new multi-site feature of WordPress as well as many other Notify List
Comments new functions!More information and download
Support Form
Feedbacks Report a Bug
150
useFuL THiNGs TO KNOW /// MY siTe isN’T sHOWiNg uP iN gOOgle /// WORKiNg WiTH OTHeR useRs /// geTTiNg HelP
OTHer users Getting HeLp
If you’re working as a team, you can If you’re ever stuck, here are two the information you need (http://
assign other users a “role”—that is, places you can go to get help. codex.wordpress.org/FAQ); also
access with varying rights, depending try the forums (http://wordpress.
on what you want them to do. Either The first is the “Help” button at the org/support)—you can post your
assign the other users a role from top right of the screen; this gives problem and receive a timely
within the “Users” area, or allow them you relevant information on the area answer, but see relevant posts
to sign up by providing a signup box of administration you are currently in. first as it’s likely someone has
using the “Meta” sidebar widget. (The The second is WordPress.org. already experienced the same
default new-user role can be set in A very useful “Frequently Asked problem, so the answer may
the “General Settings” area; you can Questions” area may provide all be there.
alter the individual user’s role once New
Create Your Website Using WordPress in a... 3 View Post Howdy, Alannah
Jetpack
Pages
Paragraph Published on: Oct 18, 2012 @ 16:29 Edit
Editor Contact
Format
A user who can publish and manage Appearance
Standard
Plugins Aside
A user who can publish and manage Word count: 0 All Categories Most Used
Contributor Dashboard
Customizing This
The title field and the big Post Editing Area are fixed in place, but you can reposition all the other boxes using drag and You can also create posts
drop. You can also minimize or expand them by clicking the title bar of each box. Use the Screen Options tab to unhide with the Press This
Jetpack Display
A user who can write and manage Posts
Title and Post Editor
more boxes (Excerpt, Send Trackbacks, Custom Fields, Discussion, Slug, Author) or to choose a 1-or 2-column layout for
this screen.
bookmarket.
Publish Settings
Documentation on Writing
and Editing Posts
Subscriber A user who can only Comments This is an image post Publish
Feedbacks Permalink: http://www.alannahmoore.com/twentytwelve/this-is-a-blog...e-image-format/ Edit View Post Get Shortlink
manage their profile.
Preview Changes
Contact
Add Media Visual Status: Published Edit
Text
Appearance
Visibility: Public Edit
Plugins
Paragraph
If you need to have several blogs
Published on: Oct 18, 2012 @ 16:29 Edit
Users
Publicize Not Connected Show
Tools
on one domain, or different blogs on Settings
Move to Trash Update
151
152
Textdomain: organicthemes
Language Permissions Actions
“Rescan” button.
Theme Version: v3.2
English/United States .po .mo
State: activated Edit Rescan Delete
admin area (unless you want to Textdomain: organicthemes generate mo-file last written: 01/31/2013 18:01:10
translate this as well). Total ( 138 / 140 ) | Plural ( 0 ) | Context ( 0 ) | Not translated ( 140 ) | Comments ( 0 ) | Code Hint ( 0 ) | Trailing Space ( 0 )
9. Go to your live site, refresh the The page you are looking for no longer exists. Edit | Copy
153
You will find plugins that can do all manner of things Add a CAPTCHA to it (a letter/number code) to protect
listed in the WordPress Plugin Directory—see here: your contact form from submissions by robots.
http://wordpress.org/extend/plugins Events Manager, Event Registration—online event
management and registration.
Remember, you can install them directly via the Plugins MapPress Easy Google Maps—add Google Maps with
> Add New area of the admin—just search their name. custom markers to your site.
Membership, Wishlist Membership (premium)—create
Plugins mentioned in the book: a membership site.
> Akismet Link Manager, Link Library—organise your links, create
> Jetpack a links directory.
> Pixeline’s Email Protector Ad Squares Widget—allows you to display the grid
> All in One SEO Pack of 125 x 125 pixel adverts very often seen on websites;
> WooCommerce it’s also compatible with Google AdSense.*
> WooDojo Google AdSense Plugin—allows you to display AdSense*
> AWeber Web Form Plugin, ads as a widget.
MailChimp List Subscribe Form Yet Another Related Posts Plugin—lets your blog readers
> Subscribe2 see a list of related posts they may also be interested in;
> Google Analytics for WordPress also useful for bringing your archived material to the fore.
> Social Media Icons Widget NextGEN Gallery—a hugely popular plugin that helps you
> Cookie Law Info to upload and maintain image galleries.
> BackUpWordPress Slideshow (by StefanBoonstra)—an easy-to-use plugin
> Google Site Verification that allows you to set up a slideshow anywhere within
> Google XML Sitemaps a page or a post or even as a sidebar widget.
> Codestyling Localization—for translating themes
and plugins
> Q-translate, WPLM (premium)—for multilingual websites *Google AdSense is an ad network that displays ads
on your website that are relevant to your page content.
More plugins You receive revenue according to the number of clicks
The following are a selection of plugins you may find generated from your web pages.
useful to extend your site’s functionality, but there are
many more to investigate . . .
154
155
156
Categories These are a way of “filing” Header The large rectangular image often
your blog posts so that if you want to, found at the top of a website. This space
YOUR ADMIN AREA you can order them into different groups is often filled by a slider (see “Slider”).
http://www.yourdomain.com/wp-admin— according to their subject matter. Distinct
from tags (see “Tags”). Hexadecimal (“hex”) color A six-figure or
access to the admin area of your own letter code used to identify colors used on
self-hosted WordPress site (replace CMS Stands for “Content Management websites, usually preceded by a hash tag;
www.yourdomain.com with your own System;” this means a website that the for example #FFFFFF indicates white.
owner can log into and make changes to, (Sometimes colors are identified with just
domain name) without having to delve into the coding. three figures or letters.)
(WordPress is a CMS.)
Hosting This is the space that you “rent”
Comments Running a blog on your site is in cyberspace where your website will
usually an invitation to readers to add their be lodged.
COMPANION WEBSITE own remarks about what you have written
http://www.createyourwebsiteinaweekend. in your blog post. With a WordPress site, HTML This is the basic code used to write
you can choose to allow visitors to leave websites (stands for Hyper Text Markup
com—see here for updates, demos, tips,
messages on your blog posts and the Language). If you’re using WordPress, you
and latest information; join the newsletter other pages on your site. won’t need to know any of this code.
to keep informed.
Dashboard The “home page” of your Key word or key phrase See “Search
administration area. Engine.”
157
that can be clicked on to navigate around relevant to what you are looking for. tags are about ideas and associations.)
a site. The menu often runs along the (The word or phrase you type into the
top of a website, but sometimes down box to make your search is known as Theme A template that is applied to
the side, or on occasion, both. a “key word” or a “key phrase.”) a WordPress site. Every WordPress
site needs a theme; WordPress will be
Navigation Another name for a menu. Self-hosted This is the form of WordPress installed with the default theme, and it
that you install yourself on your own is up to you whether or not you choose
Page As distinct from a post. These are hosting space. As distinct from sites an alternative. It controls the colors,
static pages on a website. Blog pages, running with WordPress.com, you have fonts, and everything to do with the
on the other hand, are filled with blog total control over your website look of the site; some themes also
posts, and their content changes when (see Chapter 1 for a comparison). determine the layout—for instance, the
a new blog post is added. theme may determine that you have a
SEO Stands for “Search Engine slider on your home page with a row of
Permalink The website address of each Optimisation.” This means doing the three boxes underneath it. Some themes
page and post on your site; WordPress best that you can to ensure that your are free, whereas others you have to pay
will generate these website addresses site has the highest possible position for (these are referred to as “premium”
the way you tell it to (as explained in in the search engines, in order to be themes).
Chapter 5). visited by the maximum number of
people (see Chapter 9). Trackback Another type of notification
Pingback A notification you receive to you receive to let you know that someone
let you know that someone has linked Sidebar This is the (optional) column has linked to something on your website.
to some of your website content. on the right or the left hand side of your
website pages, which is usually used Traffic People visiting your website.
Plugin An element you can add to your to display widgets (see “Widgets”).
website to make it do something that it Tweet A short snippet of information
didn’t originally do. For example, you Slider A large, rectangular space at posted on the social media network
can add an event management plugin the top of your home page, in which Twitter is known as a “tweet”
to your website to display events on a a number of images, sometimes with (see Chapter 9).
calendar and allow your visitors to sign captions, and occasionally videos,
up to attend them. A vast number of rotate. These are often linked to Upload To put something up in
free and paid-for plugins exist, designed pages inside the site or to blog posts. cyberspace or up on your website.
by individual programmers or companies, With WordPress, you will upload images
which you can use to make your site Social media Services, such as to your Media Library through your
do virtually anything you want it to. Facebook and Twitter (see Chapter 9), admin area.
that allow users to share and comment
Post A blog post is a dated article on information, photos, and videos URL Means simply a website address.
that will appear at the top of the blog with a network of other users. It can be the home page, or a page
section of your site. A blogging site will somewhere else on a website. (Stands
usually choose to display blog posts on Spam Commercial email that you for “Uniform Resource Locator”.)
the front page; however most other have not asked for—in other words,
types of site will have a blog section junk email. We also refer to comment User Someone signed up with a
somewhere inside the site. spam, which is caused by promotional WordPress website. There are five levels
messages submitted, usually by robots, of user, each of which has different
Robot Also known as a “bot,” “crawler,” as comments on your website. Luckily, rights; some can create pages and
or “spider”—a program that “crawls” these can mostly be filtered out using other content, others can just read
(visits) websites in order to index the Akismet plugin (see Chapter 5). posts (see Chapter 10).
information for the search engines.
Subscribe A site visitor can choose Widget An element—usually situated in
RSS This is a “feed”—or stream of to “subscribe”—i.e., receive your blog the sidebar, sometimes in the footer area
content—that readers can use to read posts or website updates by email or of a site—such as a search box, a list of
in a “Feed Reader” if they are an avid through a “Feed Reader;” we also talk recent posts, a small text announcement,
blog-follower. Many will choose instead about newsletter subscribers who are or a list of recent “tweets.”
to receive your blog updates by email, people who have “opted in” (chosen)
which you can allow them to do via to receive your email newsletters. WordPress.com This is the easy option
the Jetpack plugin (see Chapter 5). for running a WordPress website; sites
Tags You can attach tags (key words) hosted on this system are very simple
Search engine When you are looking to your blog posts, which is distinct to set up, but your options are limited
for something on the Internet, you will from assigning them to categories; (see Chapter 1).
use a search engine, such as Google, to tags are primarily used to help your
find it; the search engine you are using site visitors find related material.
158
159
portfolio sites 22-23, 96-97, search engines 15, 28, 42, 45, tablets 39, 109 Value Bundle 36
i n d e x /// a c k n o w l e d g m e n t s
109-113 81, 104, 129, 137-141, 150 tags 68-69 Variable Product 125
postcards 131 self-hosting 10-11 target audience 24, 128-130 video 33, 36, 67-68, 114, 117
premier accounts 83 service pages 25-27 taxation 124 View Page 59
premium themes 82-83, 89, setting up 34-37 technical support 10, 19, 89 Vimeo 33, 67, 117
114, 152 settings 37, 42, 44-45, 70, 74, telephone numbers 28, 73, 77,
press releases 131 81, 105, 107, 110, 124-125 126 Wallet 83
privacy pages 28, 126 shared hosting 19 terms & conditions pages 28, Webmaster Tools 141, 150
privacy policy 34, 108, 146 shipping 124 108, 126 Website Payments Standard
product pages 25, 27, 123, sidebars 12, 39, 68-69, 72-73, test runs 127 83, 85
125-126 78, 80, 90, 108, 117-119, 122-123, testimonial pages 25, 27 widgets 12, 38-39, 72-73, 78,
profiles 37 127, 144-145, 151, 153 text editing 57-59, 62, 76, 86 80, 108, 113, 117-119, 123, 127,
proofreading 25 signatures 130 text headings 46-47 133, 143-145, 151, 153
punctuation 25 sitemaps 150 thank you pages 85, 87 WooCommerce 83, 121-127
purpose of sites 24 sliders 12, 63, 107, 112-114 themes 8-12, 22-23, 27, 30, WooDojo 121
Quickslider 106 Small Business Administration 37-39, 71-72, 79, 88-127, WooThemes 92, 120-121
(SBA) 147 52-153, 155 Word documents 59
rankings 137-138, 141 smartphones 39, 104, 109 thumbnails 65-66 WordPress 6-9, 12-13, 19, 27,
Read More 58 social media 12, 78, 107, 111-112, tiling 54 30, 33-40, 42, 45, 50, 55-56,
RebelMouse 144 118, 123, 129, 134, 142-145 trademarks 15, 148 62, 64-68, 71-72, 74-76,
recommendations 130-131 Social Media Icons Widget 145 traffic reports 78, 122, 132, 135, 79-83, 88-89, 102, 105, 110,
Redo 59 Social Sharing Toolkit 145 141 133, 136, 140, 147, 149, 152-155
registering domain names 7, 14, SoundCloud 33, 78 transaction fees 83 WordPress.com 8, 10-11, 14, 17,
17-18, 20 spam 28, 43, 74, 77, 119, 127, translations 114, 152-153 36-37, 75, 135
removing sidebars 72 133, 147 Twitter 36, 78, 107-108, 112, 118, WordPress.org 10-11, 35, 151
Reports 124, 127 special content/offers 73, 107 129, 134, 142-145 WP E-Commerce 83
responsiveness 39, 80, 109, 114 spelling 15, 25, 58
returns policy pages 28 spiders 150 Undo 59, 66 Yahoo 141
review sites 145 Stats 78, 135 United Kingdom (UK) 147 YouTube 33, 67, 117, 144
RSS feed readers 133 sticky posts 70 United States (US) 147-148
storage space 10-11, 19, 30 Update 59, 63, 65, 67-70, 72, zip files 83, 110, 115, 121, 149
sales 82-87 strikeout 58 74, 76, 78-79, 125
sandbox 127 subscribers 151 updating sites 149
search engine optimization subscriptions 78, 123, 132-134 uptime records 19
(SEO) 28, 78, 123, 129, 137-141 symbols 59 usernames 34
Acknowledgments
Thank you to my clients and workshop partipants for
inspiring me to write this book. Thank you to my editors
(Ellie Wilson, Nick Jones, and Zara Larcombe of Ilex
Press) for their endless patience, good sense, and sanity.
Thank you to WordPress for creating such a wonderful
system, and to all the theme authors and website owners
who’ve allowed me to print their beautiful creations in
these pages. Thank you to my friends for bearing with
me, and for all the encouragement and enthusiasm I’ve
been met with along the way.
160