You don't have to be a coding ninja to bend WordPress layouts to your will. Just edit the code in three files! These slides will show you how - and why - in Genesis and Underscores.

1. Three files, unlimited design
options:
Make your site look like anything in
Genesis or Underscores.
Saturday, January 18, 14

2. 30 years a creative.
My firm: Marginhancers.
Site = brand foundation.
Marketing : revenue as brand : margin.
Saturday, January 18, 14

3. Are you too old to learn to code?
Saturday, January 18, 14

4. Saturday, January 18, 14

5. What does a WP site
look like?
Saturday, January 18, 14

6. Saturday, January 18, 14

7. Saturday, January 18, 14

8. Saturday, January 18, 14

9. Saturday, January 18, 14

10. Saturday, January 18, 14

11. Saturday, January 18, 14

12. Saturday, January 18, 14

13. Saturday, January 18, 14

14. So, great! Let’s just buy
those.
Saturday, January 18, 14

15. Saturday, January 18, 14

16. Not a great idea.
Saturday, January 18, 14

17. Saturday, January 18, 14

18. So what’s a framework,
anyway?
Saturday, January 18, 14

19. You may have heard of:
Saturday, January 18, 14

20. Saturday, January 18, 14

21. Saturday, January 18, 14

22. Saturday, January 18, 14

23. Saturday, January 18, 14

24. Saturday, January 18, 14

25. Saturday, January 18, 14

26. Saturday, January 18, 14

27. Saturday, January 18, 14

28. Saturday, January 18, 14

29. Saturday, January 18, 14

30. Saturday, January 18, 14

31. Saturday, January 18, 14

32. Layout flexibility =
control (widgets + markup).
Saturday, January 18, 14

33. Three files.
template.php
functions.php
style.css
Saturday, January 18, 14

34. template.php
Home page:
home.php
front-page.php
index.php
page_whatever.php
Saturday, January 18, 14

35. A formal Best Practices
workflow:
Saturday, January 18, 14

36. Planning: strategy, design.
Message strategy/
creative brief.
Visual texture.
PSD mockup
mood board
Style Tiles
whatever.
Saturday, January 18, 14

37. From visuals to code:
CSS defaults.
320 and up,
Foundation,
Bootstrap …
Elements:
Type
Colors
Icons
Saturday, January 18, 14
Buttons
form fields
And more.

38. Build!
@import:
type
defaults
style.css.
Saturday, January 18, 14

39. Three files.
style.css
functions.php
front-page.php
Saturday, January 18, 14

40. Saturday, January 18, 14

41. Saturday, January 18, 14

42. Saturday, January 18, 14

43. Saturday, January 18, 14

44. Saturday, January 18, 14

45. Saturday, January 18, 14

46. Saturday, January 18, 14

47. Saturday, January 18, 14

48. functions.php
Saturday, January 18, 14

49. Saturday, January 18, 14

50. index.php
Saturday, January 18, 14

51. index.php
Saturday, January 18, 14

52. front-page.php
Saturday, January 18, 14

53. index.php
Saturday, January 18, 14

54. front-page.php
Saturday, January 18, 14

55. style.css
Saturday, January 18, 14

56. Saturday, January 18, 14

57. Saturday, January 18, 14

58. Saturday, January 18, 14

59. Saturday, January 18, 14

60. Saturday, January 18, 14

61. Saturday, January 18, 14

62. Saturday, January 18, 14

63. Saturday, January 18, 14

64. Saturday, January 18, 14

65. Saturday, January 18, 14

66. Saturday, January 18, 14

67. Saturday, January 18, 14

68. Saturday, January 18, 14

69. Saturday, January 18, 14

70. Saturday, January 18, 14

71. Saturday, January 18, 14

72. Saturday, January 18, 14

73. Saturday, January 18, 14

74. Things we didn’t cover, but
can.
Saturday, January 18, 14

75. Typography.
Why do I self-host my type?
Choosing faces that work together.
Saturday, January 18, 14

76. Laying out the header - it was different in the two
frameworks.
Saturday, January 18, 14

77. Phone versions.
Phones represent more
than half of all web
traffic.
No time for a fully
responsive design?
At least make sure the
site works on a phone.
Saturday, January 18, 14

78. Meaning:
Body copy we can read.
(Not 2px cap height.)
Do you like modals?
Saturday, January 18, 14

79. Questions?
Saturday, January 18, 14

80. Thanks!
Saturday, January 18, 14

81. Saturday, January 18, 14

82. Download the files:
Saturday, January 18, 14