Your SlideShare is downloading. ×
WordPress: A Designer's CMS
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

WordPress: A Designer's CMS

2,791
views

Published on

for WordCamp PDX

for WordCamp PDX


0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,791
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
19
Comments
0
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. FOLLOW ALON G C HEXE E.N ET/WC PDX ( I A M ACT U A L LY I N T H E P I CTU RE )
  • 2. THE DESIGNER’S CMS
  • 3. ROOTS IN DESIGN
  • 4. ? WHAT DO WE NEED?
  • 5. The goal of any information design is to communicate a specific message to the end user in a way that is clear, accessible, and easy to understand. THE INFORMATION DESIGN HANDBOOK, JENN + KEN VISOCKY O’GRADY
  • 6. Aa
  • 7. BUILT-IN TOOLS
  • 8. WIDGETS • Drag & Drop interface • Flexible content ordering • Individually designed content area • Preserves design integrity • Not specifically for sidebars
  • 9. JQUERY MASONRY by David Desandro http://desandro.com/resources/jquery-masonry
  • 10. JQUERY MASONRY Usage ('#container').masonry({ singleMode: true }); ('#container').masonry({ columnWidth: 200 }); CODE VIA HTTP://WWW.WPLOVER.COM/1818/TUTORIAL-USING-JQUERY-MASONRY-WITH-WORDPRESS
  • 11. CUSTOM PAGE TEMPLATES
  • 12. CUSTOM PAGE TEMPLATES • Allow flexible design templates non- designers can set • Not limited to homepage, subpage, and posts • Can integrate widget areas, conditionals, and custom styles
  • 13. USAGE Just add this to the top of any file: <?php /* Template Name: Zombie Template */ ?>
  • 14. WORDPRESS CSS CLASSES • <?php body_class(); ?> • adds unique classes for categories, tags, archives, pages, page templates, posts, etc. • <?php post_class(); ?>
  • 15. USAGE <body class=”<?php body_class(); ?>”> returns <body class=”page-34 page-template etc”>
  • 16. rtl page home page-id-{page_id} blog page-parent archive page-child date parent-pageid-{parent_id} search page-template paged page-template-{page_template}-php attachment search-results error404 search-no-results single logged-in single-{post_id} paged-{page_number} postid-{post_id} single-paged-{page_number} attachmentid-{post_id} page-paged-{page_number} attachment-{mime_type} category-paged-{page_number} author tag-paged-{page_number} author-{user_nicename} date-paged-{page_number} category author-paged-{page_number} category-{category_slug} search-paged-{page_number} tag
  • 17. PLUGINS
  • 18. SIMPLE SECTION WIDGET • Creates a submenu based on the top level page of the current page • <?php simple_section_nav(); ?>
  • 19. SIMPLE SECTION WIDGET
  • 20. SIMPLE SECTION WIDGET
  • 21. TINY MCE ADVANCED
  • 22. JQUERY LIGHTBOX FOR NATIVE GALLERIES
  • 23. WP GOOGLE FONTS
  • 24. WP TYPOGRAPHY • Adds CSS classes to ampersands, quotes, etc. • Transforms TM and Registration marks • Transform fractions to appropriate entities • Prevents widows
  • 25. WTF IS A WIDOW?
  • 26. WIDOWS & ORPHANS widow my husband died :[ One of the things Ford Prefect had always found thought, their mouths probably seize up. hardest to understand about humans was their habit of continually stating and repeating the very very obvious, After a few months' consideration and observation as in It's a nice day, or You're very tall, or Oh dear you he abandoned this theory in favour of a new one. If seem to have fallen down a thirty-foot well, are you they don't keep on exercising their lips, he thought, alright? At first Ford had formed a theory to account their brains start working. After a while he for this strange behaviour. for this strange behaviour. abandoned this one as well as being obstructively If human beings don't keep exercising their lips, he cynical. orphan i have a horrible red afro and no parents :[
  • 27. PROOF DESIGNERS ARE SADISTS A common mnemonic is An orphan has no past; a widow has no future or An orphan is left behind, where as a widow must go on alone VIA WIKIPEDIA (I CAN’T MAKE THIS SHIT UP)
  • 28. WP TYPOGRAPHY • Adds CSS classes to ampersands, quotes, etc. • Transforms TM and Registration marks • Transform fractions to appropriate entities • Prevents widows orphans
  • 29. OTHER COOL SHIT
  • 30. ELASTIC • Drag-n-drop WordPress themes • Column- based elastictheme.org
  • 31. CARRINGTON BUILD • Drag-n-drop page templates • Column-based • Per-page basis crowdfavorite.com/wordpress/carrington-build
  • 32. THEME FRAMEWORKS Theme Hybrid Thematic Carrington
  • 33. TEXT EDITOR PLUGINS coda-clips.com/category/wordpress yoast.com/tools/textmate/
  • 34. THE WORDPRESS DASHBOARD
  • 35. CONTRIBUTE! GATEKEEPERS: JANE WELLS, MATT THOMAS, JOHN O’NOLAN, BEN DUNKLE • make.wordpress.org/ui • Tuesdays at 2p eastern • That means 11a western • irc.freenode.net #wordpress-ui
  • 36. real name CHELSEA OTAKAN @chexee chexee@livelylabs.com its alive! nickname DON’T not what i am doing right now PANIC