WordPress with Pods, No PHP Needed

WordPress with Pods, no PHP Needed // Josh Pollock // PodsCamp 2014

WordPress with Pods, no PHP neededJosh Pollock, @josh412

http://podscamp.org/session/wordpress-pods-php-needed/





Terminology

○ What are Custom Post Types?○ What are Custom Fields?○ What is a Pods Template?○ What is Pods Frontier?○ Pods Relationship Fields


Creating Post Types & Fields with Pods

Steps:1. Add the Post Type2. Add Field3. Add a second Post Type4. Set Relationships


Adding a Post Type Pod


Adding a Text Field


Adding an Image Field


Creating a Bidirectional Relationship (part 1)

Relationship fields allow us to select item(s) from another Pod as the values for the field.

This field be related to my second Custom Post Type "planet", which doesn't exists yet, so this is all I can do, for now.


Add a Second Post Type Pod


Add Another Image Field

Image fields are another type of relationship field. They are related to Media (the ‘attachment’ Post Type).


Creating a Bidirectional Relationship (Part 2)

This field will be related to the Jedi post type we created only, which we can select as the "Related To".


Creating a Bidirectional Relationship (Part 3)

Because I created the relationship to Jedi from Planet, I can now make the relationship Bi-directional by selecting the field in Planet, from Jedi.


Bi-Directional Relationships

Allow you to select items of one Pod as the value of a field in another Pod.

Much power, very CMS.


Pods Templates: Overview

A complete front-end system for Pods Content

● Magic Tags● Pods Frontier● Pods Frontier Auto Template


Magic Tags

Return Pods Field Value (using magic)Examples:● {@post_title}● <img src="{@image,esc_url}" />● <img src="{@image.thumbnail,esc_url}">● {@related_post_type.post_title}● {@field_name,function_name}


Escaping Magic Tag Output Properly

It’s important to escape your output properly,or else…

Example:<a href=”{@permalink,esc_url}” title=”{@post_title,esc_attr}”> {@non_html_field,esc_html}</a>


Pods Frontier

Advanced Pods Templating Capabilities● Control Blocks (each/if/else/etc.)● Add CSS and JavaScript per Template● Advanced Layout Editor (coming soon)


Using Pods Frontier: Basics

Magic tags allow us to output field values by using the field name.This includes default WordPress fields (example: post_title)


Pods Frontier !== Pods Frontier Auto Template

Sorry for the confusion, we messed up.


Using Pods Frontier: Traversal

With a dot we can "traverse" into a related field.


Using Pods Frontier: [if] Blocks

[if] blocks allow us to show content only if a field has a value.


Using Pods Frontier:[each] Loop for Multi-Select Image Fields

Inside an [each] loop we are automatically traversed into the field.

Outside [each]:{@pictures._src,esc_url}

Inside [each]:{@_src,esc_url}

Inside of an [each] we can use [once] for markup to run on first loop only.

Remember: Inside [each] loops, always reference fields from the level of the field you're looping.


Using Pods Frontier: Adding Custom CSS & JavaScript

The script and Style tags will output inline scripts/styles.<script> and <style> tags are added for you.


Using Pods Frontier:Each Loop For Multi-Select Relationship Fields

Inside of an [each] loop we don't need to use dot traversal. We are already in the related field


Using Pods Frontier Auto Template

Provides Automatic Output of Pods Templates

Single vs Archive Templates


Using Pods Frontier Auto Template


That's It. Seriously...

Questions?

What Else Can I Show You?

Software

WordPress with Pods, No PHP Needed