Contenu connexe Similaire à How to WordPress: the basics, part 1 (20) Plus de R-Cubed Design Forge (7) How to WordPress: the basics, part 11. “How to WordPress: the basics”
Part 1
Rick Radko WPOTTAWA, Ottawa
r3df.com November 7th, 2012
2. 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
4. 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
© 2012 Rick Radko, r3df.com 3
5. Contents - Part 1
1. About WordPress
2. The dashboard
3. Intro to the settings panel
4. Posts and pages
5. Maintenance & SPAM
© 2012 Rick Radko, r3df.com 4
6. Contents - Part 2
6. Menus
7. Widgets
8. Resources
9. Plugins
10.Themes
11. More WordPress settings
12. Users
© 2012 Rick Radko, r3df.com 5
8. 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
© 2012 Rick Radko, r3df.com 7
9. 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)
© 2012 Rick Radko, r3df.com 8
10. 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.
© 2012 Rick Radko, r3df.com 9
11. 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.
© 2012 Rick Radko, r3df.com 10
12. 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
© 2012 Rick Radko, r3df.com 11
13. WordPress domination of top 100 blogs
http://royal.pingdom.com/2012/04/11/wordpress-completely-dominates-top-100-blogs/
© 2012 Rick Radko, r3df.com 12
16. 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
© 2012 Rick Radko, r3df.com 15
17. 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.
© 2012 Rick Radko, r3df.com 16
18. 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 $$
© 2012 Rick Radko, r3df.com 17
19. 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
© 2012 Rick Radko, r3df.com 18
20. 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
© 2012 Rick Radko, r3df.com 19
22. 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
© 2012 Rick Radko, r3df.com 21
23. 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
© 2012 Rick Radko, r3df.com 22
24. WordPress.org
Optional: Customize WordPress completely
Add and/or customize/alter:
Themes
Plugins
Widgets
Even alter the code! (not recommended)
Limitations:
None!
© 2012 Rick Radko, r3df.com 23
25. 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)
© 2012 Rick Radko, r3df.com 24
26. 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.
© 2012 Rick Radko, r3df.com 25
27. Wordpress.org
WordPress.org
web site
Self hosted
WordPress
sites also
number about
35 million
© 2012 Rick Radko, r3df.com 26
28. 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.
© 2012 Rick Radko, r3df.com 27
29. 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.
© 2012 Rick Radko, r3df.com 28
31. 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.
© 2012 Rick Radko, r3df.com 30
32. 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.
© 2012 Rick Radko, r3df.com 31
34. 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.
© 2012 Rick Radko, r3df.com 33
35. WordPress back-end, admin or “dashboard”
WordPress back-end or “dashboard”
Where you manage the site.
© 2012 Rick Radko, r3df.com 34
36. Logging in
How do we get to the dashboard?
login at: your-domain/wp-login.php
© 2012 Rick Radko, r3df.com 35
37. Welcome message
After logging in you will arrive at the dashboard.
This is the dashboard on a brand new site.
© 2012 Rick Radko, r3df.com 36
39. 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).
© 2012 Rick Radko, r3df.com 38
40. 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.
© 2012 Rick Radko, r3df.com 39
42. Help tab
Beside the screen options tab there is a “help” tab
on every page – again it is context sensitive.
© 2012 Rick Radko, r3df.com 41
43. 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.
© 2012 Rick Radko, r3df.com 42
44. The tool bar
The admin tool bar:
Context sensitive menu at the top of the screen.
Drop down menus for some items.
© 2012 Rick Radko, r3df.com 43
45. The tool bar
Front end tool bar:
Very similar to admin tool bar.
Only shows if you are logged in.
© 2012 Rick Radko, r3df.com 44
46. 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.
© 2012 Rick Radko, r3df.com 45
47. Main navigation
On the left side of the admin screen is the main
navigation menu:
Access all your content.
Control WordPress settings.
© 2012 Rick Radko, r3df.com 46
50. WordPress - general settings
Change the tagline in the Settings General item:
Set a few other things while we’re here.
© 2012 Rick Radko, r3df.com 49
52. 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.
© 2012 Rick Radko, r3df.com 51
53. 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.
© 2012 Rick Radko, r3df.com 52
55. 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
© 2012 Rick Radko, r3df.com 54
56. Single post display
Twentyeleven
has no side
bar for single
posts.
Themes
determine
much of the
display of a
page.
© 2012 Rick Radko, r3df.com 55
57. 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/
© 2012 Rick Radko, r3df.com 56
58. Page display
Only one way to
display the
page.
May have
sidebar.
No date, tags
or category
information on
page.
Has comments
section.
© 2012 Rick Radko, r3df.com 57
59. Creating a post
Back to the dashboard -> select “Add New” from
the Posts menu item.
© 2012 Rick Radko, r3df.com 58
61. Create a new post: 1, 2, 3!
© 2012 Rick Radko, r3df.com 60
63. 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.
© 2012 Rick Radko, r3df.com 62
64. Add a new category
© 2012 Rick Radko, r3df.com 63
65. The post with the new category
© 2012 Rick Radko, r3df.com 64
66. 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.
© 2012 Rick Radko, r3df.com 65
69. 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
© 2012 Rick Radko, r3df.com 68
71. 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.
© 2012 Rick Radko, r3df.com 70
72. 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.
© 2012 Rick Radko, r3df.com 71
73. 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)
© 2012 Rick Radko, r3df.com 72
74. Adding images to a post
Another hidden button:
© 2012 Rick Radko, r3df.com 73
75. 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
© 2012 Rick Radko, r3df.com 74
76. Uploaded image
The uploaded image:
Fill in all the
details, title,
alt tags,
caption etc.
Size and
positioning
options too.
Insert into
post.
© 2012 Rick Radko, r3df.com 75
77. Image in post
Image is inserted into post where your cursor was
when you clicked the media icon.
© 2012 Rick Radko, r3df.com 76
80. 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
© 2012 Rick Radko, r3df.com 79
81. 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.
© 2012 Rick Radko, r3df.com 80
82. 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.
© 2012 Rick Radko, r3df.com 81
83. Add a YouTube video
Go to YouTube:
Get share link.
© 2012 Rick Radko, r3df.com 82
84. Add a YouTube video
Paste share link in your content
Update your post.
© 2012 Rick Radko, r3df.com 83
88. Back in visual mode
Visual representation of video:
URL method does not show space used.
URL method had no options for size etc.
© 2012 Rick Radko, r3df.com 87
90. HTML view
Use HTML view to:
Embed HTML code like YouTube snippets.
Change HTML directly, sometimes needed to get
things right.
© 2012 Rick Radko, r3df.com 89
91. The kitchen sink
“kitchen sink” button shows second row for editor:
A few more editing options.
© 2012 Rick Radko, r3df.com 90
92. 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.
© 2012 Rick Radko, r3df.com 91
93. 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.
© 2012 Rick Radko, r3df.com 92
94. Pages
Pages:
Editing pages is the same as post.
No categories or tags.
© 2012 Rick Radko, r3df.com 93
95. The page list
Page list – similar to posts:
Page hierarchy, only pages have hierarchy.
Important for URL structure. (permalinks)
Adds dropdown to menus.
© 2012 Rick Radko, r3df.com 94
96. Creating a child page
Page attributes box:
Select parent page – needs to exist already.
© 2012 Rick Radko, r3df.com 95
98. 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.
© 2012 Rick Radko, r3df.com 97
99. 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.
© 2012 Rick Radko, r3df.com 98
100. 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
© 2012 Rick Radko, r3df.com 99
101. 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.
© 2012 Rick Radko, r3df.com 100
103. 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!
© 2012 Rick Radko, r3df.com 102
104. 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
© 2012 Rick Radko, r3df.com 103
105. 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.
© 2012 Rick Radko, r3df.com 104
106. 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!
© 2012 Rick Radko, r3df.com 105
107. REAL Examples - SEO comment SPAM
How did he find it if it was so hard?
Unsolicited third party recommendation?
© 2012 Rick Radko, r3df.com 106
109. Mobile SPAM - email
Not a fact at all!
Ha! Your profits or theirs?
© 2012 Rick Radko, r3df.com 108
110. 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.
© 2012 Rick Radko, r3df.com 109
111. 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?
© 2012 Rick Radko, r3df.com 110
112. 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)
© 2012 Rick Radko, r3df.com 111
114. Continued
Continued in “Part 2”
http://www.slideshare.net/r3df/how-to-
wordpress-the-basics-part-2
© 2012 Rick Radko, r3df.com 113
115. Contact
Rick Radko
email: wpinfo@r3df.com
twitter: @r3designforge
Slides at:
www.slideshare.net/r3df
© 2012 Rick Radko, r3df.com 114