19
Technology Hotspot & Salon 268 14th Street, Oakland, CA 94612 | Open 11-7 Monday - Friday | Drop-in co-working space, workshops and technology services | More info: http://www.techliminal.com Content in this presentation is Copyright (c) 2010 Tech Liminal. CC-Share-Alike. Feel free to use stuff from this presentation, but leave a link to Tech Liminal WordPress Custom Fields and Metaboxes East Bay WordPress Meetup 1

WordPress Custom Fields and Metaboxes

Embed Size (px)

DESCRIPTION

Learn why and how to create custom fields and metaboxes for you

Citation preview

Page 1: WordPress Custom Fields and Metaboxes

Technology Hotspot & Salon

268 14th Street, Oakland, CA 94612 | Open 11-7 Monday - Friday | Drop-in co-working space, workshops and technology services | More info: http://www.techliminal.com

Content in this presentation is Copyright (c) 2010 Tech Liminal. CC-Share-Alike. Feel free to use stuff from this presentation, but leave a link to Tech Liminal

WordPress Custom Fields and Metaboxes

East Bay WordPress Meetup

1

Page 2: WordPress Custom Fields and Metaboxes

www.techliminal.com Content © 2011, Tech Liminal

Introduction

• Web Developer• Information Architect• 15 years of experience in

technology & marketing orgs• Freelancer, Entrepreneur

• Technology Hotspot & Salon• Co-Working• Workshops, Conferences• Expert, friendly help with web &

social media

Anca Tech Liminal

[email protected]

2

Page 3: WordPress Custom Fields and Metaboxes

www.techliminal.com

Agenda

• Why Custom Fields / Metaboxes

• Example 1: Directory Website

• Example 2: Conference Website

• WP Alchemy

• Custom Fields in the Database

3

Page 4: WordPress Custom Fields and Metaboxes

www.techliminal.com

Why?

• Custom post types + custom fields turn WordPress from a blogging/CMS into a viable tool for operating your business

• Domain knowledge (e.g. events, products, etc)

• Make it easier for users to put information in the right place

4

Page 5: WordPress Custom Fields and Metaboxes

Directory Website

5

Page 6: WordPress Custom Fields and Metaboxes

www.techliminal.com

Montclair Village Directory Website

6

Custom Information for each business

Listing by category

Page 7: WordPress Custom Fields and Metaboxes

www.techliminal.com

Montclair Village Directory Website

7

Custom MetaboxCustom Fields in the

Database

Page 8: WordPress Custom Fields and Metaboxes

www.techliminal.com

Compare With Plain Custom Fields

8

Custom Metabox “Plain” Custom Fields

•Easier to remember what needs to be filled in•Better user experience for new people

Page 9: WordPress Custom Fields and Metaboxes

www.techliminal.com

How This is Displayed

9

Page 10: WordPress Custom Fields and Metaboxes

Conference Website

10

Page 11: WordPress Custom Fields and Metaboxes

www.techliminal.com

Scenario

• International conference with events held during 1 week in September/February

• Local Event Organizers create and manage their own events

• About 300 Organizers, 1000 events each time around

• These are not WordPress experts

• They only use this tool for 8 weeks/year

11

Page 12: WordPress Custom Fields and Metaboxes

www.techliminal.com

Some Design Concerns

• Each Metabox matches to a particular part of the event organization process

• Some information is not accessible to all users

• Designed based on how the application is going to be used.

• Minimize support requests, questions, errors.

12

Page 13: WordPress Custom Fields and Metaboxes

www.techliminal.com

Event Post Type

13

•Custom Post Type + Metaboxes•Implemented in a plugin

Posts 2 Posts FTW

Custom Metabox

Custom Metabox

Page 14: WordPress Custom Fields and Metaboxes

www.techliminal.com

On The Front End

14

Page 15: WordPress Custom Fields and Metaboxes

www.techliminal.com

MetaBoxes: WP Alchemy

15

• http://www.farinspace.com/wpalchemy-metabox/

• Add to a folder in your theme or plugin

• Build HTML metaboxes

• Makes Saving and Retrieving Easier

Subfolder in my Plugin

Page 16: WordPress Custom Fields and Metaboxes

www.techliminal.com

MetaBoxes: WP Alchemy

16

mb_event_info.php - Metabox template you

control.

Page 17: WordPress Custom Fields and Metaboxes

www.techliminal.com

MetaBoxes: Putting It In the Post

17

show it only on my “event” post type (in

plugin code)

Not sure why, but it has to be loaded on init,

rather than admin_init

Individual, rather than array of, fields

Page 18: WordPress Custom Fields and Metaboxes

www.techliminal.com

What About Searches?

18

Perform the query

Add each field value to the meta_query array, with compare property

Add the Meta_query to the query args

Create an array for the custom field values to

query.

This checks for a single vlaue

Page 19: WordPress Custom Fields and Metaboxes

www.techliminal.com

Resources• WordPress for Programmers: TL Class Starting in January

• Tech Liminal WordPress Support Group

• http://techliminal.com/wordpress-support-group

• WP Alchemy: http://www.farinspace.com/wpalchemy-metabox/

• Tammy Hart’s reusable Metaboxes:

• https://github.com/tammyhart/Reusable-Custom-WordPress-Meta-Boxes

• http://codex.wordpress.org/Function_Reference/add_meta_box

• Learn about adding metaboxes

• http://codex.wordpress.org/Function_Reference/register_post_type

• Create your custom post type

• http://codex.wordpress.org/Function_Reference/get_post_meta - How to get (and set) custom fields programmatically

19