Advanced Custom Fields & Elementor Pro Beginners Guide

Advanced Custom Fields Elementor Pro Beginners Tutorial.
Learn how to combine Elementor Pro with Advanced Custom Fields (ACF) to build more unique WordPress websites. This beginners guide will teach you the key skills to start building more powerful websites without touching any code.
Clearly explained, step-by-step guide to building your first Advanced Custom Fields Elementor Pro website.
★ ELEMENTOR PRO: jo.my/1s0t2s2
★ ACF: www.advancedcustomfields.com/
★ Elementor Theme Builder Tut: • How to Use Elementor P...
★ ACF Playlist: • Elementor Dynamic Form...
Advanced Custom Fields or ACF for short provides a very easy way of creating custom meta fields that can be used to expand the information you can include in any Post, Page or WooCommerce product inside WordPress.
Combining it with Elementor Pro’s theme builder means you can easily include the additional meta fields in your website without the need to get your hands dirty in the WordPress code!
This is awesome for beginners or designers who have no wish to learn code in the first place.
This beginners guide to ACF will show you the basics of working with Elementor Pro and ACF and will cover the following:
- Installing ACF
- The basics of the ACF interface
- Meta Fields
- Location
- Settings
- Creating your first Field Group
- How to assign your meta fields to the right content type with Rules
- Creating meta fields and the basics of the options
- Meta field types (overview)
- Demo the various settings and how they affect the ACF filed group.
Use a simple example of creating a blog that has a focus on cars and add in some additional ACF fields to cover things like engine size, year of manufacture, model, etc.
Elementor Pro
The Elementor Pro Theme Builder makes it easy to integrate ACF with your website design and can easily be expanded even further with 3rd party addons that provide support for ACF meta fields and dynamic data inclusion.
Cover building a simple single post template that will include some dynamic data pulled from ACF fields.
- Introduction to the Elementor Pro Theme Builder
- Create a Single Post template
- Add some additional ACF fields to expand on a normal blog post
Take your WordPress website and skills to the next level!
► THE TOOLS I LOVE ◄
If you like what we do and would like to support us, please consider using these affiliate links when purchasing any of the plugins covered in our tutorials. Thank you for your support.
► WORDPRESS VISUAL PAGE BUILDERS ◄
★ ELEMENTOR PRO: jo.my/1s0t2s2
★ Brizy Pro: bit.ly/2Ji97r8
★ WPBakery Page Builder (Formerly VISUAL COMPOSER): bit.ly/2NVbVNP
★ DIVI 3 Page Builder: bit.ly/2HiiDcE
► WORDPRESS THEMES ◄
★ GeneratePress Premium: bit.ly/2Ydn1SE
★ OCEANWP: bit.ly/2fRHBr0
★ DIVI Theme: bit.ly/2G8JMiA
★ Astra Pro: bit.ly/2zruoKn
► WORDPRESS TOOLS ◄
★ SMART SLIDER 3: bit.ly/2G0G1vB
★ CSSHERO: bit.ly/2qbrRl6
★ SLIDER REVOLUTION 6 - jo.my/sr6
► SUBSCRIBE ◄
bit.ly/2rX7rhu
► LETS CONNECT: ◄
/ wptutz
SUPPORT: Our website offers additional information and perks. Please check it out! wptuts.co.uk

[@WPTuts]

Up your WordPress game with this beginners guide to using ACF with Elementor Pro 2's Theme Builder and start building more advanced custom websites!

[@davepederson]

I really love your tutorials. You breakdown and explain everything so well. Even when I've figured things out on my own, I always find things I missed or could have done better after watching your videos. Thanks again for your wonderful content!

[@AttyKev]

Thank you! It felt like I paid for a class 😀 amazing content with great audio and video quality. Excellent work

[@Jim.Hummel]

Stellar tutorial..I thought this "stuff" too daunting to be useful, yet your presentation made this totally understandable and relatable. But it comes at a cost...since they're changing their pricing model I'm going to get in at the LTD pricing before the 2/24/2020 deadline. It's just too good to pass up!

[@futuretaste9686]

Thank you so much for all these awesome and incredibly helpful videos! You explain everything very straightforward. I can't begin to imagine how many hours of research your videos alone have saved me.

[@teddybear_lost]

Great video and a lot more helpful than most other content on both acf and elementor! Thx!

[@ead5590]

This video was super helpful. I was slightly nervous with ACFs for some reason and now I believe I can handle it well. Moving on to your CPTs video! Thanks for these fabulous videos. 😆

[@WPTuts]

Excellent! Great to hear this is helping :)

[@theroadworthy]

Fantastic instructional video. Hands down one of the most helpful videos I have seen.

[@jermainesubaran1249]

Respect to you bruvva. Very useful and intuitive!

[@joukenienhuis6888]

Great video. Now I got to find the difference between Elementor Pro an Elementor and the difference between ACF and ACF Pro

[@martinmassuh8863]

Lots of work you've done here. Thank you for sharing.

[@davidwalls2304]

Paul, I reviewed this video again over a year after you published....still great content. Keep up the good work.

[@WPTuts]

Thanks David. Good to hear it's still proving useful. 😁👍

[@permanentobjects6875]

watching this many years after first publishing.. Thanks so much for making this video. helps a ton!

[@andrija_mihalic]

Thank you for all pieces of advice! Soo helpful!

[@ChrisShawUK]

Fabulous again Paul. This, along with the companion videos have really helped me to get my skeleton site design together.

[@WPTuts]

Great to hear that Chris :0)

[@InfoPlusEntertainment]

Fantabulous, You have made it so easy

[@kimberlysebek4718]

It is a bit odd that the part of this whole process that relates to actually making the data appear on a page, tends to appear in webposts under "dynamic content" and NOT really to Custom Post types. Made it very hard to find a tutorial on that one step in the process... yours however are beyond excellent! Thank you! Best tutorial on the process I've seen.

[@nikoexplores]

So helpful! Thank you! (Much better than the tutorials on the Elementor KZbin).

[@LearnEnglishByCartoon]

This is an awesome tutorial. Thank you so much.

[@MichaelFidelis]

great tut Paul! Thank you

[@karansarin1986]

Thanks! This is helped me a lot.

[@richarddirksen4501]

Thanks for well-explained video. Clearly one to the best there is for beginners.

[@WPTuts]

Thanks Richard, I hope it helps people see how to start working with ACF and Elementor Pro/WordPress. 😀

[@carlosg8921]

very detailed tutorial. thank you so much!

[@spiralni]

YOU ARE A MONSTER!!! Thank you for your videos.

[@syedwebdeveloper6328]

Great tutorial on ACF thanks

[@gabedavis3294]

Very helpful. Thank you so much!

[@squizapp7753]

thanks a lot for this very clear and useful video!

[@LeTetSpiN]

Thanks, this was exactly what I was looking for. I was able to take everything you mentioned and applied it to my product template, but now I need a second product type for a specific type of product template and I'm hoping that Custom Pst Type UI will do the trick.

[@yousseftazit8477]

Thank you so much, I realy struggled to find out how to display those custom fields, thank you so much again ❤❤

[@hotelgymrater7832]

Very useful - thanks for sharing!

[@anwarmirza2178]

Great Video, thanks I have learned something new today!!

[@theresakilcourse9960]

So excellent!!! I watched it as kind of a refresher, so I knew what you were talking about from the beginning, but I wanted to give some feedback and say that I wonder if you will lose people at the start by running through all the features without giving examples. I thought that I would probably be confused or frustrated if I wasn't sure exactly what custom fields could be used for. I think it's best to give specific examples OR to just jump right in. It becomes clear as you go.

[@camilarahal8694]

Hey, thanks for the wonderful and very complete tutorial, was really helpful. Subscribing right now!

[@xx-lv3hj]

Great Video!

[@essare108]

very helpful :) thank you

[@simmosa832]

Great tutorial. Thanks.

[@RamakrishnanRukmini]

Looks simple and easy though I am yet to try it out. Shall do so soon. Thanks.

[@gibsonsvideo]

Very nice tutorial it helps me a lot....thanx.

[@joeholmes4711]

excellent tutorial

[@bahattab]

Very useful - thanks :)

[@dynamic-homepages]

AGain, thanks for uploading all those very helpfull videos =)

[@mozayanmoeed5539]

Excellent thankyou sir

[@rodrigovieira661]

Btw +1 sub. Thanks a lot for the content.

[@brandonyonke]

At 29:00 you add the ACF to the dynamic field and it automatically puts "Ford" into the page - where did it pull Ford from? What data/where told it to do that?

[@wgm247]

Slightly envious of all your t-shirts

[@WPTuts]

😂

[@GailKingswellTrueman]

Hi there. i think i must have missed the bit where you added the Audi TT and the Ford Focus posts. do you simply create a new post and it will ask you to enter the manufacturer, colour, engine, spec? I only saw you setting up the fields and not where you actually add the data for an individual post so that when you created the template it was able to find an example to view while you set up the single template. TIA

[@RamakrishnanRukmini]

Thanks. Great.

[@jefersonm8283]

Thank You

[@sabastian61]

Great tutorial! I understand ACF and can now do much more complex stuff with WordPress. I am having a particular issue. I would like the user to upload audio and it should automatically be published and show up in the archives (which can be done) However when that dynamic content is displayed. It doesn't playback or show that audio file. Hence, there needs to be a dedicated audio file type in ACF. Is there any way around this?

[@clintt5266]

Your tutorials are amazing - thank you. Any advice for adding a nice gallery to a Custom Post Type, using ACF? Is that a pro feature of ACF?

[@ori20031975]

Hi, great tutorial, if i want to work with flatsome how can i see my acf in the product page? do you have tutorial that refer to that?

[@Rediscovered]

Thanks for this awesome tutorial! I had no idea that Wordpress could be so customizable. The next thing I would be very interested in is how one would set up a member section where users can sign up and then post listings of different sorts. How would one apply these custom fields to the front end so that signed up user can submit their own posts?

[@funkytownletsgetdown]

Thanks for the tutorial. Sorry i'm not sure where else to ask this question, is there a way to make a field required OR another field required? I want the field to be required only IF the other field is empty. Thanks

[@mattadsitt8341]

This is my first exposure to AFC and you're explanations and cadence were perfect. Thanks! This gets me part of what I need. The other part is that I need to be able to use publish custom posts with custom fields from my phone. The WP Android App doesn't see my new post type. I'm betting this isn't in your wheelhouse, but maybe you know of a solution anyway. I'm sure I'm not the first person to need this. Advice?

[@kathyroots2024]

Hi Paul. I’ve been following along with your CPT & ACF tutorials so I have 2 questions. 1. What happened to the repeater option? 2 when I try to populate the text widget using ACF key/field it crashes. I’ve sorted through my plugins which are few - cleared the cache - using WPRocket - and still no luck. I’m on the latest version of Elementor & Wordpress as of 16th August 2020. I’m trying to organise fields for courses to display on their own single page & own courses archive but I’m not getting very far and I also wonder if I actually need ACF as the CPT would do & I could have just another single post template for courses? What do you think

[@bryandelacruz9066]

Hi do you know how to add an archive section inside the archive section too? for example I have archive Vehicles then one of those post is Honda and when I click Honda I will show again an archive of post like Car Types of Honda.

[@BrendanNagle]

What is the result of return format being value vs label? I'm understanding label to indeed be Field Label (top fill-out), but what is the value version of this? Any explicit reason to use this instead, or in conjunction?

[@chandlerdavis9750]

but how do you set the actual value of an ACF tag. Where does it get the color of the car, and the model etc. Where is that data being pulled from and how do you set it?

[@maryf.8840]

Thanks for this video. All your tutorials are great. Do you have any videos that cover how to sort an archive template on either the post title or a custom field like author. Thanks again!

[@stewartmagrath6453]

Another great tutorial, thanks. You mentioned at 37:07 that "anything that uses an archive page will now use the archive template". How do you set something to "use an archive page"? Can you change an existing page to use an archive template? I think I'm missing a fundamental link about archives!

[@dwayneoliver2685]

Hello, Is is possible to get the ACF Field Type = Group to work in Elementor? So far I’ve had no luck getting it to work. Thanks

[@tanguymerel8611]

I followed this tutorial. That's great content! On top of this, I created a custom taxonomy, through CPT, meant to be used as tags. Which I related to my Customer review CPT. I now want to display the ticked tags in the loop's cards. Unfotunately, I can't get to find this taxonomy from Elementor. Any ideas how I could do this?

[@boasorte.online5313]

Parabéns Paul mais uma vez excelente Tutorial mas ainda esta me devendo um com ACF e Elementor Pro para um Guia ou Diretório de um bairro ou cidade com mapa do Google esse sim estou esperando pois ninguem fez completo ainda porque voce não tenta e vê a adiência de qualque forma Obrigado.(:

[@jonahang1643]

I've created custom field(resident status) with ACF in "User Form", "Add/Edit". The additional data set appeared in the user add/edit page, and I am able to populate it with Frontend Admin ACF forms. But i can't seem to retrieve the data even when i choose dynamic data>ACF Field> Resident status, please help?

[@BrendanNagle]

I am building subpages that warrant their own headers & footers (or lack thereof). Looks like setting pages to 'Elementor Canvas' is the trick to exempting pages from these apply all conditions... wondering what the logic is there, or if you would long-term advise against the "apply all, then exempt pages" kind of dev approach?

[@oncps22]

Paul. alright? I'm creating a website where each logged in user will post, where each post is the person's Profile. however, I want that on the "my account" page I want to put a button with each dynamic post per profile (logged in user) to see your own (post or profile). How can I do this? I'm using the ACF URL field in elementor but it's not working. can you tell me why? I configured so that each user creates only one post .. how do I get each user to see their own post in my account page?

[@yanivfel]

Is there a way to use ACF to add files like PDF, CAD etc. in the back end and then see it at the frontend?

[@awobotuoluwatayo9677]

Hello Can ACF plugin work with user profile plugins to add additional functionality?

[@RamakrishnanRukmini]

Comment: Already said it is very useful. Querry (pardon me for raising this here as I am a beginner) - Is there a help video on creating log in menu complete till the sign up action follow up and sign in follow up in to the other pages not allowed until log in?

[@goiavalt8220]

I really appreciate all videos you make about elementor and custom fields, but i can't figure out how can use the theme's existing custom fields without create new with ACF or PODS etc.

[@gerhardjacobs8341]

Hi there I want to know how can I use ACF in a tour operators website?

[@mudaaraaturdu6153]

How can a classified word site can be created with front end user login and register and adding post by members thanks

[@animekaidaruto]

Hi, this plugins ACF works on database?

[@comolasperasalosperos5644]

Hello! I need to ask for help, I don't know if somebody can help me. I've created with ACF a checkbox, and I am trying to insert it in elementor pro. I've used a text field and dinamically I have choose the checkbox. The case is that between the items of the checkbox it appears commas...and I cannot find out the way to erase this comma... can somebody help me, please? Thanks a lot!

[@maliktanveerdhool]

please make a video on booking website with elementor, ACF and user front-end pluging

[@RamakrishnanRukmini]

In the video at 21.37 minute, you said about hello theme and showed a typical post, from where the TTSport was inserted. . Shd we follow the same theme and activate to get TT Sport or just I can have my own post created in those formats and use them? How that Ford Focus automatically gets filled in? Where was that.? Was it the post title already created? Were there two posts already created (by you earlier from hello theme) when you inserted? When I tried, the fields from field group were not inserted in the title box, even though the key drop down shows my fields. Everything else in the video, I could follow and implement successfully, but atlast this one little thing, I am confused.What could be my mistake?

[@WPTuts]

They were created by me and were just filler information.. you could create your own and put whatever you want in there. 😁

[@rodrigovieira661]

How can I use Gallery option to also play videos? (embeded youtube/vimeo or file, it doesn't matter). This is the only thing that I can't manage to do with ACF, otherwise one of the best plugins ever for wordpress.

[@saurabhparate]

Sir how do you added the car details? like pictures and other stuff

[@sotosj9]

Hi Paul, I'm having trouble with my header not showing in the "Page Builder Framework" customizer or my website. I'm using "Brizy Pro". I've created a menu in "WordPress" and made it my "Main Menu". Must I create a Header in Brizy? What am I doing wrong? Thanks. Great vid's as always!

[@WPTuts]

If you've created the header in Brizy you would need to add in the menu widget and then associate it with the menu you want to use. 👍

[@bryanrodriguez5122]

can I just download a theme lets say from motors and just work with it ?

[@xx-lv3hj]

Dear Paul, I have a small problem. I follow the instructions, but now my text (organised by bullets), is displayed as a continuous paragraph. How can I work on this?

[@user-xo5dp9ud9c]

How do you add a "custom field GROUP" to a section on an elementor page?

[@pellekarlsson152]

Great starter video Paul! Can't you continue with more car dealers video ex conditional logic and how to add images gallery more and so on

[@WPTuts]

I will be building a car sales website in a future video. The next big ACF tutorial is already in production so will look to doing it after that. 😁

[@pellekarlsson152]

@@WPTuts Awesome Paul!

[@robinchose]

Hello, thanks for your great videos. I followed step by step your instruction, but I can't find a way to make my custom post template as the default posts template. What can I do to achieve that ? Thanks a lot again Robin

[@WPTuts]

When you set the condition in Elementor Pro for the template you need to set it as the Single template and choose All.

[@motionsquirrel]

Hi. Is it possible to use ACF with Elementor, not Elementor PRO

[@masvimydeen249]

Really awesome explanation about the topic, it will surely help me for my project. But, I do have one question before moving on to another video. I have a section called today's message section in my home page, where I would like to show the visitors with different random messages from any one of the random post (from the whole list of post). Could you please let me know, how can I achieve that. FYI in there in don't need any of the field related to that post except content field. Please help to achieve this.

[@maxbonesso1172]

Hi, if I want to see the custom field value also in the archive, what I have to do? Is it possibile?

[@WPTuts]

Create a custom loop for your archive templates using Elementor Custom Skin. There are several tutorials on the channel that will guide you through the process. :)

[@joaslaurent2624]

how does it know which image to attach to?

[@judemanatunga213]

Hi Sir super tutorial thanks, is it possible to make a ACF field as a phone number field and make it click to call, where each post can have one or more numbers and all are click to call thanks, if possible pls do a tutorial on this thanks

[@MuhiuddinHaider]

Please make a vide on how to add comments under single post, Itried to enable it from wordpress comments in dashbord, but still not working. thanks

[@runelillevang1011]

Hello, amazing tutorial :) Do you know if there is any functionality to do this with Divi?

[@WPTuts]

You can use ACF with Divi, but I'm not a Divi user to say exactly how far you could get doing the same as that covered in this tutorial.

[@runelillevang1011]

​@@WPTuts OK thanks :)

[@paulmetcalfe6855]

Hi Paul, I have all this down pat now. All working fine, I've even created custom post types as shown in another tutorial using your suggested plugins. BUT... when i try to create a custom URL field it doesn't show the field in the list of data tags in elementor and so I thought to use the 'link' button below it where it does show up but when selected does not show any data in the page even though there is data in there. Any ideas on how to solve this? It looks like a bug with the plugin but I cannot be sure.

[@paulmetcalfe6855]

I even have changed from 'url' to 'text' in custom field to prove my point that the link is in their as seen here. retrofile.co.uk/directory/history-raider/

[@WPTuts]

Normally you need to set it to text instead of URL. For some reason, Elementor just doesn't seem to want to display a URL field as a data source. Not really sure why that isn't showing up for you. It may be a good starting point to empty all caches to see if that's stopping the data source showing up for you.

[@paulmetcalfe6855]

PLEASE IGNORE: I have now fixed it. :)

[@twbashar]

how to we let customers edit a custom post type at the front end of our website without going to the back-end?

[@WPTuts]

You'd need a tool like WP Frontend User or possibly PAFE.

[@raywebb2477]

I’m wondering if you can give me a point in the right direction. I need to build a database. I need for the database to be populated from a form that a user fills out. I need for that data to be edited only by the user that created it. Finally I need to search for records in that database by other users who could “rate” that entry.... I’ve been watching videos for weeks and I cannot seem to find anything that shows me how to accomplish this. Any thoughts?

[@WPTuts]

Not too sure about the rating aspect but the front end submission and options for editing can be done using WP Frontend User Pro. That should cover those key aspects for you.

[@raywebb2477]

Thanks bud..l I checked on some tutorial videos and of the dozens that I looked at none had any verbal explanations of what was going on so..... I do appreciate the response though

[@t20sgrunt36]

I am so sad that I found your YuoTube page. There goes all my free time :)

[@WPTuts]

🤣 Sorry about that.

[@luiscosta7324]

Great Tut, but, how to display custom fields in archive view?

[@WPTuts]

Use Elementor Custom Skin to create your own dynamic WordPress loops. It's a free plugin and if you do a search on the channel, there are several tutorials on using it.

[@KhairulAqmal]

ACF or Pods?

[@hosnakachooee92]

33:36 I did as you said but my content is not showing up

[@WrayHerring]

Did I miss something? Where did the Car data come from? I'm Stumped!

[@dwayneoliver2685]

What's the difference between this course and the one one on SkillShare.com? The only think I can tell is that the version on KZbin is free, and the stillshare.com one isn't. Can you explain the difference? I want to make sure I'm investing in the right lesson. Thx

[@WPTuts]

They are primarily the same content, but the Skillshare one is broken into chapters to make it easier to follow along.

[@dwayneoliver2685]

@@WPTuts So basically it comes down to if I want to pay for it and watch in chapters or just watch the whole thing for free. That's a no brainer!!!

[@WPTuts]

@@dwayneoliver2685 of course, it's entirely up to you. :) I don't really look at Skillshare as being a paid platform for a specific course or lesson but more as a subscription service to access a whole load of content. :)