WordPress Theme Design

Tessa Blakeley Silver

There is a newer version of this book available - WordPress 2.8 Theme Design
eBook: $23.99
Formats: PDF, PacktLib, ePub and Mobi formats
$19.19 save 20%!
Print book: $39.99
$35.99 save 10%!
Print + eBook bundle: $63.98
Includes free access to the book on PacktLib
$39.59 save 38%!
Free Shipping! UK, US, Europe and selected countries in Asia.
This book can also be purchased from:
Overview
Table of Contents
The Author
Reviews
Downloads
  • Take control of the look and feel of your WordPress site
  • Simple, clear tutorial to creating Unique and Beautiful themes
  • Expert guidance with practical step-by-step instructions for theme design
  • Design tips, tricks, and troubleshooting ideas

Book Details

Language : English
Paperback : 224 pages [ 235mm x 191mm ]
Release Date : May 2008
ISBN : 1847193099
ISBN 13 : 978-1-847193-09-4
Author(s) : Tessa Blakeley Silver
Topics and Technologies : All Books, Content Management (CMS), Open Source, WordPress


Table of Contents

Preface
Chapter 1: Getting Started as a WordPress Theme Designer
Chapter 2: Theme Design and Approach
Chapter 3: Coding It Up
Chapter 4: Debugging and Validaton
Chapter 5: Your Theme in Action
Chapter 6: WordPress Reference
Chapter 7: Dynamic Menus and Interactive Elements
Chapter 8: AJAX / Dynamic Content and Interactive Forms
Chapter 9: Design Tips for Working with WordPress
Index
  • Chapter 1: Getting Started as a WordPress Theme Designer
    • WordPress Perks
    • Does a WordPress Site Have to Be a Blog?
    • Pick a Theme or Design Your Own?
      • Drawbacks to Using a Pre-Made Theme
    • This Book's Approach
    • Things You'll Need to Know
      • WordPress
      • CSS
      • XHTML
      • PHP
      • Not Necessary, but Helpful
    • Tools of the Trade
      • HTML Editor
      • Graphic Editor
      • Firefox
      • We'll Be Developing for Firefox First, then IE
    • Summary
  • Chapter 2: Theme Design and Approach
    • Things to Consider
      • Types of Blogs
      • Plug-ins and Widgets
    • Getting Ready to Design
      • We Have a Problem
      • It Gets Worse
    • The Solution–Rapid Design Comping
    • Let's Get Started
      • Sketch It
        • Consider Usability
      • Start with the Structure
        • The DOCTYPE
        • The Main Body
        • Attach the Basic StyleSheet
        • Basic Semantic XHTML Structure
    • Adding Text–Typography
      • Start with the Text
        • Font Choices
        • Cascading Fonts
        • Font Sizing
        • Paragraphs
        • Default Links
    • The Layout
      • Navigation
      • More Navigation–WordPress Specific Styles (OK, Style)
      • Color Schemes
      • Two-Minute Color Schemes
      • Color Schemes with Photoshop
      • Adding Color to Your CSS
    • Create the Graphical Elements
  • Relax and Have Fun Designing
  • Slice and Export
  • Summary
  • Chapter 3: Coding It Up
    • Got WordPress?
      • Understanding the WordPress Theme
    • Your WordPress Work Flow
    • Let's Build Our Theme
    • Tabula Rasa
      • Including WordPress Content
        • The Loop
        • The Sidebar
        • Breaking It Up–Separating Your Theme Into Template Files
        • The Home Page
        • Internal Pages
    • Static Pages
      • Quick Recap
    • Fun with Other Page Layouts
    • Don't Forget About Your 404 Page
  • Summary
  • Chapter 4: Debugging and Validaton
    • Don't Forget About Those Other Browsers and Platforms
    • Introduction to Debugging
    • Troubleshooting Basics
      • Why Validate?
      • PHP Template Tags
      • CSS Quick Fixes
    • Advanced Troubleshooting
    • Fixing CSS Across Browsers
    • Box Model Issues
    • Everything Is Relative
    • To Hack or Not to Hack
    • Out-of-the-Box-Model Thinking
    • The Road to Validation
    • Advanced Validation
      • Firefox's JavaScript/Error Console
      • The Web Developer's Toolbar
      • FireBug
    • Extra Credit
      • What About the New Safari Mobile Browser?
    • Summary
  • Chapter 5: Your Theme in Action
    • A Picture's Worth
    • Theme Packaging Basics
    • Describing Your Theme
    • Licensing?
    • Create a ReadMe.txt File
    • Zip It Up
    • No Way to Zip?
    • One Last Test
    • Get Some FeedBack and Track It
    • Summary
  • Chapter 6: WordPress Reference
    • Class Styles Generated by WordPress
    • Using the Template Selector Feature
    • Template Hierarchy
      • New Template Tag in 2.5
      • Great Template Tags for Tags from 2.3
        • Adding Tag Display to Your Theme
      • General Template Tags—the Least You Need to Know
      • Include Tags
        • Custom Includes—Streamline Your Theme
      • The Loop Functions
      • WordPress Core Functions
    • Summary
  • Chapter 7: Dynamic Menus and Interactive Elements
    • DYI or Plug-ins?
    • Dynamic Menus?
      • Drop-Down Menus
      • DIY SuckerFish Menus in WordPress
        • Applying CSS to WordPress
        • Applying the DOM Script to WordPress
    • Flash-ize It
      • Flash in Your Theme
        • Pass Flash a WordPress Variable
        • Users Without Flash, Older Versions of Flash, and IE6 Users
      • Flash in a WordPress Post or Page
    • Summary
  • Chapter 8: AJAX / Dynamic Content and Interactive Forms
    • Preparing for Dynamic Content and Interactive Forms
      • You Still Want AJAX on Your Site?
    • Plug-ins and Widgets
      • Plug-ins
      • Widgets
    • Getting Your Theme Ready for Plug-ins and Widgets
      • Plug-in Preparations
      • Installing the AJAX Comments Plug-ins
      • Widget Preparations
      • Installing the Google Reader Widget
    • AJAX–It's Not Just for Your Site Users
      • pageMash
    • The AJAX Factor
      • JavaScript Component Scripts
    • Summary
  • Chapter 9: Design Tips for Working with WordPress
    • The Cool Factor
      • Rounded Corners
        • The Classic – All Four Corners
        • The Two Image Cheat
      • Creative Posting
      • Breaking Boundaries
      • Keep Tabs on Current Design Trends
      • Graphic Text
        • Extra Credit – Use PHP to make Graphic Headers Easy
    • Good Design isn't Always Visual – Looking at SEO
      • Search Engine Friendly URLs
      • Keywords and Descriptions
        • DYI Metatags
        • Metatag Plug-ins
    • Summary

Tessa Blakeley Silver

Tessa Blakeley Silver's background is in print design and traditional illustration. She evolved over the years into web and multi-media development, where she focuses on usability and interface design. Prior to starting her consulting and development company hyper3media (pronounced hyper-cube media) http://hyper3media.com, Tessa was the VP of Interactive Technologies at eHigherEducation, an online learning and technology company developing compelling multimedia simulations, interactions, and games that met online educational requirements like 508, AICC, and SCORM. She has also worked as a consultant and freelancer for J. Walter Thompson and The Diamond Trading Company (formerly known as DeBeers) and was a Design Specialist and Senior Associate for PricewaterhouseCoopers' East Region Marketing department. Tessa authors several design and web technology blogs. Joomla! Template Design is her first book.

Sorry, we don't have any reviews for this title yet.

Sample chapters

You can view our sample chapters and prefaces of this title on PacktLib or download sample chapters in PDF format.

Find your book in our support section to find errata and to download code samples.

What you will learn from this book

  • Set up a basic workflow and development environment for WordPress theme design
  • Create detailed designs and code them up
  • Enhance your sites by choosing the right color schemes and graphics
  • Debug and validate your theme using W3C's XHTML and CSS validation tools
  • Customize and tweak your theme's layout
  • Set up dynamic drop-down menus, AJAX/dynamic and interactive forms
  • Download and install useful plug-ins and widgetize your theme
  • Improve post and page content using jQuery and ThickBox
  • Add interactivity to your themes using Flash
  • Includes a reference guide to WordPress 2.0's template hierarchy, markup, styles and template tags, as well as include and loop functions

Chapter 1 introduces you to the WordPress blog system and lets you know what you need to be aware of regarding the WordPress theme project you're ready to embark on. The chapter also covers the development tools that are recommended and web skills that you'll need to begin developing a WordPress theme.

Chapter 2 looks at the essential elements you need to consider when planning your WordPress theme design. It discusses the best tools and processes for making your theme design a reality. The author explains her own 'Rapid Design Comping' technique and gives some tips and tricks for developing color schemes and graphic styles for your WordPress theme. By the end of the chapter, you'll have a working XHTML and CSS based 'comp' or mockup of your theme design, ready to be coded up and assembled into a fully functional WordPress theme.

Chapter 3 uses the final XHTML and CSS mockup from Chapter 2 and shows you how to add WordPress PHP template tag code to it and break it down into the template pages a theme requires. Along the way, this chapter covers the essentials of what makes a WordPress theme work. At the end of the chapter, you'll have a basic, working WordPress theme.

Chapter 4 discusses the basic techniques of debugging and validation that you should employ throughout your theme's development. It covers the W3C's XHTML and CSS validation services and how to use the FireFox browser and some of its extensions as a development tool, not just another browser. This chapter also covers troubleshooting some of the most common reasons 'good code goes bad', especially in IE, and best practices for fixing those problems, giving you a great-looking theme across all browsers and platforms.

Chapter 5 discuss how to properly set up your WordPress theme's CSS style sheet so that it loads into WordPress installations correctly. It also discuss compressing your theme files into the ZIP file format and running some test installations of your theme package in WordPress's administration panel so you can share your WordPress theme with the world.

Chapter 6 covers key information under easy-to-look-up headers that will help you with your WordPress theme development, from the two CSS class styles that WordPress itself outputs, to WordPress's PHP template tag code, to a breakdown of "The Loop" along with WordPress functions and features you can take advantage of in your theme development. Information in this chapter is listed along with key links to bookmark to make your theme development as easy as possible.

Chapter 7 dives into taking your working, debugged, validated, and properly packaged WordPress theme from the earlier chapters, and enhancing it with dynamic menus using the SuckerFish CSS-based method and Adobe Flash media.

Chapter 8 continues showing you how to enhance your WordPress theme by looking at the most popular methods for leveraging AJAX techniques in WordPress using plugins and widgets. It also gives you a complete background on AJAX and when it's best to use those techniques or skip them. The chapter also reviews some cool JavaScript toolkits, libraries, and scripts you can use to simply make your WordPress theme appear 'Ajaxy'.

Chapter 9 reviews the main tips from the previous chapters and covers some key tips for easily implementing today's coolest CSS tricks into your theme as well as a few final SEO tips that you'll probably run into once you really start putting content into your WordPress site.

Special Offers

PacktLib gives you access to this and 600+ other titles with an annual or monthly subscription.

Annual subscription:

$220.00 per annum

Monthly subscription:

$21.99 per month

Buy 2 eBooks
and Get 50% Off
+
Buy WordPress Theme Design with WordPress 2.8 Themes Cookbook and get 50% off both the eBooks.
Just add both the eBooks to your shopping cart and enter d3wdpteb in the 'Enter Promotion Code' field. Click 'Add Promotion Code' and the discount will be applied.
View Best Selling eBook offers

In Detail

This title will take you through the ins and outs of creating sophisticated professional themes for the WordPress personal publishing platform. It will walk you through clear, step-by-step instructions to build a custom WordPress theme. From development tools and setting up your WordPress sandbox, through design tips and suggestions, to setting up your theme's template structure, coding markup, testing and debugging, to taking it live it reviews the best practices. The last three chapters are dedicated to additional tips, tricks and various cookbook recipes for adding popular site enhancements to your WordPress theme designs using third-party plugins.

Whether you're working with a pre-existing theme or creating a new one from the ground up, WordPress Theme Design will give you the know-how to understand how themes work within the WordPress blog system, enabling you to take full control over your site's design and branding.

Expert guidance on designing a great theme for one of the most popular, open-source blog systems available for the Web today!

Approach

Theme design can be approached from two angles. The first is simplicity; sometimes it suits the client and/or the site to go as bare-bones as possible. In that case, it's quick and easy to take a very basic, pre-made theme and modify it.

The second is "Unique and Beautiful". Occasionally, the site's theme needs to be created from scratch so that everything displayed caters to the specific kind of content the site offers. This book is going to take you through the Unique and Beautiful route with the idea that once you know how to create a theme from scratch, you'll be more apt at understanding what to look for in other WordPress themes.

Who this book is for

This book can be used by WordPress users or visual designers (with no server-side scripting or programming experience) who are used to working with the common industry-standard tools like PhotoShop and Dreamweaver or other popular graphic, HTML, and text editors.

Regardless of your web development skill-set or level, you'll be walked through the clear, step-by-step instructions, but familiarity with a broad range of web development skills and WordPress know-how will allow you to gain maximum benefit from this book.

Are there no books available that are right for you at the moment? How about signing up to our newsletter to keep up to date?
Awards Voting Nominations Previous Winners
Judges Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software
Resources
Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software
Sort A-Z