Flashback to

Presented by:

Overview

• What is WordPress• How it Works• Updating WordPress• Modifying Your Website

— Admin Overview— Adding Users— Posts-vs-Pages— Editing Posts and Pages

— Formatting Text— Adding Posts— Writing Titles— Adding Photos and PDFs

WordPress

• WordPress is an open source, free blogging tool and content management system (CMS) powered by PHP and MySQL

• Installed in your hosting space• You can update your site from any computer

that has internet access

The number of Websites (as of June 2013) using WordPress.

That is 18% of ALL websites!

How Your Website WorksThe Internet• The Internet is made up of inter-connected servers, fancy computers,

that act like file cabinets. • Domain names are labels used to tell Internet browsers which hosting

space on the servers, or the location of your website, to look at. • Each hosting space contains files, folders and documents.

These files make up a website.

=

How Your Website WorksViewing Your Site• A URL (domain name) is

typed into an address bar of an internet browser.

• Code is retrieved from a hosting space, translated by the server, paired with information from a database.

• Displayed on an internet browser

code

server+

database

Your WordPress

• You have a custom WordPress theme• We built it to do the things you need it to• Your site will be updated using the same

software tools as other sites but it will look different on your site

Updating WordPress

• Really smart people improve WordPress each day

• Occasionally you need to update the software or the plug-ins to keep the site secure and enable new features

• Quarterly or upon each new release is recommended

• You can call us for this so if something breaks we can fix it right away

• The more often you update the less likely things are to break

• Updates take us between 15-30 min and cost $25-$50 if all works correctly

When you see this bar you need to upgrade.

Updating WordPress

Ways to Modify Your Site

Create users

Let’s Get Started http://www.yourdomain.com/wp-admin

Admin Anatomy

Admin Anatomy

Main Menu

• Only present when on an admin page• Allows you to navigate from one admin page to

another• Most of what you want to do lives here

Admin Anatomy

Shortcut Menu

• Present when you’re logged in• Displays on every page• Allows you to navigate quickly to do common tasks• Allows you to navigate from public to admin sides of site

Clicking on your site name will take you to the home page of your website

Admin Anatomy

Page Header• Changes based on which page you’re on• Allows you to change page settings• Displays notifications about updates and uncompleted tasks• Shares the page you’re on

For example we’re currently on the “Dashboard” page

Admin Anatomy

Page Body• Displays editing options on each page or section• Contains additional navigational elements• Each page has different editing options

Blue buttons are action buttons allowing you to permanently save or publish

Action Panel

Efficiently Yours

Each screen is modifiable• Check the fields you would like to see in your editing screen• Uncheck the fields you would like to ignore

Adding Users

Types of WordPress users• Administrator - Somebody who has access to all the

administration features• Editor - Somebody who can publish posts, manage posts as

well as manage other people's posts, etc• Author - Somebody who can publish and manage their own

posts• Contributor - Somebody who can write and manage their

posts but not publish posts• Subscriber - Somebody who can read

comments/comment/receive newsletters, etc

Add a User

Add a userChoose a user levelInvestigate Screen Options

PAGE

Posts -vs- Pages

is displayed on pages or posts for the public to view

POST

Text

Image

File

Link

Video

Information on your site

Posts -vs- Pages

Posts• Timely information• Modular format can be

displayed on multiple pages• Divided into categories• Can not display a page

within a post• Longer URL• Think blog entry or

Facebook status update

Pages• Static information• Confined format can only

be displayed on a page• Divided by parent pages• Can display one or multiple

posts• Short URL• Think Word Document or

PowerPoint slide

Pages

• Most places on navigation link to a page

• To edit posts on a page you edit the posts

• Organized by parent pagesPAGE

• Home • About• Contact• Services/Programs/Products• History• Location• Hours• Menu• Areas of Practice• Staff/Board• Sponsors

PAGE

PAGE

PAGE

Parent Pages

PAGE

PAGE

PAGE

Sub Pages

Page Example Links to other main pagesNavigation

• One large entry• No “read more” links• Listed on and highlighted in main navigation• Straight forward URL:

http://www.mayecreate.com/contact/

Page Specific Content

PAGE

Posts

• Grouped into categories and displayed on a page

POST

POST

• Can be displayed on more than one page or in more than one category

POST

• Staff or board members• Products• News and press releases• Blog entries• FAQ• Resources• Terminology• Job listings• Testimonials• Announcements• Events• Portfolio

Post Example

• Multiple short entries• Read more links

Post

• Not list in main navigation• Longer URL, usually with dates:

http://www.mayecreate.com/2010/02/trackbacks-and-pingbacks/

Page Specific Content

Still not sure about posts and pages?

That’s OK we can talk about it one-on-one.

Page/Post Anatomy

Content

Title

URL

Editing Pages/PostsQuick Edit and Sorting Features

Editing a Page/Post

Visual vs HTML

Kitchen sink Preview changes

Change to draft

Revisions

Autosave!

Editing a Page/Post: Text Styles

• H1 is used for the title of the page and already applied for you

• Use the other styles in order of hierarchy to add organization and structure to your page

• H2, H3, H4, H5• Search engines read the styles this way when

reading your page, surprisingly people do too!• Maintains consistency and professionalism• Saves time!

Formatting Text

Applying StylesRemoving StylesPasting From Microsoft WordShift + Enter

Editing a Page/Post

• It won’t look the same from front to back

• Check early and check often

• If everything is bold, nothing is bold

• Don’t underline it looks like a link

• Shift+Enter• Pasting from

Microsoft Word• Unformatting

Routine Checks Rules of Thumb Tricks

Adding a Post

How to get there (or anywhere really )Look, Think, ClickEfficient Workspace Layouts, the art of drag and drop

Write a title that applies to your page or post so browsers and viewers can learn what’s on your page

Adding a Post: Writing Titles

Adding a Post: Writing Titles

Adding a Post: Writing Titles

Adding a Post

• Choose a category– If you don’t it will choose the default

• Scheduling– By scheduling posts to release in the future you

can make your site appear regularly updated– Lets Google know you’re actively adding to the

site on a regular basis• Read more link

Adding Links

• How to add a link• Opening a link in a new window– PDF– Other websites

• Photos can be used as links also• What words to link– Stay away from “click here” – Link words that represent the page you’re linking to

Adding a Post in Action

Write a titleChoosing a categoryPublishingViewing on websiteAdd a link

Adding a Photo

• Can always make it smaller but making it bigger will make it blurry

• Add titles but don’t start with a number• Add alt tags to describe the image• Add captions to assist skimming, give meaning• Use real photos when possible• Can upload photos:– In Media Library – In the page or post (gallery)

Adding Photos and PDFs

Upload a photoName and add alt tags and captionsLinkingAlignmentSizingCroppingUploading PDFsModifying link target on PDFs

Overview

• What is WordPress• How it Works• Updating WordPress• Modifying Your Website

— Admin Overview— Adding Users— Posts-vs-Pages— Editing Posts and Pages

— Formatting Text— Adding Posts— Writing Titles— Adding Photos and PDFs