How To Extend WordPress With Custom Post Types & Custom Fields Using PODS

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

Channel: WPCrafter.com WordPress For Non-Techies

Views: 49,347

Keywords: pods wordpress tutorial, custom post types in wordpress, custom field WordPress, beaver builder tutorial, custom field wordpress tutorial, beaver themer tutorials, elementor tutorials, wordpress portfolio tutorial, wordpress portfolio plugin 2017, wpcrafter

Id: R9K2VWuUkwE

Length: 64min 9sec (3849 seconds)

Published: Thu Nov 09 2017