How to WordPress: the basics, part 1

“How to WordPress: the basics”
Part 1

Rick Radko WPOTTAWA, Ottawa
r3df.com November 7th, 2012

Who am I?

Rick Radko – R-Cubed Design Forge
 Software, web and app designer/developer.
 Creating web sites since 1996.
 Artistic and creative engineer.
 WordPress enthusiast.

Slides are posted at:
 http://www.slideshare.net/r3df

© 2012 Rick Radko, r3df.com 1

Who are you?


Learning about WordPress

WordPress is BIG, lots of features
 Take small bites!
 and keep chewing…
 Ask questions
 Everyone was new to WordPress at one time


Contents - Part 1

1. About WordPress
2. The dashboard
3. Intro to the settings panel
4. Posts and pages
5. Maintenance & SPAM


Contents - Part 2

6. Menus
7. Widgets
8. Resources
9. Plugins
10.Themes
11. More WordPress settings
12. Users


About WordPress


What is WordPress?

WordPress:
 Is a dynamic content management system. (CMS)
 A tool to help you build a website.
 Like Microsoft Word helps you create documents.
 Creates web pages (HTML) dynamically
 Requires minimal knowledge of web programming
or markup languages (HTML, PHP, JavaScript etc.).
 Allows users to create website content easily
 WYSIWYG editor


WordPress is WYSIWYG

Looks similar to a lot of word processing applications.
 This image shows the WordPress post editor with an
extended editor plugin added (TinyMCE Advanced)


What is WordPress continued…

WordPress:
 Is currently the most popular CMS in use on the
Internet.

 Needs a web server with PHP and MySQL to run.
 Hosting service.
 Local server is needed to run it on your pc/laptop.


Is it really free?

WordPress is free:
 The core WordPress software is free:
 As in open source.
 Freedom to use it as you want, even to change it.
 As in beer.
 But that does not necessarily mean a free website.


WordPress popularity – April 2012

Popularity:
 Runs 10-16% of worlds
web sites depending on
who’s stats you believe.

Grey bars – % of all websites
Green bars – % of CMS websites

http://w3techs.com/technologies/overview/content_management/all

WordPress domination of top 100 blogs

http://royal.pingdom.com/2012/04/11/wordpress-completely-dominates-top-100-blogs/


Sites using WordPress


007.com

007.com is on
WordPress


Some major sites using WordPress

 katyperry.com  boingboing.com
 thinkblue.vw.com  techcrunch.com
 social.ford.com  life.time.com
 blogs.nfl.com  venturebeat.com
 mashable.com  gigaom.com
 piersmorgan.blogs.cnn.com
 newyork.cbslocal.com
 stylenews.peoplestylewatch.com
 icanhascheezburger.com


WordPress versions

3 different WordPress’s:
 WordPress.com
 Often referred to as “.com” WordPress
 WordPress.org (Self hosted)
 Regular
 Network or Multisite

Need to be aware of which one we are talking
about or using, there are differences.


WordPress.com

WordPress.com is a service (by Automattic)
 They provide WordPress AND hosting
 Free for basic site: somename.wordpress.com
 WordPress.com, is not at all related to using or not
using “.com” domains on a site.

 Costs:
 Using a your own domain name: $13-$25/yr
 CSS changes: $30/yr
 To turn off advertising: $30/yr
 Customization, VIP service $$

WordPress.com

 Getting Started:
 Choose a name
 Sign-up
 Start using your blog
 Optional:
 Choose a theme from those available
 Enable some plugins from those available


WordPress.com continued…

 Limitations:
 Limited to what WordPress.org offers for themes
and plugins
 Limited ability to customize
 Many things covered in this presentation you can’t do
on WordPress.com
 Can’t monetize (can’t run Google ads etc)
 WordPress.com runs advertising on your site
 No custom analytics


WordPress.com main page

 About 35 Million
blogs on
WordPress.com


WordPress.org

WordPress.org
 Home of the open source version of WordPress.
 Free! – Just download it

 Some things you may need that may cost:
 A web host (self-hosted)
 Usually $80-150/year for basic shared hosting
 A domain
 $0-20/year for a domain
 Some WordPress /Web knowledge
 Hire an expert?
 Site maintenance/updates and backups

WordPress.org continued…

 Getting Started:
 Choose a domain name (and purchase)
 Sign-up for web hosting – Get a domain if free
 Set-up WordPress
 Download from WordPress.org and install.
OR
 Install from hosting control panel.
 .org is what you get with installers like Fantastico, and
Simplescripts etc.
 Start using your site


WordPress.org

 Optional: Customize WordPress completely
 Add and/or customize/alter:
 Themes
 Plugins
 Widgets
 Even alter the code! (not recommended)

 Limitations:
 None!


WordPress.org customizing

 Can add plugins to make your site:
 multilingual - Numerous techniques & plugins
 a social site like Facebook (BuddyPress)
 connect to: Facebook, Twitter, YouTube, Flickr
 Auto publish content
 a forum (bbpress + others)
 a wiki
 much, much, more (1000’s of plugins available)

 Add themes to change the look and sometimes
add function (1000’s of themes available)

WordPress.org customizing

Caveat:
 The more extensive the customization, the more
WordPress knowledge that is required.
 Many free resources to help
 WordPress.org
 Other online resources
 Some low cost resources
 WordPress meet-ups
 WordCamps
 Books
 May need to hire a WordPress expert.

Wordpress.org

 WordPress.org
web site

 Self hosted
WordPress
sites also
number about
35 million


WordPress.org networks or multisite

With the WordPress.org download you can also set
it up as a “network” of sites or “multisite”.
 Was once known as WPMU, a separate program.
 Multiple sites on one install.
 That it is one install may not be obvious to users.
 Limited version of what WordPress.com runs.
 Needs some knowledge to set-up.


wordpress.com

This presentation is based on a self hosted
wordpress.org install.
 Some of what we do will still work on
wordpress.com but many things may look/be
different.
 Things like installing plugins and themes will not
work.


Install WordPress


Installing WordPress

Installing WordPress
 Lots of install guides – not going to cover installing
here, it’s a whole session in itself.
 http://codex.wordpress.org/Installing_WordPress

Many hosting companies have “one click” install
scripts for WordPress.
 Fantastico, Simplescripts etc.
 OK for your first installs, but beware there can be
issues.

WordPress native vs scripted installs

Getting and installing WordPress from
wordpress.org is more complicated than using the
scripts, but it allows you to correct the security
issues associated with a scripted install.
 Installer applications:
 May add files to your site for “internal” tracking.
 May not install the latest version of WordPress.
 Usually use default database settings for names
and table prefixes – this reduces security.


The dashboard - admin


WordPress front-end

WordPress has 2 interfaces for users:

 Front-end
 The part of site
that your site
visitors typically
see.
 The public side
of your site.


WordPress back-end, admin or “dashboard”

WordPress back-end or “dashboard”
 Where you manage the site.


Logging in

How do we get to the dashboard?
 login at: your-domain/wp-login.php


Welcome message

After logging in you will arrive at the dashboard.
 This is the dashboard on a brand new site.


The dashboard

The dashboard with the welcome box dismissed.


Screen options tab

Still has a lot of content you may not want:
 Adds to load time of the page.
 It’s a distraction.
 Click on the “screen options” tab (upper right).


Screen options

Select what you want to see, un-tick the rest.
 You can bring back the welcome screen here.

Look for screen options on many admin pages:
 Options change for each page.
 Check here if you seem to be missing stuff on a
page, a lot of things are off by default.

Dashboard slimmed down


Help tab

Beside the screen options tab there is a “help” tab
on every page – again it is context sensitive.


The help tab

The help tab items on the left side:
 Have general WordPress help.
 May have added help from plugins and/or themes.

Links to WordPress on the right.

The tool bar

The admin tool bar:
 Context sensitive menu at the top of the screen.
 Drop down menus for some items.


The tool bar

Front end tool bar:
 Very similar to admin tool bar.
 Only shows if you are logged in.


Front end edit link

In some themes you will also have an edit link
right in your content:
 Only shows if you are logged in with edit privileges.


Main navigation

On the left side of the admin screen is the main
navigation menu:
 Access all your content.
 Control WordPress settings.


WordPress settings


Site tagline

Did you notice the tagline a few slides back?


WordPress - general settings

Change the tagline in the Settings General item:
 Set a few other things while we’re here.


Posts and pages


Posts and pages

Posts and pages are the basic content holders for
a WordPress site.

 Posts:
 Collection of static content blocks.
 Associated with a date:
 URL: your-domain/2008/11/30/post-title.
 Only posts in RSS feed.
 Posts have categories and tags.


Posts

 Can be displayed many ways (dynamic):
 Usually listed in reverse chronological order.
 Sticky posts. (show at the top, need theme support)
 Archives, by date, by author.
 Categories and tags.

 Many different sidebar widgets can be used to
create lists and indices to posts.


Post display


Single post display

 Sidebar is
the same as
the listing
page, but it
could be
different.
 Comments
are shown
with box to
add a new
comment

Single post display

 Twentyeleven
has no side
bar for single
posts.
 Themes
determine
much of the
display of a
page.


Posts and pages

Pages:
 Are individual static stand alone content blocks.
 Good for things like an About page. (any web site
pages)
 Usually in site menus.
 Do not use tags or categories.
 Not tied to date.
 URL: domainname.com/page-title/


Page display

 Only one way to
display the
page.
 May have
sidebar.
 No date, tags
or category
information on
page.
 Has comments
section.

Creating a post

Back to the dashboard -> select “Add New” from
the Posts menu item.


The post editing screen


Create a new post: 1, 2, 3!


A new post!


Post categories

Lets add a category to our post:
 Can select from existing or create a new one.
 We only have
the default
category
“Uncategorized”
so far.
 Lets create
a new category.


Add a new category


The post with the new category


Post tags

Lets add a tag to our post
 Can select from existing or create a new one
 There are
no tags so
lets create
a new one.


Adding a new tag


Post now showing the tag


Publishing options - draft

Lets look at the publish box in detail
 Before the first save – there is a draft button
 As long as you hit the draft button it will stay
unpublished.
 Not visible anywhere on site


Publishing options

Some options:
 The 3 edit buttons are hiding some great options


Publishing options - status

 Click the edit beside status and the panel
expands.
 You can change save your post for review.
 You can our post status back to draft after
publishing.


Publishing options – visibility

 Click the edit beside visibility and the panel
expands.
 This is where the sticky option is hiding.
 You can password protect it.
 You can save a post as
private.


Publishing options – publishing details

 Click the edit beside visibility and the panel
expands
 You can change your publish date.
 Why?
 Change the display order.
(remember they are shown
reverse chronologically)
 Publish in the future!
(vacations)


Adding images to a post

Another hidden button:


Media uploader

Just drag media into the box from your desktop
 Images, audio,
video, but they
need to be
files you have
on your
computer


Uploaded image

The uploaded image:
 Fill in all the
details, title,
alt tags,
caption etc.
 Size and
positioning
options too.
 Insert into
post.


Image in post

Image is inserted into post where your cursor was
when you clicked the media icon.


Post with image


Uploader options

Now that we have an image uploaded, there are
more tabs…


Upload from URL

Upload from URL: the image is not included in your
post!
 It is loaded from
the other site when
a page is viewed.
 NOT in your gallery.
 Gallery functions
don’t work.
 YouTube does
not work .here


Add from gallery

Add an image from the post gallery:
 Sometimes they
are deleted and
you need to
re-insert, or you
need a different
size.


Add from media library

Add an image uploaded to your site, but not yet in
this post:
 Can choose from
all your images
that you have
previously
uploaded.


Add a YouTube video

Go to YouTube:
 Get share link.


Add a YouTube video

Paste share link in your content
 Update your post.


Video in post


Use embed code for more options


Need to paste into HTML view


Back in visual mode

Visual representation of video:
 URL method does not show space used.
 URL method had no options for size etc.


Post with videos

Notice smaller video:


HTML view

Use HTML view to:
 Embed HTML code like YouTube snippets.
 Change HTML directly, sometimes needed to get
things right.


The kitchen sink

“kitchen sink” button shows second row for editor:
 A few more editing options.


Pasting from Word/Excel

You can edit in MS Word or Excel and paste into
WordPress, but:
 There can be issues with formatting – Word adds a
lot of junk to it’s HTML.
 Use the paste from Word button.
 May loose formatting, tables, lists etc – do final
layout/formatting in WordPress.


Post list – All Posts

Post list shows all the posts on your site:
 Sort by title or author.
 Filter by all, Published, Trash, a search term,
category or tag.


Pages

Pages:
 Editing pages is the same as post.
 No categories or tags.


The page list

Page list – similar to posts:
 Page hierarchy, only pages have hierarchy.
 Important for URL structure. (permalinks)
 Adds dropdown to menus.


Creating a child page

Page attributes box:
 Select parent page – needs to exist already.


Drop down for child page


Settings - permalinks

Permalink settings change the way the URL is
displayed.
 Default sample page:
 http://your-domain/?page_id=2
 Default child page:
 http://your-domain/?page_id=36
 Default post:
 http://your-domain/?p=4
 Not very “pretty” or readable, Google does not like
them either! No hierarchy for child page.


Settings - permalinks

Several options:
 For the example: month and name is set.
 WordPress fills in the custom box with presets, you
can edit that option too.


The URL’s with permalinks

The sample page is now:
 http://your-domain/sample-page

The child page is now:
 http://your-domain/sample-page/sample-child-
page
 It shows the hierarchy.

Our post is now:
 http://your-domain/2012/05/hello-wpottawa

Permalink also shows in editor

You can override permalinks – use edit
 If you change your title, you need to update the
permalink.
 Note: if you change the permalink, you may want
to add a
redirect for
the old url.


Mainenance & SPAM


Maintenance

Keep your site up to date
 WordPress, Plugins and Themes
 All have bug updates, security patches and new
feature releases.
 Not keeping up to date increases the risk of hacking
substantially.
 Before you update anything – make a backup!


Backups

BACKUP!!!
 Can’t emphasize this enough.
 Often neglected.

 Backups make the difference between a 10
minute restore and needing days to restore a site.
 Hacking.
 Finger trouble. (oops!)
 Server failure.
 Update failures
 Conflicts with new plugins/themes

When to Backup

BACKUP!!!
 Before any update.
 WordPress.
 Themes – updates or adding a new theme.
 Plugins - updates or adding a new plugins.
 Major content changes.
 Regular automatic backups.
 You don’t need to remember to do it.
 Always up to date.


Ignore the “door to door” salesmen – (SPAM)

With your own domain and web site you will get:
 SPAM emails & WordPress comments to your
blog/site telling you:
 How “bad” your site looks, and they can fix it for you.
 That your site “does not work” on mobile devices.
 Your SEO ranking is really low, but they can get you
to #1.

 In most cases these are automated and they have
not even looked at your site, or rankings.
 Even the WordPress comments are automated!
 Ignore them!

REAL Examples - SEO comment SPAM
How did he find it if it was so hard?
Unsolicited third party recommendation?


More SEO SPAM - email


Mobile SPAM - email

Not a fact at all!

Ha! Your profits or theirs?


Mobile – your site may work just fine
You need to zoom and scroll, but my site
works on most mobile devices – yet it
was never designed for mobile.

Pick a theme for your site that works on
mobile and effort/cost for mobile = 0.


Link SPAM - Comments

Link SPAM
 Usually black-hat SEO trying to get a clients link
posted to your site. (attempt to improve inbound
link count for the client)
 Cheapfamilyvacations anyone?


Link SPAM - Comments

Look for:
 Link that is nothing related to your site
 Comments that sound great (if you ignore the
often bad grammar and spelling) but don’t actually
say anything substantial about your site. (no ties
to your content)


How to WordPress: the basics, part 1

More Related Content

What's hot (20)

Viewers also liked (20)

Similar to How to WordPress: the basics, part 1 (20)

More from R-Cubed Design Forge (7)

Recently uploaded (20)

How to WordPress: the basics, part 1