Custom Fields & Custom Metaboxes Overview


Published on

Sallie Goetsch provides an overview of custom fields and custom metaboxes in WordPress at the November 2012 East Bay WordPress Meetup. (These are the slides that never reached Oakland.)

Published in: Technology
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Custom Fields & Custom Metaboxes Overview

  1. 1. November 18, 2012
  2. 2.
  3. 3. Our Page
  4. 4. Ongoing Sponsor:
  5. 5. Today’s Sponsor
  6. 6. Intro to Custom Fields& Custom Metaboxes Sallie Goetsch November 18, 2012
  7. 7. FIELDS
  8. 8. What Is a Custom Field?“Arbitrary extra information”—notpart of your regular post or pagecontent
  9. 9. What Can You Put in a Custom Field?ANYTHING• Text• Images• Media• Embed codes• Links• Dates
  10. 10. How Do I Add Custom Fields?• Right in your post or page UI, below the content box.
  11. 11. Don’t See them?Check Screen Options
  12. 12. How Do Custom Fields Work?• KEY, a.k.a. NAME: The name of the custom field• VALUE: The content of the custom field
  13. 13. How Does WP Store Custom Fields?
  14. 14. How Do I Display Custom Fields?THE BASIC WAY<?php the_meta(); ?>within the loop will display the key,followed by the value.
  15. 15. Displaying Custom Fields, with Parameters This Time<?php get_post_custom_values($key, $post_id); ?>Lets you choose which custom fields todisplay.
  16. 16. Displaying Custom Fields in Genesis Themesif( $post->post_content != "" ) {echo "<div class=testimonial-story>";echo "<h3>How the WLC System Workedfor " . genesis_get_custom_field(wlc_success_name ) . "</h3>";the_content( __( [Read more...] ,genesis ) );echo "</div>";}
  17. 17. METABOXES
  18. 18. What’s a Metabox?Also known as a “write panel,” a “metabox”is one of those nice little boxes in the backend of WordPress that you use forentering or controlling content.Metaboxes let you use radio buttons, datepickers, file uploads, and other handy UIelements that custom fields don’t. Theymake life easier for your clients.
  19. 19. Function: add_meta_box<?php add_meta_box( $id, $title, $callback,$post_type, $context,$priority,$callback_args ); ?>
  20. 20. Code for a Twitter Metabox
  21. 21. What That Metabox Looks Like
  22. 22. Coding Metaboxes Is Easier With…• Meta Box Pluginor• Advanced Custom Fields Pluginor• WPAlchemy MetaBox PHP Class
  23. 23. If You Don’t Want to Code…
  24. 24. Metaboxes Created by Types Plugin WYSIWYG URL Multiple Lines
  25. 25. Display by API
  26. 26. Display as Normal Custom Fields // display speaker bio echo "<h3>About theSpeaker</h3>"; echo "<div class=speaker-bio>"; echo "<p>" .genesis_get_custom_field( wpcf-speaker-bio ) . "</p>";
  27. 27. Display with Views Plugin—I didn’t actually find compiling all these shortcodes a lot easier thanbuilding the templates myself. You still have to style the templates. So after alittle tinkering, I gave up and used Method 2.
  28. 28. More StuffAs always, you’ll find links to relatedresources, plus a copy of these slides, onthe site.You can find me, your humble presenterand harried meetup organizer,@salliegoetsch on Twitter or