WORDPRESS AS A CMS WEBSITEAn LEDC Initiative:

Hosted by the Louisiana RII School District.Provided by Bart Niedner of Resource Forge LLC

BART’S WORDPRESS DISCLAIMER!WordPress as a CMS Website

I’M AN INTERNET DEVELOPER, NOT A WORDPRESS EXPERT!

Though WordPress is a great solution for non-programmers, most of the work I do requires greater customization. I work at the code level.

I have a number of clients, including Security Traders Association, which use WordPressfront-ends on more sophisticated back-endsI build.

WordPress is quick, user friendly, and has lotsof flexibility.

So, let’s see what we can build together inWordPress!

TWO GOALS Gain a basic familiarity with WordPress. Establish an online presence you can

continue to work on independently.

WEBSITE AUTHORING TOOLSWordPress as a CMS Website

TEXT EDITOR (CODE)HTML and JavaScript are just plain text.Most editors have syntax highlighting.Examples: Notepad, UltraEdit, Bluefish, Eclipse, Dreamweaver (code view)…

ONLINE CMS (WYSIWYG)Content Management System (CMS).A web-based, word-processor-like interfacewhere you can modify, add, or deletecontent including text, images, pages, andnavigation elements.Examples: WordPress, Drupal, Joomla, Dot Net Nuke, X-Standard…

DESKTOP CMS (WYSIWYG)Usually more sophisticated and easier to use than an online CMS.A word-processor-like program where you can build whole websites and control all of the files in the framework.Some programs not dedicated to the Web, can save HTML files. (MS Word)Examples: Web Expressions (previously FrontPage), Dreamweaver

WHAT IS WORDPRESS?WordPress as a CMS Website

WP IS BLOGGING SOFTWAREThe term “blog” is short for “weblog”.Blogs are websites comprised of a collection of articles and comments on those articles.Blogging software allows a non-programmer to create a blog website.Intentionally straight forward software to publish your content.

WP THINKS LIKE A BLOGThe trick for using WordPress as an Online CMS Web Authoring Tool is mostly about removing the blog-specific features from the pages you create.

GETTING STARTEDWordPress as a CMS Website

WHAT HAS ALREADY BEEN DONEYour hosting company has setup the following things:

Your own little area of the Internet called a subdomain.

If you would like a domain, we can do that for about $25.

Copied the WordPress software to your subdomain.

Created a database for WordPress to use. Created an FTP account.

WHAT YOU ARE GOING TO DO Configure the basic settings for your website. Create each of your pages and order them in

the menu. Setup how you want your ‘blog page’ to behave. Edit your header image. Play with plugins. Play with widgets. Change your theme.

“Hey, Bart, do you have a caffeine pill or

something?”-Meagan 8/22/2012

BASIC SETTINGSWordPress as a CMS Website

BROWSE TO YOUR INSTALL PAGEExample: http://yourname.resourceforge.com/wp-admin/install.php Fill out the form: Name your website.

Use your username and password.Use your email for password recovery.click the “Install WordPress” button.

LOOKING AT YOUR WEBSITEJust click on the title of your website in theupper-left to toggle between the dashboardand website.URL: http://yourname.resourceforge.com

CREATE YOUR MAIN PAGESWordPress as a CMS Website

CREATING PAGES Click on “Pages” on the left menu. Use the “Add New” button at the top to

create the following pages: Home About Services/Products News/Blog Contact

You can leave the pages blank or enter sometemporary text for now.

Set the menu “Order”. Make sure you click on

the “Publish” buttonwhen saving the pages.

CLEAN UP YOUR NAVIGATIONWordPress as a CMS Website

CLEAN UP MENU Trash “Sample Page” (delete). Be sure to use “Sidebar Template”

for Home page (includes “Log in”). Be sure to use “Sidebar Template”

for blog page (includes categories,posts, comments, and archives).

SET YOUR HOME PAGEAND BLOG PAGE

Click on “Settings” > “Reading.” Select the “static page” radio button. Select your Front Page (home/default). Select your Posts Page (blog). Make sure you click on the

“Save Changes” button when done.

CREATE YOUR CHILD-PAGESWordPress as a CMS Website

CREATE CHILD-PAGES Add a couple of new pages.

Set them to the same “Parent” page. Look at how your menu has changed

to display the new child pages.

YOUR “BLOG PAGE”WordPress as a CMS Website

CREATE CATEGORIES Click “Posts” > “Categories”

and add a couple of new categories. A Slug is a friendly URL.

ADD A NEW POSTClick “Posts” > “Add New”.Make at least one post foreach category.

COMMENT ON A POSTLogout or visit someoneelse’s site.

MODERATE COMMENTApprove, reply, spam, ortrash it!(This also went to your email!)

HEADER IMAGEWordPress as a CMS Website

YOU DO JUDGE A BOOK BY ITS COVER…Let’s change the header image. Every theme is different so we will do this together, before playing with different themes.

IMAGE EDITORI usually use Photoshop.PIXLR (www.pixlr.com) is online and free.Gimp (www.gimp.org) is free to download.This isn’t a workshop on images so we’ll move on…

DOWNLOAD AN IMAGEDo a search for “WordPress Header Images” or just visit www.freewordpressheaders.com Download an image you like to your desktop (right-click and use “save as”).

CHANGE YOUR HEADER IMAGEYour new image needs to be in JPG, GIF, or PNG format.Match your original pixel dimensions.

Click “Appearance” > “Header” and “Upload” your image.You can set server permissions through FTP or have your hosting company do it for you.

Crop and Publish your new header image. You can also toggle the “header text” from the “Custom Header” interface. Remember to “Save Changes.”

PAGE IMAGESWordPress as a CMS Website

UPLOAD AN IMAGE From an “Edit Page” view, click “Upload/Insert.” Drag/drop or use “Select Files” to choose which

images you want to upload. After your image uploads:

set the “alt” tag, and select “Insert into Post.”

Use the edit image button totweak your image once it is inyour content area.

USE WEB IMAGEYou may also use “Upload/Insert”to select an image on the web,such as one you have alreadyuploaded to your “Media Library.”

PLUGINSWordPress as a CMS Website

WHAT IS A PLUGIN?A WordPress Plugin is a program, or a set of one or more programming functions that adds a specific set of features or services to the WordPress system. These new features are seamlessly integrated within WordPress.

You can use “Add New” to browse and search for Plugins. Many will require a fee or a signup.

Lets click on “Plugins” and then activate “Hello Dolly” to be uber-cool!

WIDGETSWordPress as a CMS Website

WHAT IS A WIDGET?WordPress Widgets are WordPress Plugins that add visitor visual and interactivity options and features, such as sidebar widgets for post categories, tag clouds, navigation, search, etc.. Widgets are plugins that create an object you place in your website.

Use “Appearance” > “Widgets” to drag available Widgets into or out of your theme’s available areas of the layout.

Many Widgets can be customized. Check out the WordPress Plugin

Directory for more Widgets andPlugins.(www.WordPress.org “Plugins” tab)

CHANGING THEMESWordPress as a CMS Website

What is a Theme?A WordPress Theme is a collection of files that work together to produce a graphical interface with an underlying unifying design. It is a way to “skin” your website.

Get a New Theme Click “Appearance” > “Themes”. On the “Install Themes” tab, do a search

for available themes and “Install Now.” Setup your FTP Connection Information.

Click “Proceed.” After your theme downloads,

click “Activate.” Many Themes require additional

information. Go ahead and fill it out ifrequested.

Play with a few themes and their settings.You can always go back to the original theme.

WORDPRESS AS A CMS WEBSITEAn LEDC Initiative:

Hosted by the Louisiana RII School District.Provided by Bart Niedner of Resource Forge LLC

THANK YOU