How To Do More With WordPress Using Custom Post Types & Custom Fields

by Adam @ WPCrafter   |   Last Updated: July 17, 2019
Share on facebook
Share on twitter
Share on linkedin
Share on pinterest
Share on email

WordPress can store and display much more than pages/posts and in this tutorial, I will teach you how to create a custom portfolio from scratch using PODS.

Links To Everything From The Video:

Astra Theme


Astra is a free WordPress theme that has excellent speed and simplicity. Pair it with Astra Sites (free plugin), and anyone can have a beautiful website with a few mouse clicks. There is also a Pro version available that makes Astra the perfect theme.

Key Astra Theme Features:

  • One Of The Fastest Themes Available
  • Over 100 Starter Sites (Most Are 100% Free)
  • Flexable Mega Menu Feature
  • Powerful Add-on Package
  • Extensive WooCommerce Support
  • Extensive LearnDash Support

Astra Theme is an excellent choice for any WordPress web design project. In fact, it is the theme that I am using on this website and all of my website projects.

I have full confidence in the developer and have been very impressed with how well coded the theme is.

But more then that, the theme is so simple to use because of all of the care and thought that has gone into it. In most situations, it configures itself based on the tools you are using.

Check Out Astra Theme

Beaver Builder


Beaver Builder is a WordPress page builder that is loved by website developers and DIYers alike. It's reputations of being developer friendly, having clean code, and reliable updates have led to it being used on over one million websites.

Key Beaver Builder Features:

  • Fast Front End Page Builder
  • Full Template & Block Library
  • Modern Design Features, Gradients, Drop Shaddows
  • Most Reliable Page Builder Available
  • Ideal Page Builder For Agencies
  • Whitelable Option On Higher Package

Beaver Builder is a fantastic page builder that I personally use. When you pair it with Beaver Themer, there is no limit as to what you can build for yourself and for your clients. This is the exact combo that I use, and simply couldn't create what I am now able to create without it.

Check Out Beaver Builder

Beaver Themer


Beaver Themer is an add-on for Beaver Builder that gives you the ability to use your WordPress page builder to build your entire website.

Key Beaver Themer Features:

  • Create custom headers & footers
  • Create blog post templates
  • Create WooCommerce templates
  • Create custom post type templates
  • Create archive templates
  • Create theme parts

Beaver Themer is 100% worth every penny! I really mean that. The powerful features that it gives you matched with how easy it is to use, make it a winning tool for beginners and experienced developers at the same time.

Check Out Beaver Themer

Elementor


Elementor is a WordPress page builder that has taken WordPress web design by storm. It had the deepest feature set, yet is very easy to use and master. Elementor is the most full-featured free page builder. There is also a Pro add-on to add additional developer features.

Key Elementor Features:

  • Live Front End Page Editor
  • Website Personalication Features
  • Template & Block Library
  • Extensive Mobile Responsive Options
  • Most Powerful Popup Builder
  • PRO Create Custom Headers / Footers
  • PRO Create Post Type Layouts

Elementor is the strongest page builder currently available. They consistently release new features that are in line with current design trends. This means you will be able to keep your website relevant.

Elementor Pro is an incredible value considering all the additional modules and power features that it includes.

If I were starting a new website project today, Elementor would be the page builder that I would choose. I consider it a must have WordPress page builder that is a pleasure to use.

Check Out Elementor

Ultimate Addons For Beaver Builder


UABB for short is the best Beaver Builder add-on package that adds numerous new modules, sections, and full-page templates to Beaver Builder.

Key Ultimate Addons For Beaver Builder Features:

  • Over 45 New Modules
  • 100+ Page Templates
  • Fully Designed Sections
  • Fastest Add-on Package
  • Great Support Staff

Backed by a solid company, Ultimate Addons for Beaver Builder is the most reliable add-on package available for Beaver Builder. It is the only add-on package for Beaver Builder that I trust.

Check Out Ultimate Addons For Beaver Builder

Video Transcript

In this video I’m going to show you how to
pull back the curtains I want to show you

how to do so much more with your WordPress
website versus just making posts and pages

I’m talking about your learn how to create
custom post types where you can put other

types of information that doesn’t really necessarily
fit in a post or a page and if you want a

WordPress website or you are making websites
for clients now after watching this video

you’re going to be able to make more dynamic
solutions for them and it’s going to end up

making your website that much more powerful
content and feature rich hi my name is Adam

from WP crafter.com where I make a ton of
content to help you get better results with

WordPress faster if you know your consider
clicking on the subscribe button and if you

don’t want to miss a thing click on the notification
belt and you too will let you know when I

upload a new video so this is to be a longer
video because I’m going to show you something

very fundamental there learn how to create
custom post types urinal learn how to create

custom fields you’re also going to learn how
to make templates though for the front and

the visual templates for those custom post
type options and I couldn’t be more excited

to bring this video to you I’m going to be
using something called PODS it’s a free and

it’s open source and assure you that in the
video and he was PODS I’m also to show how

to create templates with your page builder
so you’re gonna want to stick around for that

as well just be forewarned it’s good to be
more than one page builder so if you’re a

diehard fan of wanting you hate the other
just know you can just skip that part you

know this video can be for everyone just skip
that little part but I’m showing you the exact

stuff that I’m using right now to power my
website and I’ve can’t wait to share this

information with you so okay enough talking
let’s just get started with this video so

here is my fresh installation of WordPress
and you could see right here it just as the

default theme so before I get too much into
the pods I wanted to make the website look

better than this so I’m in a just download
a theme really quick and get a beautiful website

going someone to go to themes add new and
I want to put the free Astra Theme pay here

it is to click on install and I’m a to go
ahead and activate this now what’s nice about

this theme and the reason I chose it is because
they also have a free plug-in that will essentially

create an entire website for you in just a
few mouse clicks and it’s called Astra sites

you can just do a search for the word asteroid
and here it is on the go ahead and install

that right now this is literally the fastest
way to get a beautiful website and it’s all

completely free so I’m a go ahead here and
under appearance click on Astra Sites and

it’s gonna show me a variety of sites that
I can choose from and choose your page builder

of choice and so the one that I want to choose
is down here because I’m in a make a portfolio

so I thought help with this web design studio
website so I’m in a click where it says details

and preview I’m the click on install plug-ins
it’s just gonna take a moment and it’s can

install these four plug-ins essentially are
page builder of course him to show you how

to use more than one page builder with PODS
and us can put this contact form this widgets

is really for this button here in the header
and you can do some other stuff with it and

then to spruce up the page a little bit more
it’s can add this ultimate add-ons for Beaver

Builder lights okay nothing to put those for
plug-in summit click on import site and I’m

in a click on okay basically to wipe everything
out and put this beautiful site in its place

and I just wanted to do it this way because
I didn’t want to use the kind of ugly default

WordPress theme for what were doing here right
so it’s done I can click on this X and you

can see when I click on refresh that we can
have this a beautifully designed website and

it was really just a few mouse clicks to get
this in itself full website with different

pages for the menu there is literally no faster
way to get a beautiful website okay and everything

was free so far right so now let’s get pods
on our website plug-ins add new and then I’m

going to do the search for PODS and here it
comes up so what I want you to do before moving

forward I’m not actually going to use this
version and the next week or two there gonna

have a new version that’s released so if you
click on more details and it says right here

the version number it says 2.6.11 while I
want to use version 2.7 and it hasn’t quite

hit the repo yet so if you’re watching this
video in about a month or two and this is

2.7 go ahead and install it here but for the
purposes of this video I’m in a go to their

website because I want to use this 2.7 version
no sense of making a tutorial on a version

that’s going to be replaced soon so for me
I have to go ahead and click right here and

it’s gonna take me over to actually just downloaded
it right away for me so now I have been on

my local computer and I can install it manually
but like I said if this is version 2.7 for

you go ahead and install it and you are off
to the races and most likely that’s what’s

can happen for you so for me now I have to
click on upload plug-in and then I have to

drag and drop this over here it is on my computer
just drag-and-drop and do this in a stall

now and it’s going to go ahead and install
this version of PODS it has a lot of improvements

and that’s why want to use it for this tutorial
so my go ahead and activate this now and it’s

can add this new option right here that’s
his PODS admin so I’m in a go ahead and click

on it and will start digging into PODS so
the first thing you’re presented with is the

option right here to create a new custom post
type taxonomy or a custom settings page now

I once made a video on this custom settings
page but were pretty much gonna be in this

post type category for this video and this
extend existing this is if you want to add

something called custom fields to maybe a
blog post or a page or if you’re using WooCommerce

you want to add a custom field to the product
pages you could do that as well with this

extend existing but before we do that I want
to go ahead and click on this components option

to show you a couple options that you have
available to you so here are some components

that you can enable if you wanted to and one
of him that I think is really neat is this

option right here where it says migrate packages
and what this is going to allow you to do

is everything you do in the one website you
can easily and uptight about creating the

custom post type in the custom fields with
this enabled you can literally export and

import it very easily to other websites so
if your website developer or everything you

just created you’d like to use on another
website you can easily do that by enabling

this Psalm to go ahead and enable it and I’ll
show you how to do that after we’ve created

everything but you can see right here it’s
is my great packages this wasn’t there before

but it’s here now okay so now let’s go back
to add new and what were you to do first is

working to create a new custom post types,
to click on this option right here and then

here is the option I would choose what I’m
creating and by default it has this custom

post type option chosen and then right here
we need to create our labels or choose our

label eminent go with the word portfolio however
there really is no singular or plural way

of saying portfolios it’s not like for example
the word reviews reviews you could say review

it singular and plural of the word to mean
multiple review reviews was the word reviews

but for portfolio it’s the same just keep
that in mind with other custom post types

your you’re creating something to show you
portfolio and it’s going to be the same for

both I guess you could say for singular portfolio
item or whatever but in this case I’m just

gonna put the same word in both so I’ll enter
that now actually on second thought I decided

to just call the singular label portfolio
item because I think it might make more sense

and this is mostly used for the user interface
here so my go ahead and click on next step

and it’s gonna take me here so now I’ve created
this new custom post-here’s a bunch of options

for Ed but it first takes you here where we
can create some custom fields that we want

to for this new custom post type and if you
notice your on the left it now says portfolio

and we can actually change this little icon
here as well so when I named it portfolio

that’s where this name is generated right
here so let’s quickly take a look at these

options and then will come back to manage
fields and will go ahead and create some custom

fields for the portfolio so for someone to
look at labels now these are essentially just

labels what they look like here in the back
and now one thing I’ve noticed through my

own personal usage of PODS is you don’t want
to be afraid of breaking something because

you can always come back here and change it
back so don’t be afraid of setting the wrong

thing when you’re trying things out really
these are just the labels and we can change

them to something else if we wanted it to
say something else so you know how when I

hover over portfolio it says all portfolio
add new these are all going to be set what

the text is is going to be said here in these
are just the various labels I usually just

leave this all the same okay so now it’s click
on admin UI now these are more settings for

how this is going to visually appear and where
it’s going to visually appear here on the

admin bar now what I usually adjust here is
I like to put a different menu icon instead

of this this thumbtack right here and you
can also change the menu position I usually

leave that the way it is but you do have this
granular control over that so for the menu

icon you can hover over the?

And then here’s a link and it takes you over
to a website where you can choose a different

icon so here it is right here and here’s a
variety of icons that we can choose from pretty

much whichever one we want so we you can literally
just come here and look through and choose

one and instead of that thumbtack it will
show the new icon that you’ve chosen so I

guess I’m just going to go ahead and choose
one I’ll just choose this random one right

here so I’m gonna go ahead and click on it
like this and then there it is all you have

to do is copy this little bit of text right
here put into your clipboard and then when

you come here you can go ahead and paste it
in like that and then click on save pod and

we should see a change see how it’s not that
thumbtack anymore it’s this different icon

it was pretty simple to do there and you can
change this is much as you want and if you

didn’t even want this custom post type in
the navigation have options for that as well

but just you know off to the different titles
for these labels you can just go ahead and

click on the?

Like that and see what it says that this option
does like I said don’t be afraid to test things

I can uncheck this and then if I don’t like
how it looks I can check it right back so

there’s nothing to worry about now let’s take
a look at these advanced options that we have

now is some of these options you may want
to dig into them so this would be if you want

your custom post type to not be public now
for me I do want to be public I’m just making

a portfolio and I want people to search but
you can do so many advanced things with PODS

and custom post types really for your website
and there’s times where you might want to

make something that you don’t want on the
front end of the website because you’re linking

that data in other locations here’s another
option exclude from search so someone’s searching

on your website if you don’t want what is
created in PODS or this particular custom

post type to show up you can just go ahead
and check this box and it won’t show and there’s

a variety of options here if you want to have
more control over how the custom post type

operates one of the ones I like to enable
is this right here so what this is going to

do is you know how if you have a blog you
have what’s called your blog archive page

where you click on that and it shows a list
of all of the blog posts will this is the

same thing to enable an archive page just
for this custom post type and then right here

you can choose a unique slug for that but
for me it’s going to go ahead and choose portfolio

automatically but if you wanted that to be
something different you can make that something

different so when I hover over here it says
by default it’s going to be the slug what

you what we named the custom post type and
that’s actually what I want and there’s just

more control that you have here I usually
cannot leave this all pretty much the same

except right here I will enable whatever features
I want in that custom post type and these

are your typical features that you see in
a blog post so if I wanted to list the author

which I don’t in this case I would check this
box featured image I do want that because

him and have the portfolio item be that featured
image some to go ahead and check that excerpt

if I wanted that her TrackBacks custom fields
comments you can go ahead revisions is always

actually good you can just go ahead and choose
it by checking on this box here now like I

said before you can you can check it and then
you come back and uncheck it so don’t be afraid

to break something now right here it says
built-in taxonomies with this is if you wanted

categories you can categorize your portfolio
items are tags so you can put tags on these

portfolio items you can do that by checking
these boxes and it will use the whole the

same categories in the same tags that you’re
creating for your posts now you can also go

and create in pods a separate category section
just for the portfolio in a separate section

of tags that suggest for the portfolio so
if you want that you can check on it here

and you can go ahead and create your own alright
so I made some changes here to go ahead and

click on save pod and were were making some
progress here for sure now I never do anything

this auto template options right here and
I’ve never really done anything here in the

rest API options is or could be or more advanced
things right there so now let’s go ahead and

get into the process of creating custom fields
now what I want to do first I want to go to

portfolio and I want to click on add new and
so it’s been a look here it is it’s gonna

look exactly like are very similar to when
you want to add a new poster page but it’s

only showing those items that we selected
site and select have comments and have TrackBacks

and have excerpts and all of that so that’s
why right now I’m just getting the option

of a title this text box right here when I
scroll down the featured image I don’t have

categories here in tags here because I didn’t
enable those if I want them I can go and enable

them very easily and then they would show
here on this page this right here this Astro

settings is relieved from the theme okay so
that is what this looks like now when we add

custom fields there can appear in this space
down here and that’s just a good way to separate

the information so there all the information
isn’t right here okay someone to go back to

edit pods and I’m a go ahead and click on
add field and we have this box here and there’s

these four tabs so the first thing were going
to do is give the name of the custom field

are actually were just gonna put the label
the name is going to be auto generated and

then we have the option here to choose a field
type so let me put a label in right now so

I put the word website and I’m assuming that
this is a portfolio of web design work and

when I’m putting website I want to actually
have a link to the website so you’ll see when

I click away and click on name it automatically
generates the name just leave what it auto

generates is essentially to make everything
lowercase and it’s going to put replace spaces

with a-you can put a description I never do
because I’m lazy okay so let’s take a look

right here at field type and it’s a drop-down
right here and actually it’s not shy it’s

getting a little cut off in my browser here
so sorry about that so these are different

field types we have plaintext website which
is a URL which is when I’m to choose a phone

number email address and password now the
reason you want to put a website here a phone

number here in an email here’s it’s because
it’s gonna retain that proper formatting for

you okay and so for the phone number you’re
knocking to be able to put in letters it’s

only gonna take the phone numbers are the
numbers and then we have the paragraph option

so you can have up a block for paragraph text
you have this what you see is what you get

visual editor and this is similar to what
Yorty have in WordPress right here right where

you can go visual and you can have text so
when it’s on visual you have these options

and so that’s what that is okay and you have
code in this would just accept code in the

block I’ll actually use this in the portfolio
as a demonstration you have date and time

date and time separately numbers currencies
and then down here we have some relationship

options we have file image and video we have
only embedded relationship sorry it’s getting

cut off there and then we have a yes or no
option and a color picker so these are the

various field types that you can choose so
for me I’m going website on this and then

right here you can choose if you wanted to
be required what that means is it won’t save

unless that’s actually entered okay Sonoma
to go ahead and click on additional field

options now this is going to dynamically change
these these field options based upon what

the field type actually is so these are just
field options for the field type that you

chose that’s why for me for formatted showing
okay what’s the format here of the URL so

with this one here I can pretty much put whatever
I want here it forces it to not have the WW

W and etc. and that’s just pretty much his
options here so I like this is just the the

proper format and here some other options
if you want to allow Porton the URL that’s

more of a technical thing output as a link
and leave it like that and maximum lengths

that so many characters you can enter and
this enable HTML 5 input field no believe

that the way it is and the placeholder believe
that the weight is that we have some advanced

options right here in this is about styling
gittin who can see the field option I never

usually mess with any of this and for the
visibility I’m not using this for a clients

website but you might want to restrict things
based upon if you give your clients a login

that is something other than an admin login
you can restrict the visibility of this okay

so to go ahead and click on save field and
we have this new field here and I want to

go ahead and click on save pod and it’s going
to save it so now when I go back here we don’t

have an options any options down here but
if I click on it refreshed just like this

you can see now it’s listing these additional
fields and we have this*next to it because

it wants a website it needs to be in there
and that’s how easy it is to add custom fields

and you can add as many as you want and you
can rearrange them with this little handle

here on the side so that they are in the order
that you want them to be right here so the

next custom field I’m going to add is I do
not think of him might want to spruce this

sucker up mama video guy let’s put a video
and there some ago on add field like this

and I’m in a call this the for this label
I’m in a put video and then you could get

away with putting a video and lots of different
ways but what I want to do is I want to just

put it in a code syntax highlighting like
this now if it’s just good to be used to you

could get away with putting it in the plain
text field here that’s actually what I do

on some of my websites but if it’s a EA video
embed code which is typically referred to

as an I-frame where you may have them Io and
they give you a whole big snippet a coder

I use something called VooPlayer and I get
this big old snippet of code I find that this

is the better field for this code syntax highlight
and excellent to go back I want to make that

required now is take a look at the different
field options and if I want to allow shortcodes

in here I would enable this I don’t actually
want to do that and for the maximum length

you could see it’s defaulting here to zero
I think that might mean unlimited I’m in a

test that out right now so I want to go ahead
and click on save field on this one and now

we have the two fields here to do a save pod
in a minute do a refresh here on the different

the portfolio item and you can see it looks
like a code enter I can just go ahead and

enter Mike my my code right there and it will
do the cool things with the code word changes

the colors on certain parts of it and that
one day I wishes there was more control over

the height of this box but I am not getting
that there might be a setting for that that

I’m not aware of and like you said you can
rearrange these so if I wanted to go like

this now videos above website click on save
pod and I’ll go to the front and do a quick

refresh and you can see that the order has
changed for these two actually but I can tweak

it to get it half the size and I think on
my website I do have it half the size I use

that particular field okay so what to do now
some to go ahead and start adding some of

these custom fields real quick okay so I didn’t
want to be too complicated here I just have

these four custom fields I put costs and this
would just be the cost of the project I put

industry and of course you saw me do video
and website so I’m in a go ahead and roll

with that when the go ahead and click on save
pod and when I come here and do a quicker

refresh you’re gonna see that here’s my fields
I got these four fields and I’m really have

more pieces of info than that I’ve got my
title I’ve got this block here of text that

I’m in a put with the portfolio I got cost
industry video website and then I have this

option here to put a featured image so what
am I to do now is go ahead and put three different

portfolio items in here and then we can see
how this looks on the front end okay so I’ve

created these three portfolio entries and
you can see what I put here for the title

when we go ahead and click on that first when
I created dietitian to go ahead and click

here and you can see that I put a little bit
of text here for the title some here in the

paragraph I put a cost in industry I put a
video link right there embed code and I put

a website URL and I put an image in that’s
what I did for all three of these items right

here I did that for all three of them now
let’s see what they look like on the front

end of the websites all go ahead to the dietitian
go ahead and open up in that the view link

right here in a different tab and so you can
see how it looks by default now this is really

good to be treated just like a blog post okay
so we have the featured image we have the

title and we have this bit of text here and
is not showing the custom fields just yet

so this how it looks right now is largely
based upon the theme that you’re using and

the options that they give you on how to display
the content for blog posts and there it is

it right here and notice the URL it’s the
front part of the URL and then it says portfolio

item and that’s with the slug it gives these
individual portfolio items and then right

here it says the it’s pulling in the title
that I created for this custom post type right

here that I created this portfolio item you
have control over this middle slug so we didn’t

have to choose the word portfolio item and
you can even change this to be something different

even though its portfolio item in the back
ends you can play around and have full control

over all of that now let’s see what it looks
like when were looking at that archive page

so right now that is going to be just removing
this part right here who probably don’t want

to change it so this is how it’s looking right
now we might want is changes that should just

say portfolio instead of portfolio items so
in this process were to go ahead and make

a tweak to that you concedes is archives portfolio
and this is largely dictated by your theme

as well whatever the default styles that they
offer for archive pages that’s pretty much

how it’s going to end up looking and so you
can see the three that we created here now

we done a lot actually it’s very powerful
you can see we’ve created this separate category

here of content called portfolio and a you
can store data in here and it’s can be separate

from posts and pages and is going to make
a real nice and tidy experience back here

and what we want to do now is let’s fix those
minor things like this slug from same portfolio

item to say portfolio let’s go ahead and fix
that and then working a look at changing the

way that the individual portfolio items look
here and then we’ll look at making some tweaks

to the archive page that we have so okay I
want to go back here to where we had our pod

now it’s going to be under I think was under
advanced options so right here it says enable

archive page and this is archive page slug
override so right here and go ahead and put

the word portfolio realistically you can put
anything you want here to go ahead and click

on save pod and then right here oops let me
go right here and still quick refresh and

let’s see what happens when we now go back
to where was portfolio item yet that’s what

I was expecting because we change the slug
to be portfolio and then here it is so what

to pay attention the slugs to have a slug
that not only makes sense to a visitor but

also makes sense to Google from an SCO perspective
and portfolio just fits a lot better for the

archive page than having it say portfolio
item so now let’s go ahead and click back

into one and were looking at the makeup artist
let me show you how to get those custom field

values in here okay so that was makeup artists
and here we are so now if working to use just

this text editor to display those custom fields
right here the way PODS does it is a via shortcodes

and they have this option here so we can figure
out what those shortcodes are but what you

already know the format of the short code
you won’t need to click on this you’ll be

able to just modify some of the text in the
short code so let’s go ahead and take a look

at it by clicking here and the first question
is to see what you want to do and you can

display where we is what we want actually
want to display a field from this particular

item and then right here we want to put the
field name so for me right now I’ll go ahead

and enter cost memo to go ahead and click
on insert and then there it puts it and I

think it might need to be lowercase let’s
check some to go ahead and click on update

here and then let’s go to the front end and
let’s do a quick refresh and it’s going to

peer down here actually did that even refresh
okay there we go yeah I think it wasn’t formatted

properly I think I need to go lower case like
this and let’s see what happens now came doing

a refresh makeup artist makeup artist and
to do a refresh there it is okay so yes it

was case-sensitive like I imagined if I go
back to the original pod here is that field

the name that it’s looking for so I put the
label which was the C you really want to use

what exactly what it says right here for it
to display and you notice since I chose the

field type currency it formatted it to a currency
like that okay so we have that that’s nice

so really to show the next other four are
three custom fields we just can go ahead and

do a quick copy and paste like this and then
change the slug so the next one was industry

and I just went ahead and filled them all
out, go ahead and click on updates and now

when I go to the front end and do a refresh
we have it all right here okay right here

we have the industry and then right here we
have the video and I used an embed code now

this video I have a strict video security
and that realizes I’m trying to play video

on an unauthorized URL this is so people don’t
so my videos and then right here I have the

website address so on the surface you can
go ahead and try to work within these parameters

to make this look the way you want but it’s
going to be a little hard to make it look

pretty and I don’t to do it this way myself
so what you might want to do is use a page

builder but if you notice the problem right
here is there’s no option for a page builder

in the beginning of this video I put a page
builder in and usually you would see an option

here and so most page builders when you install
them by default there only configured to work

on either just pages or pages and posts but
the will be an option in the page builders

a setting panel to go in there and enable
it on the custom post types and in this one

more specifically portfolio so I’m in actually
show you how to go about doing that right

now using Beaver Builder since it’s the page
builder I have installed right now so Beaver

Builder has settings under the settings panel
and then page builder soma to go ahead and

open that settings panel up and you can see
right here it says post types and then here

is where you can choose what you post types
to show it on so by default it’s just pages

but we can check this box here for portfolio
and then click on save post type now it’s

going to be very similar using a mentor and
is can be very similar using Divi where you

would just go ahead and enable it and I’d
imagine on most page builders it’s going to

be pretty much the same so right here I am
where I can edit this portfolio item if I

do a refresh on this page.

You see we now have the page builder option
right there and we can start using that to

create a nice layout where were dropping these
shortcodes kind of in a layout where we want

to to do it in the same ways can work with
Elementor as matter fact let me just go ahead

and pop Elementor in really quick just so
you can see how that works with a different

page builder okay so I’ve downloaded and installed
and activated Elementor and yes for the record

you can have more than one page builder on
the same site which is not recommended to

use more than one page builder on the same
age so I get that question a lot so in Elementor

if I go here let’s see it’s probably in the
settings here it should be up there it is

post types and so by default Elementor skin
to be enabled for posts and pages and if I

click on this right here it’s now going to
be available here on this particular custom

post type so when I do a refresh will probably
see the edit with Elementor button option

right there and so this is how your unit get
the option to create unique layouts on a one

by one individual basis using one of these
page builders right here that’s one way of

doing it now since you’re probably gonna want
all of the various portfolio options or all

the content were going to create input in
this portfolio custom point post type you’re

probably gonna want the layout to be the same
on all of them it can be kind of a pain in

the rear end to manually add a layout to each
and every item as you add it now certainly

if you don’t have a lot of items you’re going
to put in here it’s totally doable to to manually

while on a one-on-one basis go into the page
builder on each individual item load up a

template or whatever that you have safe and
is pretty much can be doable because these

is stay the same on every single item that
you create in this portfolio these don’t stay

the same these don’t change it doesn’t take
cost-makeup artist so you can use that on

a different item in the portfolio now that’s
manageable and it’s definitely a more budget

friendly way of making these portfolio items
look beautiful now that’s not the way that

I use it there is now options where you can
create a template that applies to all of the

items and the benefit of that if you have
one that template so you create the design

at one time and you apply it to everything
that is a portfolio item makes it more manageable

to go and make a change later on you can go
later in say you want to change the color

or just change some positioning you would
only due to the one template but if you go

into each portfolio item and going to edit
it with your page builder what happens is

what happens when you want it change of color
remove something you have to manually going

to each and every single one to do it it could
be very very tedious and they can be overwhelming

depending on how many portfolio you items
you have so by far the superior or more efficient

way of doing this would be to simply create
a template that is applied to portfolio items

now there is a co-owner way of doing it hand
coding the template that is not my way of

doing things and that’s not the way that I
talk about doing things on this channel so

I’m in a show you how you can create these
templates now you can actually do it for Elementor

or for Beaver Builder now with Elementor you
have to buy something it’s good to be $25

with Beaver Builder you have to purchase something
called Beaver Themer on my website I’m using

the Beaver Themer Way of doing it it’s just
a bit more superior so let me go ahead and

demonstrate the some to do with Elementor
first because it’s going to be really fast

because it’s a bit more limiting so you have
to go ahead and get this plug-in called anywhere

Elementor Pro it’s 25 bucks for a single site
license and the 99 for unlimited site so I

already have it on my computer here I was
going to go ahead and install it really quick

and show you how that works so minute goal
drag-and-drop click on install now and then

after this and want to show you how cool it
is to do it with the Beaver Builder in Beaver

Themer so is called anywhere Elementor Pro,
click on activate just like this and I’m not

in a pot my license key and I do have one
and so now you have this new option right

here called ADE templates some ago in a minute
click all AE template so basically working

to create an anywhere Elementor global template
it’s gonna be real simple, click add new and

let’s just name this portfolio template there
it is portfolio item template so will just

name it like that and then right here were
going to choose where working apply this template

so when I go to this drop-down I’m in a choose
right here where it says post template I’m

pretty sure that’s it and then right here
I can choose my post type and so we know it’s

portfolio like this and we can choose a preview
post and so let’s make it the makeup artists

there is I chose makeup artist like that and
then I’m in a go ahead and click on the publish

okay so I just created this portfolio item
template so now what happens is on the click

on edit with Elementor it’s going to pop over
in Elementor right now and one of things I

love about the Astra Theme it knows if you’re
using a page builder and it automatically

will make it fullwidth get rid of your sidebar
get rid of your page title it’s one of the

things I really love about using this Astra
Theme so I’m a show you this really really

quick so now you can start basically creating
your page layout so anywhere Elementor Pro

added these items right here so if I wanted
to add the title I can just drag and drop

that right there and there is the title I
can style that up but if you notice I’m using

anywhere Elementor’s modules I’m not using
the Elementor once it doesn’t work like that’s

your limited to visa modules here that come
with anywhere Elementor so let me get to the

nitty-gritty and it’s really showing how to
get the custom field data in this layout so

the way I’m going to do that is actually here
let’s go ahead and get the post image and

this is pulling from the featured image and
so we can do that and now what I want to do

is choose this custom field option that it
has right here there it is AE custom field

summit go like this into AE custom field and
I need to put that same field name now remember

it’s going to be right here these are our
field names so let me just put industry so

I’m in a type right here industry there is
industry and you can see now it’s pulled it

in and that I can go here and start styling
it but like I said your you’re limited to

the options here now for the other different
field types I can just choose right here what

field type that it is now the only thing that
I’ve always said about this solution why it’s

not the greatest is because I can’t use the
Elementor modules I’m stuck using these right

here which aren’t as feature deep as you get
with Elementor it’s self so this is how you

would go and make a beautiful layout and this
will now apply to the makeup artist electrician

all of the different portfolio items this
template will will apply to it actually here

let’s just go ahead and do that I want to
go ahead and click on save and let’s go ahead

and get out of here let’s do a go to dashboard
and then were right back here let’s see if

it applied it might not have applied let’s
see if it did okay it didn’t I think I have

to choose this option here that said auto
apply let me do an update like this and then

I want to go here do a refresh and up see
there it is it auto applied right right there

now because Astro doesn’t see that I’m using
a page builder on this page right here it

kept these options there off to the side where
I would have to go ahead and edit those okay

so that that is okay let me actually go to
the index page here and show you how that’s

the makeup artist but if I click right here
into the electrician it’s going to be the

same thing so now every portfolio I item my
ad is going to have this layout so this was

doing it with anywhere Elementor let me remove
this and disable this and disable Elementor

and demonstrate how to do with beaver builder
right now some to go to plug-ins and to go

ahead and deactivate this and while I’m at
it I’ll just deactivate Elementor and Elementor

your great I just want to deactivate okay
so now when I go back here and I do refresh

it should reset back to the default layout
okay so for Beaver Builder I’m going to need

to go and install Beaver Themer to go to add
new not have links to everything down below

don’t worry I’ll have links to Beaver Builder
Beaver Themer Elementor PODS all of it so

I really have Beaver Themer it’s a plug-in
downloaded to my computer now Beaver Themer

it’s not a inexpensive plug and it’s $147
with about $47 more than that anywhere Elementor

Pro plug-in that I just showed you so okay
let me just grab it here for my computer drag-and-drop

do a quick install it’s gonna take a moment
now here’s the thing there is a user in the

Beaver Builder community name Bernardin and
I’m probably pronouncing his name just a little

off he created an integration between PODS
and Beaver Themer that makes this process

unbelievably powerful and easy okay so were
going to want to add that plug in some to

go to add new and when you type the word PODS
in the search check out what we have right

here PODS Beaver Themer add-on and this is
amazing some go ahead and click on install

now and Emma to go ahead and activate this
alright so now when I go back to my portfolio

and I go into my portfolio item we should
just have Beaver Builder is an option but

when I can actually use Beaver Builder on
these pages we can actually remove it because

instead were going to use it Beaver Themer
and working to go ahead and make a global

template to apply to all of these alright
so I’m a do quick hard refresh to go back

into settings and going to page builder and
I’m going to just remove it from the post

type right here and click on save post types
actually just realized something there should

be a Beaver Builder option here and I didn’t
actually install the paid version of Beaver

Builder I just left a free Elementor’s let
me go back to plug-ins that’s why I don’t

see my Beaver Builder option so if we see
here you can see I got the free version of

Beaver Builder that’s not what I want I got
the to install the paid version some of the

go to add new upload plug-in and Harry go
there is Beaver Builder okay, go ahead and

click on install now and now I’m going to
get those Beaver Themer options that I was

looking for what you want to do though if
you’re switching from the light version to

the paid version of Beaver Builder you need
to deactivate the light version so right here

is giving me some warnings on that what I
need to do is go ahead and deactivate the

light version and you can also go ahead and
deleted as well and now I’m using what I needed

which was the standard version right here
and I should be good to go Sonoma to do a

quick refresh of the page okay and because
I activated Beaver Themer before having the

paid version of Beaver Builder in you need
to deactivate and then reactivate Beaver Themer

and then what happens is Juergen and now have
this builder option right here this is what

you get is unique to Beaver Themer and this
is where we can start unlocking and playing

with the power of Beaver Themer someone go
ahead and click on builder and I’m going to

create a theme layout so click on add new
and then I’m gonna go ahead and put my title

in their ego portfolio item templates and
Beaver Themer superpowerful you can create

lots of different things so I’m in a choose
the theme layout right here and then for layout

I’m in a go ahead and choose singular so I’m
going to go and click on add theme layout

now right here is where we choose what this
layouts can apply to so for location I’m in

a go and head and choose right here where
it says portfolio item and right here you

can just have it be specific portfolio items
are all of them so I’m in a go ahead and apply

this to all portfolio items like that for
all users you have some amazing targeting

rules with Beaver Themer here right someone
to go ahead and click on publish and then

a minute click on launch page builder and
now working to be in sight of Beaver Builder

2.0 which just launched since I haven’t gone
into the builder and this install gives me

this prompt I’ll just go ahead and click no
thanks so Beaver Themer already automatically

applies this layout right here and it’s pulling
in the featured image and it’s putting it

in the background like that and is pulling
in the title and it’s putting the title in

there like that but what I want to show you
is this amazing thing called field connections

and that’s working to use the pull in the
PODS data so what you want to do is click

this plus and it pulls up all of the modules
so for example let’s pull in the video module

and I will just don’t just drop it right here
why not and then I get this here actually

I made a mistake I want to put my video in
but I want to use the HTML module soma to

go here and there it is HTML module like that
I’ll just drop it here doesn’t really matter

where I drop it and this is the mid amazing
power of beaver or is this this plus here

this is called a field connection so when
I click on the plus it gives me the option

to connect all of these various commonly used
fields that are related to posts like the

title so I wanted to put the title someplace
else I can do that and there’s all these options

but because of that PODS integration when
I scroll down we have PODS options right here

so I want to connect in a field somewhere
click on connect and then right here I can

just choose my field and I’m in a use the
video which is code, click on save and then

a minute click on save and there is my video
see how easy that was hoops there is there

is my video and that’s the beauty of this
field connection concept that Beaver Builder

pioneered now what we can do is some amazing
stuff now remember how with the element I

was showing you you’re limited to just what
they give you but because of this field connection

I can pull in that PODS data in any of these
modules so for instance I want to make a beautiful

button why can use this button module right
here that comes with Beaver Builder I can

put it right there and then here’s a field
connection for text so I can use any value

in PODS for the text for the button and also
when I scroll down right here for the link

I can do a field connection so I click on
my plus I scroll all the way down the PODS

URL field click on connect and it’s going
to know this is the further beauty of this

plug-in it it knows which of those custom
fields I created in PODS contain a URL so

ever we chose website which is a properly
formatted URL so I can go like that click

on save click on save and now appear I’ve
got my button looks like I need to put some

text there or change the color of the text
but you get the point right here is that with

these field connections I can use these existing
modules on the go ahead and fix the style

on this already knows can hug me so I’ve got
the text color let’s just go ahead and make

that a dark color like that and then click
save okay that would’ve bothered me alright

so now this button because of these field
connections it’s all ready to go right and

the same thing goes for price but not only
does this work with Beaver Builder but there’s

two very powerful add-on packages for Beaver
Builder one is called ultimate add-ons for

Beaver Builder and the other was called powerpack
and you can use these in field connections

with both of those as well so right here I’m
looking at the standard modules but I can

switch them to I just happen to have ultimate
add-ons for Beaver Builder in here right now

so I can use it with that as well so I can
put this information in a flip box if I wanted

to so let me just drop in a quick flip box
is probably not to look right so here I can

do with my title instead of this let’s flip
I can use many of the industry so I can go

to PODS connect and let’s just choose industry
like that click on save and then maybe here

and said of this bit of text I can remove
that and let’s I don’t know it’s put the cost

in let’s go here let’s connect the costs and
open sorry right there cost for me click on

save click on save and so it’s going to show
the the industry and enhance the cost right

there and that’s perfect so what you’re seeing
is you have the ability to connect these custom

field data points into any existing supported
Beaver Builder module and also the modules

that come with the various add-on pack providers
it’s just extremely extremely powerful and

that’s all links to that add-on that was created
so obviously this is a horrible looking portfolios

not showcasing anything let me do a quick
Don and publish and I want to go here do quick

refresh and you can see it’s just there it
is is pulling in the background I’ve got a

formatted button I have this flip box and
I have this video here and I can literally

lay it out so now when I want to go and create
a new portfolio item it just going to grab

this beautiful layout that you’re creating
in the beauty as if I want to change something

in the obviously I’d want to change your whole
like a lot here all I have to do is edit the

one template we created using Beaver Themer
it’s really that easy guys it’s so powerful

Beaver Themer which are able to do when you.

Up with PODS now I’ve only really scratch
the surface there are very powerful fields

here so I didn’t show you galleries so if
you wanted to write here I could have chosen

file image video and then I could have gone
right here and I could’ve chewed chosen the

options for instead of a single file it’s
going to be multiple files so you’re essentially

creating a gallery of images that you can
beautifully display and one of the add-on

pack or Beaver Builder modules and it’s pretty
much as easy as that to create a template

that you can apply to all your portfolio items
now the same concept applies to making the

archive page remember we looked at the archive
page let me get to a really quick and there

is nothing special it’s really just dependent
upon your theme and it doesn’t look great

but we can use this same thing with PODS to
create a beautifully designed layout page

here let’s just do that really quick I’ll
show you how to do that some to go to add

new and let’s just call this portfolio index
page there it is and I’m in a choose theme

layout and for layout of many choose an archive
of click add theme layout and so I want to

apply this to the portfolio item archive page
like that I’ll click on publish and then I’m

in a go ahead and click on launch builder
like this now I have full control over how

I want this to look so I can start editing
what it default gives me here or you can just

literally click right here and you can have
all these different options so for layout

if I wanted to make it a gallery I could do
that now there’s obviously not that much info

there but here we have it as a gallery with
the featured images we can do Manson re-like

this there’s different post layout options
right here you see how powerful that is and

also if you have one of the various add-on
packages they have a even more powerful post

grid builder the one that comes with ultimate
add-ons and powerpack they are very very powerful

they give you a lot of flexibility on how
this is going to look but this right here

already is a massive improvement right so
now when I go here this is what it looked

like generated by the theme I do quick refresh
and now look at it it just looks beautiful

I mean it just looks good and you can also
pull these into say your homepage or something

like that and just have a pole in your portfolio
item and you can do some really really neat

things there so that is really what I wanted
to show you today with PODS now what I didn’t

show you was these this really cool migrate
packages option so we already went and created

this pod I’m go here I can click on export
and I want to export the’s the only custom

post type I created click on continue and
then bam see this gibberish of text all you

have to do is copy and paste this to another
site and instead of clicking export and or

migrate packages you would instead click on
import and you just paste that bit of texting

and then bam it’s been a bring in portfolio
with the icon you chose the custom fields

and everything so there’s this this portability
that is available so this essentially guys

is how you can take any WordPress website
and do a whole heck of a lot more of it have

full control to create a beautiful portfolio
or any type of separate content it’s super

easy to do that and you can extend with custom
fields your post your pages or if you’re like

me I use a LifterLMS and essentially that’s
just a custom post type and I use Beaver Themer

to create a and I use custom fields from PODS
to create a totally unique learner experience

using everything that I taught in this video
it’s just doing it with PODS this stuff might

be a little overwhelming right because when
you go into PODS here there’s like a million

setting options but you don’t have to be afraid
to break something because you can always

come back in here in change it later so I
don’t want you to feel afraid of messing something

up or breaking something because you can easily
change the setting right back now sadly I’ve

only really scratch the surface of what you
can do with PODS there is a whole heck of

a lot more that your able to do with pods
of relationships in passing data back and

forth connecting post types there so many
things you can do but this is what I wanted

to share with you to get you going to get
you up and running to get it started for you

I can’t wait to hear what you create so there
you have it that’s how you create custom post

types custom fields and also style those items
to make them look beautiful and even covered

creating an archive page now I talked about
a lot of products in this video if you want

to get more training around it Beaver Builder
I have a course on my website called Beaver

Builder essentials now I typically it’s available-for-sale
but I typically give this ways a gift if you

purchase of Beaver Builder or Beaver Themer
through the link on my website in the link

will be in the video description box if you
do purchase Beaver Builder through that link

I will give you access to this $200 training
course and I go over Beaver Themer in more

details and I also go through the relationships
that you can create using PODS so but this

video was enough to really get you off to
the races to start creating some amazing things

with your website I also have the same offer
for Elementor users and it’s all the information

on my website I typically have links in the
footer here right here where it says the different

bonuses available I got one for Astra Beaver
Builder Beaver Themer Elementor and a hosting

bonus and while I’m here at the bottom check
this out right here is product reviews and

guess what this is a custom post type that
I’ve set up so that is all that I have for

you in this video everything is linked in
the video description box for you to come

to all these links on my website and all the
links of the the products that I talked about

and if you have any questions I really want
to do my best to answer them you can ask them

in the comments section here on YouTube but
I also have a forum on my website where you

can ask the questions there and also search
questions there it’s a little easier to ask

and find other people other answers I’ve given
the questions here than it is on YouTube because

YouTube is just a very long comment section
so feel free to jump over here and ask me

in the forum I have on my website so that’s
all I have for you in this video if you found

value please share it on Facebook on Twitter
if you see someone asking how do I create

a portfolio or how do I do this please send
them to this video and I would really appreciate

if that’s how you can help me out and also
don’t forget if you’re new here consider clicking

on the subscribe button and to not miss anything
click on the bell off to the right of that

that’s all I got you in this video see you
in the next PODS video

Adam @ WPCrafter

Adam @ WPCrafter

My passion is making the best quality video tutorial online, for non-techies. When I am not behind the camera, I am usually helping out one of my YouTube subscribers.

3 thoughts on “How To Do More With WordPress Using Custom Post Types & Custom Fields”

  1. In your transcript: “very fundamental there learn how to create custom post types urinal learn how to create”

    …urinal… ?

  2. T

    Adam, can you please do a tutorial for Pods plugin and Elementor 2.0 … Precisely on how to create a template for a new post type (NOT the existing default post types).

Leave a Comment

Your email address will not be published. Required fields are marked *