Wordpress Themes From Scratch
Upcoming SlideShare
Loading in...5
×
 

Wordpress Themes From Scratch

on

  • 3,560 views

A quick jaunt through the steps used to create one custom Wordpress site. Presented to Santa Cruz Wordpress Meetup on August 6, 2009

A quick jaunt through the steps used to create one custom Wordpress site. Presented to Santa Cruz Wordpress Meetup on August 6, 2009

Statistics

Views

Total Views
3,560
Views on SlideShare
3,548
Embed Views
12

Actions

Likes
4
Downloads
83
Comments
0

2 Embeds 12

http://www.slideshare.net 9
http://buildcmswebsite.com 3

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Wordpress Themes From Scratch Wordpress Themes From Scratch Presentation Transcript

  • Wordpress Themes From Scratch
  • Clients They want what they want They want it quickly They will change their minds Changes should be easy
  • Wordpress as CMS Wordpress is not just for blogs Use static pages for static content Some sites don’t update frequently View slide
  • “Support the Heroes” Custom site made using Wordpress as a CMS to meet specific client requirements Wireframes for the site were created by another designer who hasn’t used Wordpress and then handed off to me View slide
  • CSS Framework Visual design is custom, gives client a unique appearance Framework should solve problems but stay out of the way Grid based CSS frameworks make layout a snap http://blueprintcss.org/
  • Grid Layouts Very flexible 24 columns, 30px wide, 10px gutters Span columns as necessary Consistent alignment looks neat and professional
  • Blueprint PSD Template Includes guides for all the columns. Layout your design so that rectangular elements fit within the grid lines You can span columns in any way you like http://konigi.com/tools/ photoshop-template- blueprint-css-comps
  • SF-Blueprint-WP SF-Blueprint-WP is a Wordpress theme based on the Blueprint CSS framework. Gives you a barebones layout that is easy to modify for a custom design http://www.slipfire.com/sf- blueprint-wp-theme-52.htm
  • Clean simple HTML ~100 lines of new or changed CSS in themes/SF-Blueprint- WP/custom.css ~100 additional lines of new CSS for styling cforms II form
  • Page Columnist Different pages had different layouts in the wireframes <!--nextpage--> by default makes a multipage post in Wordpress Page Columnist turns “pages” into columns Multi-column layout can still be easily edited by non-technical user. http://www.code-styling.de/english/ development/wordpress-plugin-page- columnist-en Warning: Plugin is hacker-unfriendly
  • Category Templates You can publish posts to specific categories Categories can have unique layouts for archives and posts Useful when “Case Study” looks different than “Blog Post” (etc) http://codex.wordpress.org/ Category_Templates
  • Custom Navigation <ul> <?php wp_list_pages('title_li=&include=2,16,29&children=1'); ?> <?php wp_list_categories('title_li=&orderby=ID'); ?> <?php wp_list_pages('title_li=&depth=1&exclude=1,2,16,29,47,49, 51'); ?> </ul> http://codex.wordpress.org/Template_Tags/wp_list_pages
  • cforms II Client needed complex admission form on site cforms II plugin makes it possible to create and edit forms using Wordpress admin interface and Wordpress database http:// www.deliciousdays.com/ cforms-plugin
  • But I don’t wanna make a theme from scratch! Where can I download a cool theme?
  • Smashing Magazine http:// www.smashingmagazine.com/ tag/wordpress/
  • So Many Themes!! Why Make a New One? Your client wants what they want That theme doesn’t exist yet
  • I found a theme, and it’s ALMOST perfect You can change it, but every theme uses different HTML and CSS, you’ll have to familiarize yourself with the author’s style
  • A new way? http://www.divine- project.com/ I haven’t tried it yet. Your guess is as good as mine. Looks shiny!