Create a directory using Elementor, ACF & CPT UI

In this mini course we learn how to build a directory using Custom Post Type UI (CPT UI), Advanced Custom Fields (ACF), Elementor Custom Skin & Elementor Pro.

We’ll first create a custom post type and taxonomy using CPT UI, followed by creating the custom fields required for our listings using ACF.

We’ll then use a combination of Elementor and Elementor Custom Skin to create the design for our directory template files, so that it fits in perfectly with our existing website.

The tutorial will cover:
✔︎ The difference between custom post types, taxonomies & custom fields
✔︎ How to create custom posts, taxonomies & custom fields
✔︎ Creating single post and archive templates
✔︎ Creating a loop template
✔︎ And much more!

Plugins used in this tutorial:

Useful links:

Timestamps:
00:00 Introduction
00:40 Preview of what we’re going to build
01:50 What are custom post types, taxonomies & custom fields?
04:10 Create a custom post type
08:35 Create a custom taxonomy
09:55 Create custom fields
14:00 Populate first custom post
15:25 Create single post template
24:00 Create archive template
25:45 Create loop template
29:55 Add directory link to menu
30:30 Final results

Don’t forget to subscribe to our channel!

[GerardoFallani]

Thank you dears, this was the very best tutorial I could imagine. Now, 2 years have gone, and ACF has the CPT feature. Also, loops are integrated in Elementor. So, it'd be nice to have a new, updated tutorial consistent with the actual version of Elementor.

[InbredRengade]

Amazing. This bailed me out of a situation where i thought I over promised. Thank you so much.

[CharfishDesign]

Amazing tutorial! Appreciate how much ground you covered so efficiently.

[carolecarike]

This is amazing and very well might be the answer I've been searching for and stressing over for what feels like a very long time. Almost in tears by the end of this - you have no idea LOL! You covered everything so perfectly and in easy language and I just can only say "thank you"!

[nick_merchant]

A very precise tutorial. To the point and well produced. Thank you so much.

[mikenco]

This video elevated my knowledge of ACF and custom posts to the next level! Thank you, thank you, thank you!

[wienwinsituation]

Brilliant tutorial! Well explained, and the summary in the end was just the icing on the cake <3

[BrantK]

Wow, this tutorial is so clear and well done, albeit a bit robotic. Thanks Elementor!

[mattsingley]

Very helpful, thank you so much. Using this to customize a site for a client, this is exactly the info I needed.

[Twisties]

Brilliant, just what I was attempting to create. Will be trying this tomorrow.

[uexin]

Thx for tutorial. It was so illustrative and illuminating.

[faizrehman]

Hi, Elementor Pro should at least have the following features natively:
1. Mega Menu
2. Custom Loop
3. Ability to add co-authors
Dependence on third-party plugins for every feature makes our websites so heavy & effects the load speed.

[PhilippaBerrySmith]

This is a great tutorial and shows how to clearly build a directory. Question: is there a way to display a grid of the custom taxonomies? For example, your tutorial shows a new taxonomy called “Industry”, with categories such as “food and drink”. Is there a way to make an archive-like grid to show each type of Industry, and how many posts it contains? This would be so handy for catalogues or directories where the user wants to browse across categories.

[JorgeQuan]

great! using those plugin for a wile and with ACF frontdend for ele, ento, we can create pages with those custome field and style it as we want. that page can be show to any user/role to create new posts

[mgtdbYT]

This is exactly what I was looking for, thank you 😀

[nayadev]

awesome tutorial! muchas gracias elementor #elementoRules!

[segevmatuf]

Great explanation! Keep on going 👍
One question: after i create all this elements, can i uninstall those plugins without loosing the visuality of the website?
I don't need many plugins on my website

[emailjough]

Why doesn't Elementor have its own custom loop builder? It's long overdue.

[misfitinteractive]

Excellent tutorial. Can you expand to show a menu of taxonomies if you want to list available business industries for people to select and then view all the businesses in that taxonomy?

[vincentlevalois]

This tut was very helpful and I've used it to great success thank you! Question I have is where to modify the code to make the Email and Links custom fields clickable? By default they are not.Thanks!