Wordpress and Flash 10x Cookbook

Table of Contents

Wordpress and Flash 10x Cookbook

Credits

About the Authors

About the Reviewers

Preface

What this book covers

What you need for this book

Who is this book for

Conventions

Reader Feedback

Customer Support

Downloading the Example Code for the Book

Errata

Piracy

Questions

1. Leveraging Flash in WordPress

Developing a strategy to use Flash & WordPress

Getting ready

How to do it...

How it works...

There's more...

Where to place the .swf?

Edit and debug with Firebug

Additional utilities

See also

Embedding Flash .swf files in WordPress

Getting ready

How to do it...

How it works...

Adding Flash detection with SWFObject 2.x

Getting ready

How to do it...

How it works...

There's more...

Using relative vs. absolute dimensions

Dynamic Publishing instead of Static Publishing

Hitting the More Button

See also

Adding Flash detection with Flash-generated JavaScript

Getting ready

How to do it...

How it works...

See also

2. WordPress: Configuration and Core Plugins

Introduction

Inputting content in the Visual Editor

Getting ready

How to do it...

How it works...

Extending the Visual Editor with plugins

Getting ready

How to do it...

How it works...

There's more...

Learning XHTML

Inputting content via the HTML Editor

How to do it...

There's more...

Editing theme template files in the Theme Editor

Getting ready

How to do it...

How it works...

Template hierarchy

Configuring WP for maximum SEO

Getting ready

How to do it...

How it works...

There's more...

How to create an SEO strategy

See Also

Using the Google XML Sitemaps plugin

How to do it...

How it works...

There's more...

Using the SEO Title Tags plugin (Version 2.3.3)

Getting ready

How to do it...

How it works...

Using the Breadcrumb NavXT plugin (Version 3.2.1)

How to do it...

How it works...

Use Google Analytics in WordPress

How to do it...

How it works...

Backing up your site

Getting ready

How to do it...

How it works...

3. Image Galleries and Slideshows—Using Plugins and Flash

Introduction

Importing your photos from Flickr: Simple Flickr plugin (Version 1.1)

Getting ready

How to do it...

There's more...

Other plugins

More information

Using lightbox effects: WordPress Multibox plugin (Version 1.3.8)

Getting ready

How to do it...

How it works...

There's more...

See also

Creating effects in Flash

How to do it...

There's more...

Adding, enabling/disabling, and deleting filters

Adding borders and exporting as a series of JPG Files

Using Flash to create watermarks

Getting ready

How to do it...

How it works...

There's more...

Watermarking multiple images and exporting as JPG Files

See also

Image thumbnails, galleries, and watermarking: NextGen gallery plugin (Version 1.3.5)

How to do it...

Building an image gallery in Flash in the timeline

Getting ready

How to do it...

How it works...

See also

Building an image gallery in Flash with XML

Getting ready

How to do it...

How it works...

See also

Adding slideshows: Featured Content Gallery plugin (Version 3.2.0)

Getting ready

How to do it...

How it works...

Building a basic slideshow in Flash in the timeline

Getting ready

How to do it...

How it works...

There's more...

Stopping the loop

Swapping your slides

See also

Building a slideshow in Flash with XML

Getting ready

How to do it...

How it works...

There's more...

Adding navigation (Start and Stop) buttons to the slideshow

See also

4. Video Blogging + Flash Video Encoding, Skinning, and Components

Introduction

FLV Embed (Version 1.2.1)

Getting ready

How to do it...

How it works...

There's more...

Commercial use?

See also

WebTV plugin (Version 0.6)

How to do it...

There's more...

See also

Free WP Tube (Version 1.0)

Getting ready

How to do it...

More info

See also

Encoding with the Adobe Media Encoder

Getting ready

How to do it...

How it works...

There's more...

Edit Export Settings

Encoding multiple files at once

Removing files

See also

Using preset skins

Getting ready

How to do it...

How it works...

There's more...

Hiding and showing preset skins

Stopping AutoPlay

Setting up Fullscreen mode through Flash

See also

Using Video Component buttons to customize your skin

Getting ready

How to do it...

How it works...

There's more...

Modifying Video Component buttons for further customization

See also

5. Working with Audio—Using Plugins and Flash

Introduction

WPAudio Player plugin (Version 1.5.2)

How to do it...

There's more...

µAudio plugin (Version 0.6.2)

How to do it...

There's more...

PodPress plugin (Version 8.8.1)

How to do it...

There's more...

Using buttons in the Common Library

How to do it...

How it works...

There's more...

Editing a button from the Common Library

See also

Adding sound effects to a button

Getting ready

How to do it...

How it works...

There's more...

Adding sound to the Over state

See also

Adding sound effects to the timeline

Getting ready

How to do it...

How it works...

See also

Streaming sound and coding a simple On/Off music button

Getting ready

How to do it...

How it works...

See also

Designing your own stylish MP3 player

How to do it...

How it works...

See also

Coding your own stylish MP3 player

Getting ready

How to do it...

How it works...

There's more...

Displaying song information on your MP3 player

See also

6. Flash Applications

Introduction

WP-Cumulus (Version 1.22)

Getting ready

How to do it...

How it works...

There's more...

Accessing and editing the source files

See also

Tagnetic Poetry plugin (Version 1.0)

Getting ready

How to do it...

There's more...

Accessing the Flash source files

See also

Flexi Quote Rotator plugin (Version 0.1.3)

Getting ready...

How to do it...

There's more...

See also

Creating a custom Quote Rotator using XML

Getting ready

How to do it...

How it works...

There's more...

Fading the text in your Rotator

See also

WP sIFR (Version 0.6.8.1)

Getting ready...

How to do it...

How it works...

There's more...

More Info

XML Google Maps plugin (Version 1.12.1)

Getting ready...

How to do it...

There's more...

Integrating Google Maps into your Flash document

Getting ready

How to do it...

How it works...

There's more...

Types of maps

Zoom levels

Adding an Information Bubble

See also

Datafeedr Random Ads V2 (Version 2.0)

Getting ready...

How to do it...

WP Flash Feed Scroll Reader (Version 1.1.0)

Getting ready...

How to do it...

There's more...

7. Flash Themes

Introduction

Picking a theme—free or premium

What to look for in a theme

CSS

Getting ready

How to do it...

How it works...

Block and inline elements

Commenting

Template files and theme structure

Getting ready

How to do it...

How it works...

There's more...

Template tags

Getting ready

How to do it...

How it works...

There's more...

Customizing Kubrik

Getting ready

How to do it...

Adjustments via Photoshop

There's more...

Adding a widgetized sidebar

Creating a custom page template

8. Flash Animations

Introduction

Creating a shape tween

How to do it...

How it works...

See also

Creating a classic tween

How to do it...

How it works...

There's more...

Tweening color and Alpha changes

See also

Creating a motion tween

How to do it...

How it works...

See also

Using the Motion Editor

Getting ready

How to do it...

How it works...

Using motion presets

Getting ready

How to do it...

How it works...

There's more...

Creating your own motion preset

See also

Animating with the Bone tool

Getting ready

How to do it...

Animating inside movie clips

How to do it...

There's more...

Animating movie clips that contain movie clips

See also

Creating a button

How to do it...

A. WordPress Resources

B. Flash Resources

C. Shortcut Keys

WordPress Visual Editor keyboard shortcuts

WordPress HTML Editor keyboard shortcuts

WordPress Comment Moderation keyboard shortcuts

Flash keyboard shortcuts

Windows keyboard shortcuts

Mac keyboard shortcuts

Firefox keyboard shortcuts

D. Site Planning

Goals

SEO Planning

Functional Requirements

Aesthetic Requirements

Site Outline

Index

Wordpress and Flash 10x Cookbook

Sarah Soward

Peter Spannagle

Wordpress and Flash 10x Cookbook

Copyright © 2010 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the authors, Packt Publishing, nor its dealers or distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

First published: April 2010

Production Reference: 1140410

Published by Packt Publishing Ltd. 32 Lincoln Road Olton Birmingham, B27 6PA, UK.

ISBN 978-1-847198-82-2

www.packtpub.com

Cover Image by Vinayak Chittar (<vinayak.chittar@gmail.com>)

Credits

Authors

Peter Spannagle

Sarah Soward

Reviewers

Ali Raza

Patrick Rushton

Sonia Munoz

Acquisition Editor

Usha Iyer

Development Editor

Chaitanya Apte

Technical Editor

Ajay Shanker

Indexer

Monica Ajmera Mehta

Editorial Team Leader

Akshara Aware

Project Team Leader

Lata Basantani

Project Coordinator

Srimoyee Ghoshal

Proofreader

Joel T. Johnson

Production Coordinator

Adline Swetha Jesuthas

Cover Work

Adline Swetha Jesuthas

About the Authors

Peter Spannagle is a WordPress consultant, technology trainer, and Web 2.0 designer. His skills include client-side coding, graphic and web design, and SEO. He also offers online marketing, training, and support services. With twelve years experience as a technology contractor, he will help you meet your goals and strives to exceed your expectations.

His professional experience includes working as the Manager of Marketing and Online Services for Youth Service California and as a Quality Rater for Google. He was also fortunate to work as part of the fabrication team for Sky Mirror (a thirty-ton stainless steel sculpture) designed by Anish Kapoor and built by Performance Structures, which debuted at the Rockefeller Center in 2006.

YourCustomBlog.com (YCB) began in 2007 to provide quality WordPress consulting services in the San Francisco Bay Area. Over the past three years, YCB has grown to servicing clients around the country and around the world.

YCB contract clients include: Singularity Hub, Sharam, The Hidden World of Girls (for the Kitchen Sisters, a segment on NPR Morning Edition), Street Soldiers Radio (on 106 KMEL San Francisco), Ustream.TV, Innovation Center Denmark (Silicon Valley), San Francisco Dream Wedding Giveaway, Legal Services for Children, The Children and Nature Network and the San Francisco Day School.

Visit my website: http://yourcustomblog.com or contact me at:

I would like to thank:

My co-author, Sarah Soward

My clients, for the opportunity to assist them

My family and friends

My mentors at UC Santa Cruz and UC Berkeley

The Bay Area Video Coalition

The Flow Yoga Teacher Training program and participants

D.K. Chakravarty, Ayurvedic chef

Numi Tea and Mama Buzz

The Bolivarian Republic of Venezuela

Sarah Soward develops curriculum for and teaches the Adobe Creative Suite and design theory at the Bay Area Video Coalition (http://www.bavc.org). She has over five years experience as a technology trainer and is Adobe Certified. She specializes in creating web and print collateral for small businesses and non-profits. She is the Art Director for The Pagan Alliance, a non-profit organization, and a working fine artist (oil painting and drawing). In addition to teaching Flash, she is also an expert in the use of Dreamweaver, Fireworks, Photoshop, Illustrator, and InDesign. You can reach her at and

My Flash experience and teaching experience have come from a variety of sources. I certainly could not have done any of this without Adobe and their wonderful resources for ActionScript and Flash CS4. On that note, thanks also to Abigail Rudner. She demystified ActionScript 2.0 for me when I was first learning Flash and made my SWF’s functional as well as fun.

Rose Adare gets a huge thank you for putting me on this path with the Bay Area Video Coalition (BAVC) and technology training in general. She taught me how to teach. That skill is one of the most valuable pieces of my life.

Thank you to BAVC for believing in me and keeping me and my quirky handouts around all these years.

Of course, my profs @ The California College of the Arts get props.

My Mom. I know it isn’t a complete sentence. It says all it needs to say: My Mom. It’s like stop(); can be this.stop(); but may not need all the extra characters to be just perfect even if it is more thorough.

Happy expressions of gratitude go out to Chris O’Sullivan, Michele Jones, their living room floor, and gluten-free donuts. Kristie Bulleit Niemeier and her dissertation progress postings get a nod as well.

Thanks to every client who ever insisted that I make something cool for them.

Finally, thanks to the man who shared this project with me: Peter Spannagle. He makes a mean cup of tea.

About the Reviewers

Ali Raza is a fresh and invigorated aspirant in the field of design, development, and authoring. He became part of the IT field at quite an early age and worked up from designing business cards, flyers, books, websites, digital maps, software interfaces, and almost all design-related things to audio and video editing, animation, and even minor 3D modeling in Autodesk Maya. Later, playing with code became his passion that compelled him to work in various programming languages including C++, Java SE, ActionScript 3, and PHP.

Ali is pursuing a Master of Science degree in Computers. He is also an Adobe Certified Instructor, Adobe Certified Expert, and Sun Certified Java Programmer.

He is currently a senior developer at 5amily Ltd., a London-based forthcoming genealogy-related social networking-rich Internet application. Previously, he has worked with different national and international advertising, telecommunication, and IT firms.

Ali is authoring an Adobe Flex 3 with AIR exam guide from the platform of ExamAids. He is also a regular author in Flash & Flex Developer’s Magazine, writes project-based articles predominantly on Data Visualization, and also loves writing book reviews.

In his spare time, you will either find him engulfed in design and development-related books, or find him envisaging about the accomplishment of series of certifications in ACE Flash and ACE Dreamweaver after his masters.

I would like to express my gratitude to Packt Publishing and the authors for bringing such a wonderful title. I would also like to thank to Reshma Sundaresan, Srimoyee Ghoshal, and Chaitanya for giving me the opportunity to review this unique book. You can contact me at <manofspirit@gmail.com>.

Sonia Munoz is a web programmer in Valencia, Spain. She has completed her upper-Computer Systems Management and is now studying the upper development of computer applications where she is learning the Java programming language. She has worked with tools such as PHP, MySQL, HTML, CSS, jQuery, JavaScript, CodeIgniter, Joomla, Photoshop, and Dreamweaver, but is willing to learn new programming languages.

After completing her studies, she would like to start their own web development business.

Besides this book, she revised Joomla! with Flash.

For Manu, Martha, and my parents.

Patrick Rushton is a user-experience designer living in Amsterdam. He works as an Interaction Director at communications agency Dynamic Zone where he uses Flash to create brand-building online experiences that combine interactivity, motion graphics, gaming, and 3D. He blogs about web design, music, 3D modeling, and interactive television on his website, http://www.patrickrushton.com.

Preface

This book helps you create a contemporary, functional, and memorable site. Detailed instructions are provided for each section. We show the big picture by providing context, best practices, and strategies.

>Learn how to work with XHTML in WordPress, configure WordPress for maximum SEO, edit theme template files, and back up your site. Our crash course in theme customization provides you with an introduction to CSS, WordPress theme hierarchy, and template tags.

More than 7,000 plugins currently exist for WordPress. We provide you with a shortlist of essential tools for creating a dynamic and media-rich website or blog, and show you how to implement these tools on your site.

The sections on Flash are intended to give you the option to create custom .swf files, giving you an alternative to plugins that already exist.

What this book covers

Chapter 1 helps you develop a strategy to use Flash in your WordPress blog. Learn how to embed a .swf manually or by using a plugin.

Chapter 2 demonstrates how to set up and work with WordPress, including creating posts and pages, and editing .php theme templates. We offer strategies for configuring WordPress and ways to extend the admin tools via plugins. By the end of the chapter, the user will be able to effectively use WordPress as a Content Management System (CMS) and in conjunction with Flash.

Chapter 3 shows you ways to share individual images and collections of images as thumbnails, galleries, and slideshows—using WordPress or working in Flash.

Chapter 4 shows you how to use video plugins, including video players, embed .flv and .swf files, and video blogging. Encoding through the use of the Flash Media Encoder for reduced file sizes and creation of .flv files is covered along with using Flash's default skinning options and editable video components.

Chapter 5 shows you how to work with audio in WordPress and in Flash. Topics covered include using a Flash audio player and creating a podcast as well as how to design your own unique audio player in Flash.

Chapter 6 explores a broad range of applications including unique ways to display your tags, how to use fonts outside of the limited set of web-only fonts, quote rotators, ad management, scrolling RSS feed displays, and more.

Chapter 7 presents an in-depth look