Designing & Developing for Content in WordPress

36
DESIGNING AND DEVELOPING FOR CONTENT

description

Wordcamp Tampa presentation on Designing and Developing for Content in WordPress. Leverage design patterns, custom post types and custom field tools to take content to the next level.

Transcript of Designing & Developing for Content in WordPress

Page 1: Designing & Developing for Content in WordPress

DESIGNINGAND

DEVELOPINGFOR CONTENT

Page 2: Designing & Developing for Content in WordPress

FOUNDER AND CREATIVE DIRECTORTHE VERSATILITY GROUP

THEVERSATILITYGROUP.COM

DIANE KINNEY@DKINNEY

Page 3: Designing & Developing for Content in WordPress

ENDINGCONTENT-SIDEBAR

SYNDROME

Page 4: Designing & Developing for Content in WordPress

A UBIQUITOUS default design

pattern

• Back in the 90s• Typepad Moveable Type

WordPress!• Theme Templates create fill in

the content

Page 5: Designing & Developing for Content in WordPress

Together we can defeat this evil

Page 6: Designing & Developing for Content in WordPress
Page 7: Designing & Developing for Content in WordPress

Invoke the power

Page 8: Designing & Developing for Content in WordPress
Page 9: Designing & Developing for Content in WordPress
Page 10: Designing & Developing for Content in WordPress
Page 11: Designing & Developing for Content in WordPress
Page 12: Designing & Developing for Content in WordPress
Page 13: Designing & Developing for Content in WordPress
Page 14: Designing & Developing for Content in WordPress
Page 15: Designing & Developing for Content in WordPress
Page 16: Designing & Developing for Content in WordPress

Systemize Your Process

Design Patterns

Code Snippets

Basic Styles+

+

Page 17: Designing & Developing for Content in WordPress

Design Patterns

• Focus on content (not layout)

• Research

• Get abstract

• Create a library

Page 18: Designing & Developing for Content in WordPress

Design Patterns

Page 19: Designing & Developing for Content in WordPress

Design Patterns

Page 20: Designing & Developing for Content in WordPress

Design Patterns

Page 21: Designing & Developing for Content in WordPress

Design Patterns

Page 24: Designing & Developing for Content in WordPress

Now what? Code it up.

Create code snippets/gistsOnly HTML & CSSDevelop consist patterns

Gistbox is a AWESOMEPea.rs is a great model

Page 25: Designing & Developing for Content in WordPress

Implement

Custom Post Types & Custom Fields

Use together & separately

Make smart decisions

Questions to ask yourself

Must readhttp://jamessteinbach.com/wordpress/custom-post-types-

vs-acf-repeater-fields

Make smart decisions

Page 26: Designing & Developing for Content in WordPress
Page 27: Designing & Developing for Content in WordPress
Page 28: Designing & Developing for Content in WordPress
Page 30: Designing & Developing for Content in WordPress

ConsiderationsWhile projects need specific solutions, think about what you need often

• Reuse/Export• Create plugins

Page 31: Designing & Developing for Content in WordPress

Layout PatternsDesign Pattern Displays

BONUS ROUND

Have “go to” options

Page 32: Designing & Developing for Content in WordPress
Page 33: Designing & Developing for Content in WordPress
Page 34: Designing & Developing for Content in WordPress
Page 35: Designing & Developing for Content in WordPress
Page 36: Designing & Developing for Content in WordPress

FIND ME @DKINNEY- HAPPY TO HELP

THANK YOU