In your WordPress Website:

1. Add a Page entitled Portfolio, with at least 6 images uploaded, via the WordPress image uploader, with captions, and linked to the image file. (This is what I walked through in class.) — it is OKAY, for now, if you want, to upload just two images, and then repeat the code, by copying and pasting, as I did in class.
2. Add three posts, under at least two categories. These can be very simple lists, with links. Bonus for having a nice-looking large image with each post.

Have these ready to go by class time, and we’ll get you rolling, customizing your own wordpress website.

Video Tutorials

Write and Publish a Post

Embed Images or Video into your Post or Page

Add a Page

WordPress Resource Page

WordPress Code Snippets

Perfect for our moving clouds for the new OKWUeagle header — just needs to be slowed down.

The blog where the code is explained:
http://stephenmcintyre.net/blog/jquery-parallax-scrolling/

View my online Presenter protoype here.

You can view the source to see the javascript and embedded styles it uses to make it work. Then do something more creative yourself — as a summer project!

A screenshot of the tabs-with-history, from jQuery tools.

Create a quick-moving tabbed interface with jQuery.

A couple of approaches:

From jQuery for Designers

1. jQuery Tabs :: basic
2. jQuery Tabs :: Coda Slider
3. jQuery Tabs :: Enabling the Back Button

From jQuery Tools

This framework MAY be an even better way to go:

1. Basic Tabs
2. Supporting the Back Button

To implement this form in your own site:

1. Download the files

You can download the ZIP folder here.

2. Grab the required HTML and PHP and add them to your own Contact.php file.

• You will find the HTML and PHP in the file named Contact.php. Look for the comments to tell you what parts to grab.
• Copy them to your own file.
• Make sure to change the new file name to contact.php. (The php extension is required for the form to function properly on the web. NOTE: This form will not run properly unless installed on a server running PHP.)

3.Update the e-mail information.

You will find this in the Top-of-Document PHP section:

	        // set your email address and subject...
	        $to = "comm@okwu.edu";
	        $from = "dcochran@okwu.edu";
	        $subject = "[Your Website] Contact Form";

4. Grab the embedded styles and modify them to style your form to taste.

• You will find these at the bottom of the head element of the contact.php document.
• Copy and add them to your external stylesheet, and modify them to suit you!

5. Take the folder named “captcha” from the assets folder and upload it to your own assets folder.

This is required to make the security part of the form work. (The form will be broken until you have this in place.)

• Codex.WordPress.org

A semantic personal publishing platform with a focus on aesthetics, web standards, and usability.

• WordPress.tv

Your virtual resource for all things WordPress.

The Best, Most Multifunctional Form Creation Plugin

• DeliciousDays.com

cforms is a powerful and feature rich form plugin for Wordpress, offering convenient deployment of multiple Ajax driven contact forms throughout your blog or even on the same page.

• ThemeForest.net

The largest marketplace of its kind for Site Templates and CMS Themes.

Smashing’s WordPress Posts

• SmashingMagazine.com

Smashing Magazine delivers useful and innovative information to Web designers and developers. Its aim is to inform readers about the latest trends and techniques in Web development.

CSS Tricks WordPress Search

• CSS-Tricks.com

A web design community.

And many times you’ll find some really good stuff from other sources by simply searching the wide web.