Download - Designing & Developing for Content in WordPress

DESIGNINGAND

DEVELOPINGFOR CONTENT

FOUNDER AND CREATIVE DIRECTORTHE VERSATILITY GROUP

THEVERSATILITYGROUP.COM

DIANE KINNEY@DKINNEY

ENDINGCONTENT-SIDEBAR

SYNDROME

A UBIQUITOUS default design

pattern

• Back in the 90s• Typepad Moveable Type

WordPress!• Theme Templates create fill in

the content

Together we can defeat this evil

Invoke the power

Systemize Your Process

Design Patterns

Code Snippets

Basic Styles+

+

Design Patterns

• Focus on content (not layout)

• Research

• Get abstract

• Create a library

Design Patterns

Tools

Pattern TapWeb Design PatternsWelie PatternsBourbon RefillsBootstrap Components

http://patterntap.com/

http://uxpin.com/web-design-patterns.html

http://www.welie.com/patterns/

http://www.welie.com/patterns/

http://refills.bourbon.io/

http://getbootstrap.com/components/#jumbotron

Tools

Sitedrop

http://dkdesignpatterns.sitedrop.com/

Now what? Code it up.

Create code snippets/gistsOnly HTML & CSSDevelop consist patterns

Gistbox is a AWESOMEPea.rs is a great model

http://www.gistboxapp.com/

http://pea.rs/

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

ToolsWP TypesCustom Post Type UIPodsEasy Content TypesGenerate WP

Custom Field SuiteAdvanced Custom Fields

http://wp-types.com/

http://wp-types.com/

https://wordpress.org/plugins/custom-post-type-ui/http:/pods.io/

https://wordpress.org/plugins/custom-post-type-ui/http:/pods.io/

http://generatewp.com/

http://customfieldsuite.com/

http://www.advancedcustomfields.com/

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

• Reuse/Export• Create plugins

Layout PatternsDesign Pattern Displays

BONUS ROUND

Have “go to” options

FIND ME @DKINNEY- HAPPY TO HELP

THANK YOU