Click here to go to the part one of this tutorial

So we have created a new Pod or custom content type and we have added some fields to include the data we want. So now we have a publisher, Publishing date and Book Author on a book listing.

Now we are going to present that easily and automatically on our web site. To do that we need to use feature called templates. It’s disabled by default and you have to manually enable it.

Here is how to enable it.

Go to Pods menu and click on Component and click on enable.

components

and once it is  enabled Templates should appear as a drop down under Components.

So we have now created a new Pod call Books and enabled Templates. Now click on templates and add new. It will give you the following screen and name your template.

template

 

What we are going to do is actually reference the fields and the options what we have from our books. So on the right hand side under Pod Reference just click on the Books and It has a list of suggestions which is all of the different things that we can add to our template.

pods-reference

Now we need to write a little bit of HTML to make things happen. It is really easy and fun. This is how to do it.

We need to start with the curly brackets “{” and then the “@” sign. like this {@post_title}. In our case we are going to add the publisher, publishing date and the book author. You will see the dropdown list after started with {@. Then select what you want from those items which you want to display on the site. It make sense to add a label for the items. See the example.

Screen Shot 2016-02-03 at 8.07.16 PM

But if we published a template like this it will just show the plain text on the front-end. So I am going to add some HTML to style the layout a little bit. You can also style it more with CSS. One way is to add classes or ID’s and then write CSS in the theme’s custom CSS area.

html-template

Then click on the publish. There is only one more thing we need to do now in order to make this happen. We need to connect this new template to Books pod.

Click on Edit pods and click on the Books pod. Select the Auto template options.

add-template-to-the-pod

We have enabaled automatic template option and it will automatically select the template when there is a post on Books.

  • Single item view template : Select the template we designed
  • Single template location : Select where you want to show the template.

I am choosing a “after” so it will show after the post title and the main content area. And finally click on the save Pod.