“Making it Mine”<br />Customizing a WordPress Theme<br />Tom Hapgood<br />
Teaching<br /><ul><li> Elements of Animation(iStopMotion, Flash, Cinema 4D)
 Web Design 1(Dreamweaver/WP / HTML/CSS)
 Web Design 2(Flash/video/SecondLife)
 Motion Design(Final Cut Pro, After Effects)
 Typography	(InDesign, After Effects)
 NewsFlash: The Art of Interactive Journalism	(Final Cut Pro, Flash, Vimeo, Dreamweaver)</li></li></ul><li>
The director of the girls chorus does this:<br />
She doesn’t have time (or interest) in this:<br />
WordPress structure<br />
Typical WordPress Layout<br />Header<br />Content<br />Sidebar<br />Footer<br />
Individual template files come together “on the fly”<br />when a page is requested by the web browser.<br />header.php<br ...
mySQL Database<br />(content)<br />HTML<br />CSS<br />Page structure<br /><markup code><br />Page presentation<br />(layou...
Or, you could say…<br />
CSS<br />(party)<br />HTML<br />(business)<br />
A WordPress Theme is a collection of files that work together to produce a graphical interface with an underlying unifying...
Piecing it together<br />
Header<br />
Header<br />Menu<br />
Header<br />Content<br />Menu<br />
Header<br />Content<br />Menu<br />Sidebar<br />
Header<br />Content<br />Menu<br />Sidebar<br />Footer<br />
Upcoming SlideShare
Loading in …5
×

Making it Mine: Customizing a WordPress Theme

2,785 views

Published on

Using the Ozark Girls Chorus web site as a case study, this presentation deals with customizing a WordPress theme.

Published in: Design, Technology, Business
  • Well I'm seeing the importance now of putting in Notes/Comments into the slideshow so that the slides have some sense without my narration. I tend to not use text-based slides as much as possible, to limit the boredom factor.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • I missed your presentation, Tom. So I'm looking forward to getting to enjoy it now. I heard some great raves about it.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • This isn't the latest file. There should be 60 slides (as shown by the notes below). Not sure how to get it to update to the latest file!
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Making it Mine: Customizing a WordPress Theme

  1. 1. “Making it Mine”<br />Customizing a WordPress Theme<br />Tom Hapgood<br />
  2. 2.
  3. 3.
  4. 4.
  5. 5. Teaching<br /><ul><li> Elements of Animation(iStopMotion, Flash, Cinema 4D)
  6. 6. Web Design 1(Dreamweaver/WP / HTML/CSS)
  7. 7. Web Design 2(Flash/video/SecondLife)
  8. 8. Motion Design(Final Cut Pro, After Effects)
  9. 9. Typography (InDesign, After Effects)
  10. 10. NewsFlash: The Art of Interactive Journalism (Final Cut Pro, Flash, Vimeo, Dreamweaver)</li></li></ul><li>
  11. 11.
  12. 12.
  13. 13.
  14. 14.
  15. 15.
  16. 16. The director of the girls chorus does this:<br />
  17. 17. She doesn’t have time (or interest) in this:<br />
  18. 18.
  19. 19. WordPress structure<br />
  20. 20. Typical WordPress Layout<br />Header<br />Content<br />Sidebar<br />Footer<br />
  21. 21. Individual template files come together “on the fly”<br />when a page is requested by the web browser.<br />header.php<br />content.php<br />Header<br />Content<br />Sidebar<br />sidebar.php<br />Footer<br />footer.php<br />
  22. 22.
  23. 23. mySQL Database<br />(content)<br />HTML<br />CSS<br />Page structure<br /><markup code><br />Page presentation<br />(layout, colors, type, sizes, etc.)<br />
  24. 24. Or, you could say…<br />
  25. 25. CSS<br />(party)<br />HTML<br />(business)<br />
  26. 26.
  27. 27. A WordPress Theme is a collection of files that work together to produce a graphical interface with an underlying unifying design for a weblog.<br />These files are called template files.<br />A theme modifies the way the site is displayed, without modifying the underlying software. <br />
  28. 28.
  29. 29.
  30. 30.
  31. 31.
  32. 32.
  33. 33.
  34. 34.
  35. 35. Piecing it together<br />
  36. 36.
  37. 37.
  38. 38.
  39. 39.
  40. 40.
  41. 41.
  42. 42.
  43. 43.
  44. 44.
  45. 45.
  46. 46. Header<br />
  47. 47. Header<br />Menu<br />
  48. 48. Header<br />Content<br />Menu<br />
  49. 49. Header<br />Content<br />Menu<br />Sidebar<br />
  50. 50. Header<br />Content<br />Menu<br />Sidebar<br />Footer<br />
  51. 51.
  52. 52.
  53. 53.
  54. 54.
  55. 55.
  56. 56.
  57. 57.
  58. 58.
  59. 59.
  60. 60.
  61. 61.
  62. 62.
  63. 63.
  64. 64. The site in its present form.<br />

×