In this video I'm going to show you how You can take WordPress to another level And how you can use the Newfound skills I'm going to teach you to build almost Any type of website now make sure you Stick around to the end where I'll tell You my top picks for free tools that you Should check out Mine is policy from WP tats and this Channel is all about helping you build Better looking websites faster and Easier now if you're like me and you've Been using WordPress for more than five Minutes you'll have come across a lot of Different limitations these limitations Have you then looking for plugins to Fill the gaps that should be easy to Fill well using the skills and tools I'll show you in this video I'll help You fill those gaps for yourself as well As open up a world of exciting Possibilities to take WordPress to a Whole new level Let's get the explanation of what a Custom field is out of the way right now So we can move on to the more fun stuff Now WordPress custom Fields lets you add Store and display additional information About a piece of content in WordPress Now from a technical point of view Custom Fields help you store metadata in Your WordPress database if this term Doesn't sound familiar don't worry Custom fields are used by many
Well-known WordPress plugins so for Example plugins like woocommerce use Custom fields for much of the the Information of each of the products so Things like the pricing the SKU code and Other additional information are all Custom Fields now the best thing is if You want to add your own custom Fields You don't need to be some kind of coder Or Tech whiz kit in fact the whole video Is all about how easy it is to get Started for yourself Now the beauty of WordPress is that you Always have choices and this holds true When you're looking to add your own Custom fields to your websites there are A range of great plugins out there some Are free and some are premium Now for The remainder of this particular video We'll be using Advanced custom fields or ACF and the free version this is a Widely used and well supported plugin For WordPress making it easy to find More help and support on the topic Should you want to now stick around Until later and I'll give you a list of Alternatives and the pros and cons of Each one of those so you can make a Really informed decision If you'd like to follow along with me go Ahead and install Advanced custom fields On a clean copy of WordPress and let's Get stuck into creating our very first Custom fields
So now that we have advanced custom Fields installed let's go ahead and Start to create our new custom Fields so Coming over into the dashboard we're Going to come down to custom fields and We're going to choose the option for Field groups and I'll show you why in a Moment let's open that up and this will Now show any or all of the field groups That we've created now a field Group is Just a way of grouping your Fields into A logical order for example you may Create one field Group that's called Book details and inside there you have a Price you have a link to the book you Have an ISBN number and additional Information you may then have a Different field group that contains Author information that's just a simple Logical way of organizing everything Together so let's go ahead and create Our first field Group let's click the Option to add field Group and this will Then open up the field Group area where We can create the field Group and we'll Also insert the fields we want to Include in it so for this example we're Going to call this Book details I'm going to scroll down underneath and This is where all our field groups will Be set up this is broken down into three Simple logical sections we've got the Label the name and the type of field
That it is then underneath we can create The field itself and as we create more This will start to populate so let's go Ahead and create our first field First of all we've got the field type And inside there we've got a lot of Different types of fields things like Text numbers URLs emails and so on Anything that's in Gray is a pro only Feature unless you have advanced custom Fields Pro you won't have access to that So for this example we're going to start Off with a really simple number value Underneath then you can see things Change based upon the different types of Fields that you choose so for example if We change this to text area you'll see The num options underneath change if we Change this to something like image Again you can see the options change so Let's set that back to be number Next up we've got the field label and The field name now every single field Type you create every custom field will Have these basic parameters that you Need to set up so the field label is Just a label that's going to be Associated with this field so for this Example it's going to be Book price You'll find then once you click inside The field name underneath this will Automatically pre-fill it out for you no Capital letters no spaces everything is Either lowercase and then separated by
An underscore or Dash to make sure you Don't have any kind of issues so make Sure that if you change the name inside Your which you can freely do you just Simply make sure you keep to that Convention so for example if we wanted To put in UK you can see we have to put Underscore UK Let's remove that your default value is Purely optional if you want to put a Default value in you can do if you don't You can leave it out and as with Everything inside Advanced custom Fields You can see pretty much every field has This little question mark this will tell You what this specific entry is all About so if you are stuck just simply go Ahead and click and take a look next up You've got validation Do you want to set this as a required Field well in our example we may want to Have this so every book that we put in Has to have a price associated with it So all we need to do is check the Required option then if you want to you Can insert minimum and maximum values Drop those inside you Presentation is basically nice ways of Doing things like adding instructions if You want to put placeholder text in if You're using step sizes so for example You may want your prices to go between You know one thousand two thousand five Thousand ten thousand those kinds of
Things you can set your step values Inside there your pre-paint and append Is things you want to put before or After this is only inside the dashboard Of WordPress and doesn't affect the Actual front end of the site so for Example we may want to put in a pound Sign so we know there's going to be Pounds and you may want to put an append In there as well If you want to set up things like Wrapper attributes so for example you Want to set up the width the class and The ID you can do that too for this Example let's set this to be something Like 50 percent Conditional logic this is probably a More advanced feature but can be useful When you start to have more complex Field groups if you open it up you can See it says show this field if something Matches and you can set up multiple Rules as well let's just disable that For now so now we've done the basics of Setting everything up we can then go Ahead and we can say add another field So now we're adding in a second field For this one we want to put who the Author is so we're going to do the same Thing again this time we're going to set This to be text then we're going to drop In the field label so we're going to say Book author You'll see we click underneath pre-fills
It out there's no default value Validation we're going to say it to be Required we don't worry about a Character limit presentation we're going To leave it as it is we'll just set the Author to be 50 as well and we don't Want to worry about conditional logic Now we're going to add one more field in Just going to add one more and this time This is going to be the synopsis of the Actual book itself this will make a Small version of what the book is about So for this example we're going to just Choose the option for text area this Gives us more control over having a Nicer larger amount of content you could Also if you wanted to use the wysiwyg Editor which then gives some formatting Options let's choose that as an option And you can see this now changes so Let's stick with that one for now let's Go ahead drop in the field label so We're going to set this to be synopsis And you can see it will pre-fill out the Field name default value again left as It is we don't worry about too much this Will certainly be required presentation We'll leave everything as it is you can See now though inside here we have Different options because we've chosen a Different field type so again we've got The instructions but we have tabs in Other words what kind of format you want This wysiwyg Editor to take you can have
Visual and text you can have visual only Or text only for this we're going to Have visual only so this allows to do Things like put bold italic underline Maybe even drop some pictures in there Like the old WordPress editor that we Kind of used to from years ago toolbar We're going to keep this to be basic so We can have only really simple options But again you can have as complex as you Want we're going to disable the show Media upload buttons because we don't Want to allow people to upload anything To our site and we'll leave everything Else as it is conditional logic Everything leave it as it is so now We've created our three key Fields so Our field Group is basically set up so Now if we take a look at it you can see There's our labels you can see that this Little red star apples tell us that These all required Fields if you want to Edit duplicate or delete you can do that Inside here the name is exactly what you Can see there so if we expand this out And go to General you can see there's Our field name so if we ever need to use That to reference it we've got a very Quick and easy way of seeing it and then Finally we have the type of field that This is numbers text and wysiwyg editors Each one with their own little icons we Can add a glance see exactly what's Going on now before we wrap things up on
This particular section we need to take A look at the settings underneath Because this is incredibly important and Again we'll come back this a little Later because we're going to change a Few things so we've got location rules Presentation and group settings the Rules the most important part of it this Says where are these fields actually Going to be used At the moment you can see it says post Type is equal to post and that's where We're going to use them but there's an Awful lot of options inside you if we Open up the post type you can see we can Have this to go to post category post Format we'll keep this to post type Though then you've got your operator is This equal to or not equal to really Simple and finally you've got what you Check it again so is the post type equal To or not equal to post page landing Page so on so forth so this is how you Set up where and when this is used and You can stack these you can have more Than one set of rules so these same sets Of content can actually be used in Various different post types and so on Presentation how do you want to display This do you want to use things like Standard WordPress Meta Box seamless no Meta Box on the side left these all Manage things play about with those and See how they affect the way things
Actually look and then you can choose to Hide any of these options in the Particular location that you're using so For example with these are posts we may Want to sort of remove things like the Excerpt so we can use our own custom Synopsis we'll say we want to hide that So this is what will be hidden from the Normal WordPress post type and then We're basically pretty much done group Settings do you want this to be active And do you want to show this in the rest API probably a little bit too advanced To what we want but we do want to make This active so we'll leave that as it is And we'll hit save changes and that now Is our field group created so now if we Go back to our field groups You can see there's our book details There's our key the location and the Number of fields and if we've added a Description it'll be displayed inside There so now we've created our first set Of custom Fields let's go ahead and take A look at how they've been integrated Now into the normal WordPress posts so We come into our posts and go to all Posts You can see I've got a bunch of Pre-filled out filler text let's go Ahead and open one of these up and Inside there you can see the normal Layout for WordPress all the same Options are used in here if we scroll
Down though we now have these new Options book details book author and Synopsis as you can see we get the Wysiwyg editor so now we can go ahead And fill that information out on all of Our posts to have that info inside the Posts whenever we create one this will Be added in and any post that already Exists we also have these new custom Fields associated with it that's how Easy it is to add custom Fields using ACF into WordPress Now you've seen how to create your own Custom fields and assign it to WordPress Post you're probably wondering how do You actually output this information Great question and there are many ways In which you can approach this you can Obviously get in and custom code them Into a WordPress theme but that's way Above my pay grade and also way above What I want to cover in this video you Could on a simpler level level you Shortcode in the WordPress Editor to Outputs some field types like text and Numbers but again that's also pretty Limited so this is where we have more Choices and can use some popular plugins Themes and Page Builders to make this Easier and way more visual so let's go Through and explore a couple of simple Examples just so I can show you how this Kind of thing can work So let's take a look at how we can use
Elemental Pro to start pulling in this New custom meta information that we've Created inside our custom fields and Inside our field Group so to do that We've already created a blank page Called books I'm going to edit this with Elementor and that will load in the page Design that we've got created now don't Worry about this this is not important So we're going to do is we're going to Use one of the new features this part of Elementor Pro 3.8 and that's the ability To create a loop grid because I want to Show you how you can combine Dynamic Information alongside this kind of Feature to create a nice kind of listing So let's go ahead and grab this Loop Grid option and we'll drag and drop that Into our page design You can see the snow says we need to Create or start with the template if you Create one previously for this example We're going to say create a template We'll save this design And that will then take us over so we Can start building the template for our Individual card design so we're going to Do is we're going to use a combination Of these kind of built-in features for Things like the post title and those Kind of things alongside the ability to Use normal standard basic widgets and Reference our custom ACF meta Fields so First of all we want to have the actual
Thumbnail image of our particular book To do that we're going to grab this Featured image and just simply drop that Into this little area that will then go Ahead grab the featured image for one of Our posts and display it so we've got The first thing already set in place Let's come over to our little Rubik's Cube click on that and we're going to Grab the post title so this is just Using one of the built-in features to Grab that post title for the standard WordPress posts you can see that pulls Things in so all we need to do now is go Ahead and style this a little so we'll Set this to be H3 come into our Styles We'll change our color so it's easier to See and we also come into a typography And we'll choose one of our predefined Styles so there's the first part Let's come back out of here now we're Going to go ahead and we're going to use Some of the basic options so we want to Put the synopsis under this here which Is one of our custom meta fields to do That we're going to grab the text editor And drop that underneath our title So now you can see that just pulls in The normal standard filler text we want To reference that Dynamic information to Do that we've got the dynamic tags Feature which is this little database Icon and anywhere you see that inside Elementor Pro you can access Dynamic
Data so you can reference all kinds of Information including ACF fields in a Lot of instances so we're going to click On that and this has a lot of different Fields but what we want is to scroll Right to the bottom and there's ACF Field we'll select it and now you can See nothing happens and that's because We now need to tell it what field we Want to reference to do that click on The little wrench icon to the next of Where it says ACF field and there is the Key now the key is the field name that We gave each one of our unique ACF Fields so we're going to click to open That up and you can see there's our Three that we created the book price the Book author and the synopsis for this we Want to grab synopsis we'll select it And give it a second and that will then Load it in so again we just need to Quickly go ahead and style this we'll Change the color so we've now referenced A couple of different kinds of Information so let's go and grab the Text now for the the actual price and The author information Again coming back to our Rubik's Cube This time we're going to grab ourselves A heading and drop that underneath the Synopsis we'll change this to be a div Or span doesn't really matter too much We'll set it to be a div We'll then click on the little database
Dynamic tags icon next to the title Click inside there scroll to the bottom Choose ACF field Click the wrench icon one more time Change our key for this example to be Book author we'll open up Advanced and We're going to drop in the word by and a Space for the before so this now we'll Say by the author's name Rhema D Feist Again let's quickly go ahead style this We'll change the color so we'll just set This to be accent text one more time and You can see there now the author by Raymond E Feist and we're going to do Just for ease is we're going to just Duplicate that so we'll come over where It says remedy first we'll right click I Will just choose duplicate this makes Our life easy because we can just click On the little wrench icon one more time Change that from book order to book Price come into advanced and we'll just Put price And we're going to put the pound sign in And we've Now set up all the meta Information all our custom information We've got the featured image the name of The post or the title of the post the Synopsis the author and the price simple As that we'll click update And then we're going to use Save and Back as you can see now we have that Using that Loop feature to repeat it and You can see we've got now three of our
Posts which is the three different books That I wanted including all the relevant Meta information underneath that's the Basics of how you get started Referencing and displaying the ACF Custom meta fields that we've just Created Another method is to use a high quality Theme like bloxy Pro which allows us to Use Dynamic data ACF feels those kinds Of things in the theme itself so I'm Going to use that to demonstrate another Way in which you can output this Information to do it all we're going to Do is head over into the appearance and Customize option so we can customize the Actual layout once we're inside the Customizer I'm going to go over to my Book section which is what we've got set Up to display the actual book Information and you can see this now Shows us a typical look we've got our Featured image the title the information Underneath it so on on however we need To change this over for that relevant ACF data those custom fields we created Now to do that we're simply going to Click edit that's going to open up the Options on the left hand side and we can Change the visual look of this if we Want to but for now I want to focus on The cards and the cards again are these Individual items so each of the books Has a card layout so we're going to
Click to open up the card options and You see this now shows us all the Current information so our post meta you Can see our title featured image so on So very similar to what Elementor gives Us but obviously we don't get that same Kind of level of control and drag and Drop as we do because it's a theme but We still get a lot of control so to do This now let's go ahead we don't want The excerpt in this example so we're Going to disable that so just click the Little I icon And that removes it you can see we've Got the post meta which gives us the Data it was posted and so on so again We're going to remove that okay so we're Now just basically left with some really Simple information now you'll notice at The bottom we get this ACF Fields this Is currently disabled let's go ahead and Enable by clicking the little I icon and Now we can open this up and we can Choose what information we want to Reference so let's click to open it and By default you can see Book prices Selected if we expand it there's our Three custom Fields our price author in Synopsis one more time so for this Example let's choose the synopsis now we Don't need to worry about things like Labels or before or after anything else This is now just going to show us that Simple synopsis information we've
Basically got the first piece in there Now we've only got one ACF field so what Can we kind of do what we need to do is Click on the Clone item so we'll clone This two times We'll open up the second field we'll Change this from synopsis to book author We can use the label if we want to and What this will do is this will look for The label that's used inside ACF and Output that into our layout so you see Book author Raymond E Feist we don't Want to do that though let's uncheck That option and let's go and just put in Like we did in the last one just put buy And space and we can see that puts in by Framer device now we take a couple of Seconds to update sometimes so don't Worry if it doesn't show it exactly as You expect so let's just minimize that One Let's open up the third and final one And this one we're going to just change This to book price and like we did Before we'll just simply go ahead and we Could actually use the label if you Wanted to or we can just put price And the pound sign in like we've done Before and there we go we now have our Information placed inside you if you Want to move any of these around we can Simply just drag and drop them so we may Want to take the title and put that Below the featured image like we saw in
Our first example we may not want to Have the post meta at the top where it Says books again we can just disable That and now we can just go ahead and we Can customize the look and feel of this To make it sort of in line with Everything else but that's simple Example of how you can use this with a Theme like bloxy to input that custom ACF meta information For this section we're going to be using Generate blocks a very very useful and Powerful set of tools the nice thing is You can use the free version to get an Awful lot of what I'm going to cover in This done and it's a great way of Working with Gutenberg if you don't want To go down the plain old vanilla Gutenberg root so what we're going to do Is we're going to take this basic page That I've already gone ahead and created And we're going to come over we're going To start adding some elements in so First of all we're going to come down And we're going to select the container So once we drop that in we now have a Container to contain everything inside In we're going to click the plus inside The container and we're going to go Ahead and find the query Loop now we're Using the generate blocks query Loop There is a version of this that you can Use as part of WordPress itself as the Native Gutenberg and you can probably do
A lot of what I'm going to cover inside There for this though we're going to use The query loop we're going to start off With this two column layout so it gives Us a good starting point and much as We've seen previously this now starts to Pull in some basic data that it thinks Is what we're going to use some of it's Correct some not so much so okay so if We expand this out so we can see in list View we can see exactly what's going on We've got our query Loop and inside There we've got a grid and inside the Grid we've got a post template now this Post template is basically another one Of those card designs like we've seen With bloxy and also with elemental Pro So each one of these is a card design so When we use this post template or card We basically design one of these and Then this gets replicated just replacing The data with the next record the next Book in this example so to do things on Here all we need to do is make sure We've got the post template selected and Inside there you can see we have four Different elements our featured image Title post date and exit we can get rid Of some of these we don't want the post Date So we'll remove that and we don't want The post excerpt so we'll remove that as Well the image in the post title are Both perfectly fine while we're here
Though let's go ahead and make lives a Little easier by changing the background Color on these cards so first of all We're going to come over to our block on The right hand side into our colors and Set our background color to one of our Global colors which is this almost black That'll do for this example and the text Colors will leave that as it is for the Moment we're also going to select our Grid and inside there we can now go Ahead and set any spacing for the Horizontal and the vertical so we can Control that and if we want to control The actual width of each one of these Individual cards we can come into the Post template and if we can look on the Right hand side you can see layout we'll Set this to 33 percent that now stacks These three by side okay so with that Being done let's go ahead now and add in The content that we want the dynamic Data so like we've seen before anything To do with working with Gutenberg we Click the plus to open up the option to Search for the relevant block that we Want and for this example we're going to Grab the headline block we'll change This from H2 to paragraph and then what We can do is we can now enable Dynamic Data and we can control what content is Going to be pulled in to do that let's Come over to the right hand side and Inside there you can see we have Dynamic
Data let's go ahead enable that we leave The source as current post because this Is going to pull in all of the posts Inside this particular section the Content source and the link Source now The content Source if we open that up Allows us to choose from most of the Predefined options you have as part of WordPress title exit post date and so on However we want some post meta so we'll Select post meta from the list and you See underneath it says post better field And if we click none of the three that We want are actually listed inside you So how do we get about this well the way That generate blocks works is we can Still reference those we just need to Know what the name is like we saw Earlier on where we named each one of Our custom Fields this is what we're Going to use that data so for this one We know synopsis is the first option so You can see once we take that in we'll Hit return and now that puts the word Synopsis inside our card design and That's it there's nothing being pulled In and this is one of those little Frustrations it doesn't actually pull The live data in it only pulls in the Placeholder for the ACF field so if we Just go ahead and we'll save or update This page let's just quickly preview This to make sure that everything is Actually in fact working so we're
Previewing a new tab and you can see There's the actual information from the Synopsis custom field so it is working We know it's working let's go back now And let's repeat that process two more Times let's just duplicate this And duplicate it one more time and now All we needed to do is change the actual Content that's being referenced so this Time we want to put the book author in So we'll come over we'll clear that post Meta field and we'll put book Underscore author again using that Custom field name we'll hit enter or Return that now fills that information In and we'll do the same thing now for The third and final which is the price So again we'll just come in we'll just Delete what's in there we'll put book Underscore price Hit enter or return and that's now added That information in so let's go ahead Update this go over to our preview and Refresh and there's our actual author And the price note this doesn't really Show that this is the author or the Price so we need to rectify that with Generate blocks that's incredibly simple Let's select the book author We'll just close this down we'll come Into the icon area now this is kind of Weird you think well we don't want to Put an icon put some text in there well You see we've got this icon SVG HTML we
Can literally put the SVG HTML code in There to put icons in but we can also Just type directly in there and also Apply HTML formatting if we wanted to so For this example we know this is the Author so we're just going to put buy Like we've done before and a full colon You can see that just puts buy Underneath but we take a look at our Preview you can see buy book author We'll do the same thing now for the Price we'll selected we'll just simply Go ahead put the pound side in this Example and you see that puts the book Price in and if we want to adjust Spacing and alignment and things like That we can adjust that inside here so Let's say we wanted to get rid of any Space in there at all we could just put Zero in and let's just say we'll put 0.1 In just it gives a tiny bit of space and The same for the author we'll just come In and we'll say we'll put let's put 0.2 In there because we want to set this a Little bit further than the actual pound Sign so now if we go ahead and update Refresh our page there's all our Dynamic Data being pulled in into generate Blocks and this is just a really simple Example of how you can use something Like generate blocks and obviously we go Ahead and customize the look and feel of This to get what we want but now you're Seeing how you can get the dynamic data
In there it is very very simple and Straightforward So now this is just the tip of the Iceberg when it comes to the tools that You can use and include some more of my Top recommendations at the end of this Video and also link down below for ease Now while this guide is aimed at Covering the basics there are many more Advanced features available using Advanced custom Fields Pro you've got Features like a full image gallery Repeater feels and flexible content Feels incredibly powerful features now It's beyond the scope of what I aim to Cover here today but I've included a Full playlist in the description for you To check out once you've become familiar With everything coverage here in this Video all of the advanced features have Been covered in that playlist check it Out Now if all you want to do is add custom Fields to the core WordPress options Like posts or Pages you should now have All the fundamental skills to get Started exploring the many options That's opened up however let's take it One step further by creating our own Custom post type or CPT So what is a custom post type well Custom post types are unique post types That have been added to WordPress the Key idea is that they allow you to
Easily add additional functionality to Your website but don't want to add Everything to the standard WordPress Posts unfortunately Advanced custom Fields currently doesn't have this Functionality included whereas many of The alternative options I'll recommend Later in this video actually do but Don't worry we can fix that easily by Using a free plugin called CPT UI so Let's take a really simple topic and Create our own unique custom post type To handle this and then assign our Previously created custom fields to our New post type now I've already installed CPT UI and if you'd like to follow along With me just go ahead and search for it And then install and activate it I've Already installed CPT UI but if you Haven't maybe go ahead and install it Now so you can follow along all we need To do once it's installed and activated Is come over to the left hand side to CPT UI and we're going to choose the Very very first option which is ADD edit Post types this will allow us to create Our new custom post type from our books So the first thing to do is give this a Post type Slug and this is what's going To be displayed in the URL for your site So for example mysite.com forward slash Books forward slash the name of the book That you're going to view so we're going To set this to be books the plural label
Is going to be books as well and the Singular label is going to be book We could if we wanted to leave it at This point but there are some things That I do think a worthwhile setting up At this point just to make the whole Process a little easier next up you have Your additional labels we're going to Leave the additional labels out but let Me just quickly tell you what they Actually reference inside WordPress Itself for example you can see things Like menu name all items add new and so On whenever you come over any of these Items on the left hand side for example Post you can see we've got all posts add New and so on if you don't want to use The default settings like add new for Your books and those kinds of things you Can manually override those by setting Whatever value that you want inside any Of these relevant areas so you can do That if you want to for me I want to Leave them as they are but if you need To those options are there let's scroll Right the way down though until we get The option for settings and there's a Couple of things you need to make sure Are set up correctly inside you First of all you want to make sure if we Come down that we've got has archive is Set to be true this means that we have An archive on the front of our site Which means we can list our books and
Without it you won't see it and then if You're using something like Elemental Pro to create your template you won't Have the ability to create your archive For your books because it's basically Disabled so make sure you set that to be True Scroll a little further we're going to Set the hierarchical to true as well This is more from a visual point of view Than having any kind of functionality That we have to enable or disable just Makes the the process of working with Your new custom post apps a little Smoother and easier Coming further down you can see we've Got the option to set things like our Menu position we'll leave that as it is But if you want to be specific where It's set on the left hand side you can Do that inside here We want to make sure this is set to true To show in the menu and if you want to Drop in your own custom menu icon you Can use that or you can do things like Choose your dash icons and so on so Let's see if you can find a book inside Here there we go that looks pretty good We'll click to add that and we've got a Custom icon to be used Then underneath you can see what does This support in other words what Features are going to be enabled inside Our custom post type so things like the
Title the editor the featured image and So on so if you want to allow comments And you want to have control over that You can enable that inside you I tend to Go with the basic defaults unless There's something very specific I'm Looking to do so we're going to leave Those as they are then we're going to Scroll a little further down and you can See this says what taxonomies do you Want to associate this with we don't Want to associate it with any at this Point in time so we're going to leave That completely blank let's go ahead and Click add post type and you can see when We take a look at the left hand side There's our new custom post type called Books inside there you've got all books And add new so we click on all books You'll see there are no books found if We click to go take a look and add new You'll see inside here we have really Basic options we've got the title we've Got the content we've got the featured Image and the page attributes that's Basically it because we didn't enable Any other features that's exactly what We wanted but you also notice that we Don't have those custom meta fields we Created for the book price the synopsis And so on that's because they are still Only associated with the WordPress posts And this is a custom post type so let's Rectify that let's come back out of here
Into the dashboard Let's come down to Omega field so custom Fields and open up our field Group There's our book details so let's just Open this up Let's scroll down to the bottom Let's go to location rules and now if we Wanted to we can leave this associated With our current post Or we can replace it or we can have it Associated with both of them for this Example let's just say we want to change The post type is equal to and we're Going to set this to be our new custom Post type which is our books so choose Book from the list and we'll just say Save changes And now we come over to our books We'll add a new book And all the normal things are inside There including now our new custom book Details for our book price author and Synopsis and if we just jump back out of Here and go into our posts and we open Up our post information click on our First book You'll find that they are no longer Associated with that so now that we've Gone ahead and we've created our custom Post type we've created our books and We've gone in and added the meta Information into it from our field Group For our custom Fields what's next Now we create our own custom post type
For our books let's use Elementor Pro And create a new template for our new Post type and also add in the custom Fields along with the default WordPress Fields to display our content To do that we're going to come into the Template section and into theme Builder Now insert the theme Builder all the Various different components are listed Down the left hand side so we want to Create a new archive to start off with Which is going to list all of our books So we're going to click to add a new Archive that will load in the elemental Editor and then we can start building Our archive now you could if you wanted To use one of the pre-built layouts to Start off with to speed things up but in This example we're going to scrap that Completely so let's just close this down And we're back into the page like we saw Before now to make our life super simple We've already created the template to Display the information for our books so We can use that again and this is one of The beauties of working with templates So what we're going to do is we're going To just come down until we get to the Loop grid we're going to drag that I'm Into our design we'll wait to add a load And then you can see we've got poster Template type is set to posts and choose A template so we're going to do is we're Going to click inside there and we're
Just going to start typing in Loop and There's our Elementor Loop that we Created previously we'll select that From there that will now pull in what it Thinks is Right In in this example the Posts now this is pulling in the Standard posts like we saw right back at The beginning not our custom post type For books so let's Rectify that we're Going to come into the query and inside There we're going to change the source From Posts I'm going to change that to Our custom post type of books now you Can see nothing really changes inside The main editor because well basically The information is exactly the same but This is now referencing our book so when We add a new book in we'll see that Listed inside this archive We're going to add some pagination so as Our book collection grows we can make Sure that we can go through all those so A set of pagination we'll choose Something like numbers and previous and Next now nothing's going to show up Because we literally only have three Books inside here but when this grows we Will start to see those pagination Options pop up and you can customize Them inside you if you want to as well So we've basically set up the template Now for our our books archive so we can Do is we can click on publish and this Is where things are slightly different
To what we saw previously we created Just a standard plain or vanilla page Now we get to choose where and when this Template will be referenced so we're Going to add a condition This will set it to be all archives by Default but we don't want that we only Want this to be using the book archive So we'll select that and now when we Look at the archive of books no matter What kind of book it is we'll be Categorize things and so on that will Always use this new template so let's Say save and close and we've now created Our template and assigned the condition To start using it okay so this is the Site as it is ignore what it's like it's Just something I've been playing around With but let's go up to the address bar At the top and we'll put in book And we'll press return And you can see that now is using that Template for our books if we click on Any of these books that'll take us over To a pretty ugly looking page that's the Single post template so we now need to Quickly address that set of the Templates set up the conditions to make Sure this looks the way that we want so Let's do that now let's head back over Into WordPress back into the template section And back into theme Builder This time we're going to choose the
Option to create a single post we'll Click on the plus again that will open Up the editor for us we don't want to Choose any of the pre-built layers we're Going to close out of that and we're Going to just quickly build something Really simple ourselves so let's just Drop a container inside here we're going To then go ahead and add a couple more Elements inside you so I'm going to keep This super simple if you want to find Out how to use the container as part of Elementor and Elementor Pro the new Container feature I'll put a link in the Description so you can check out my Videos on using this effectively but for Now super simple We're going to do is we're going to go Back over and we're going to add in a Couple more containers And we'll just duplicate this one So we now have two containers we'll Select our first container and we'll set That to be a row so they now stack side By side so we'll do is we put our image In the left hand side and we'll put our Content in the right hand side so let's Do that come back over to our widgets We're going to cover over and you can See we've got a range of slightly Different options this time so let's go Ahead and use these let's grab our Featured image and drop that inside There now this is going to pull what it
Thinks is correct in now we want to make Sure that we are using exactly the right Data so let's come down to the little Settings Cog in the bottom left come to Our preview settings change this and Just choose the option for books And you can use all if you want to but Let's just say we'll put magician in let Us search for that and we'll use that as The basis we'll click apply and preview And now we know this is going to pull Data from our books custom post type for When we're building this template out so There we go there's the first thing There's our book cover let's go over to The right hand side let's go and drop in The title you can see there's magician Let's quickly style that We'll repeat the same process again so We're going to do this time is we're Going to come over to the option for Text editor we'll drag and drop that Underneath We'll click our little database Dynamic Tags icon scroll right the way down to Our ACF Fields click the little wrench Icon choose our keys and pull in the Synopsis Again we just need to quickly style that Let's just just change the color of the Text that'll do for now and then finally We're going to do the same thing again We'll use this I'm going to grab a Heading drop that underneath
Change that to be something like a Paragraph Actually just set that to be a div That'll do for that we'll click the Option to change the colors Change the style should be getting used To this by now we've done it a few times And we're going to come back in Click The dynamic icon down to our ACF field Click the wrench icon change this this Time to book author Advanced by Space and like we've done before we will Quickly just duplicate this and we will Just change the details A book author to book price and we'll Change the buy to just the pound sign There we go so we've now created the Look and feel for this specific page Let's go ahead and publish This and like We've seen just now when we create the Archive we now have to set that Condition so let's add our condition We don't want this to be all singular we Want to come down until we find our Books option and you can see there we've Got books we'll click on that and we'll Just say books all save and close And we're done we've created the Template for this let's hop back over Now into our test on the front end of The site let's refresh what we saw Previously and there we go we now have Our customized look and feel using Templates and so on Insight Elemental
Pro referencing the dynamic data that We've created inside Advanced custom Fields Now that we've seen how to get started Not only adding custom fields to WordPress but also how to use popular Tools to show our custom fields and also How to create custom post types what Other tools are there to do this and if I don't want to use Advanced custom Fields so first up we've already seen How to use Advanced custom Fields but It's always worth taking a look at Advanced custom Fields Pro just to Quickly see some of the options that are Available and why you may want to Consider checking it out you've got more Advanced options things like repeater Fields which means that if you have Simple data that you want to allow People to keep on adding sort of similar Things like social networks and things Like that the repeater field is Incredibly useful for that you have ACF Blocks if you want to get started in Customizing blocks and using those with Gutenberg using native ACF functions Flexible content container allows you to Build up all manner of different things A lot of these are all covered in my Dedicated playlist you can check out in The description below options Pages if You want to allow Global options to your Site things like colors backgrounds and
So on really useful and as I said Earlier on you've got the image gallery Plus we've got things like clone Fields So you may want to check this out and See if there are features inside you That you absolutely need or you just Love to start using them learning them And expanding your skill set Next on my list will be jet engine from Croco block now jet engine is an Incredibly powerful set of tools unlike ACF this actually includes a lot more Than just the meta field or the custom Field creation options you can create Your custom post types like we've seen Cptui you can create your own custom Layouts either using Elementor or using Gutenberg all using the built-in Features inside jet engine and a lot More a query build is incredibly Powerful there's an absolute abundance Of features available and again I've got Dedicated videos on how you can use a Lot of the features included in jet Engine so you may want to check this out It's not particularly expensive starting At about 43 dollars just for this plugin But it works really really well with the Rest of the Croco block Suite have a Little look links in the description for You to check it out now if money is Something you just don't really have a Lot of and you still want to get in and Start working with custom meta
Information check out pods pods is Totally free there are are some paid Ways you can interact with it but all The tools are pretty much free so you May want to check that out now I'm not Really that big a sort of user of PODS I've dabbled with it It's one of those Community Based tools That doesn't really have a paid for Network of support so you may need to Have a little bit more understanding of How things work so I would probably Recommend getting to know how Dynamic Content Works before you take a look at Using pods so you have an understanding Of the terminology the technology and How it all actually works together now You also may want to take a look at Metabox now metabox much the same as a Lot of the other tools we've kind of Covered have not just the matterfield or Custom field ability it also has the Ability to create a lot more your post Types relationships or manner of Different things this is kind of broken Down into a modular format so you can Install and use only the features that You want one of the other benefits of Metabox is that it actually separates Its data from the standard WordPress Database and has it and holds it in its Own dedicated database this potentially For larger sites with tens of thousands Of Records could be considerably quicker
Than going down the route of this way That ACF generally works so check out Metabox there is a slightly steeper Learning curve it's a little less User-friendly in some instances than ACF And jet engine however once you get an Understanding of the basics and the Fundamentals of how Dynamic data works It is a lot easier to transition between These different tools that I've covered Finally we have tool set now toolset is Heavily integrated with Gutenberg they Moved away from a lot of other ways of Working to focus specifically on Gutenberg you can use this alongside Something like Elemental and Elemental Pro so you can still grab that data and A lot of other tools like bricks and so On will allow you to use tool set data But you don't need to rely on any of Those you can actually use all of the Built-in functions of toolset to be able To build incredibly powerful and Incredibly comprehensive websites with Native search and map searches and all Those kinds of things however I will say From my use case I haven't found it the Easiest to get to grips with it feels a Little bit long-winded to do some very Simple things but that might just be me That might just be the way that I'm used To working with these other tools so Checkout tool set see what it offers and See if there's something that you think
Actually fills the void or the Gap that You may have for specific use cases but As always all the links that everything I've covered will be down below so you Can take a look at each one of these and You can evaluate what they offer and see If it's something you want to check out For yourself in more detail Now that you've seen how to get started I recommend watching the videos in this Playlist to expand on the topics covered In this video as always if you enjoyed The video please hit that Thumbs Up Button my name is Paul C this is WP Touch and until next time ticket
WordPress is a content management system that uses an array of automatic processes to allow even a novice webmaster to create a fully functional website. This free tool combines an easy-to-use layout with a code-free environment to make building a website a breeze. With a huge community of developers, you can be sure that WordPress is always improving. It also offers incredible support and makes it easy to use coding for anyone, even those with minimal experience.
Other benefits of WordPress include its compatibility with various SEO practices and its ability to integrate geographic location. Almost 80 percent of internet users use mobile technology to browse the web, and WordPress is built to accommodate that. This makes it easy for businesses to engage consumers nearby with a localized version of their website. In addition, WordPress is very versatile, allowing it to be used for both eCommerce and blogs.
If you want to use your blog to earn money from ads and build a long-term impact, WordPress is the way to go. Blogger has many templates that make it easy to get started, but WordPress comes with unlimited free and premium themes. WordPress also lets you customize your themes using FTP access. AdSense is a crucial source of revenue for many bloggers. If you want your blog to make money, self-hosted WordPress is probably the way to go.
WordPress also has a large community of developers and users. With its huge user base, you can easily find pre-made themes and plugins to enhance your site. You can also hire a developer to customize your site for you. Most themes and plugins can be installed right within WordPress, but you may need to install them through FTP or the WordPress theme upload function.
WordPress offers an editor similar to Microsoft Word and allows you to add formatting and styling. It also offers a preview of your content when it’s published. You can also use the text editor to type your content in HTML, which is a styling language used in webpages. A preview is available to help you determine if it looks right before publishing. It is important to know that the software you choose should not limit your ability to create a beautiful website.
WordPress has a number of plugins to help you make money from AdSense. Choosing a plugin that supports AdSense will make the process easier and more efficient. A good plugin will let you use a wide variety of advertising tools, including popup ads. It will also save you from having to type in code each time you want to use an ad. The plugin also allows you to place ads in any location you want.
There are many free WordPress plugins available, but it’s best to pay a bit to get a premium plugin. It’s important to note that paid plugins are often more reliable and feature-rich. However, you can always try a free version to decide if it’s worth it. You can install free plugins from your dashboard. This will let you see if it will suit your needs. When it comes to customization, there are thousands of free themes available to choose from.
Another way to add code to your website is to edit your theme files. WordPress has a wide range of developers, so you have a large variety of choices. But the downside of using plugins is the upkeep they require. Some of them may not be compatible with updates to the core of WordPress. You might also be forced to pay for technical support. If you need support, a good plugin provider will help you out. However, it’s important to note that free themes often don’t offer a backup service.
Google AdSense is another option for monetizing your site with WordPress. AdSense uses a bidding system and is run by Google, connecting advertisers with publishers. The more ads you put on your site, the more money you can make. Google AdSense ads are contextually targeted, which means that they will be relevant to your content. When a visitor searches for something related to what they are looking for, they’re more likely to click on that ad.
If you’re planning to use WordPress plugins, make sure you choose those that are updated frequently. Developers of high-quality plugins will regularly update their plugins, and you should always run the latest version of any plugin that you’re using. Using an outdated version can compromise your site’s security and cause compatibility issues.