WordPress has emerged as one of the most popular content management systems on the interwebs. One reason for it's popularity is its ease of use and deep support and documentation for customizations. This presentation takes a look as several easy steps to customizing the default twenty twelve WordPress theme.

1. http://j.mp/quickWP

3. Starting with Twenty Twelve Theme
• Default Theme
(everyone has it)
• Responsive
• SEO friendly
• Free
• The code is well
documented
• Good Starting
point
http://wordpress.org/themes/twentytwelve

4. Starting with TwentyTwelve
Goal: To customize the
TwentyTwelve WordPress
Theme For the Domain:
GlutenFreeGreensboro.com
http://wordpress.org/themes/twentytwelve

5. Starting with TwentyTwelve
http://addons.mozilla.org/en-
US/firefox/addon/web-developer/
• Hosted WordPress
website/blog
• Web Developer
Add-On
for Firefox
(or Chrome)
• FTP Client
(with ftp access)
• Html editor
(or text editor)

6. Starting with TwentyTwelve
https://filezilla-
project.org/download.php
• Hosted WordPress
website/blog
• Web Developer Add-
On
for Firefox
(or Chrome)
• FTP Client
(with ftp access)
• Html editor
(or text editor)

7. Starting with TwentyTwelve
http://download.cnet.com/Komodo-
Edit/3000-2212_4-139739.html
• Hosted WordPress
website/blog
• Web Developer
Add-On
for Firefox
(or Chrome)
• FTP Client
(with ftp access)
• html editor
(or text editor)

8. JetPack
http://wordpress.org/plugins/jetpack/
• Jetpack
• Woo Sidebars
• Meteor Slides

9. Woo Sidebars
http://woothemes.com/woosidebars/
• Jetpack
• Woo Sidebars
• Meteor Slides

10. Meteor Slides
http://wordpress.org/plugins/meteor-slides/
• Jetpack
• Woo Sidebars
• Meteor Slides

12. Make a Child Theme
http://codex.wordpress.org/Child_Themes
• Backup
Everything
You do!

13. Background image:
Create one, or
Download one
(Google “seamless
background image”)
Or buy one on
stock photo sites

14. Background image:
Tile Horizontally
Make background
white

15. Tile Horizontally

19. http://wordpress.org/support/top
ic/how-to-move-menu-below-
header-image-in-twenty-twelve-
Move the Header Up

20. http://wordpress.org/support/top
ic/how-to-move-menu-below-
header-image-in-twenty-twelve-
Move the Header Up

21. http://wordpress.org/support/top
ic/how-to-move-menu-below-
header-image-in-twenty-twelve-
Move the Header Up

22. Move the Header Up
http://wordpress.org/support/topic/how-to-move-
menu-below-header-image-in-twenty-twelve-theme

23. Google Fonts
Currently 629 Fonts
http://www.google.com/fonts/

24. Google Fonts

25. Google Fonts

26. Google Fonts

27. Editing the CSS (oh my!)
Using the Firefox Web
Developer Add-on

28. Editing the CSS (oh my!)
Using the Firefox Web
Developer Add-on

29. Editing the CSS (oh my!)
Copy content
of Styles.css
and paste it
into a html
editor.

30. Editing the CCC (oh my!)
Find line 697
Change
Color to
#623101

31. Editing the CSS (oh my!)
Find line 697
Change
Color to
#623101

32. Turn Off Comments on pages
Pages>
Select All>
Edit

33. Turn Off Comments on pages
Comments>
Do Not allow

34. http://glutenfreegreensboro.com/
The Result:
(still in progress)
With a few simple
modifications it
no longer looks
like the same
theme!