Frontend Dashboard Elementor & JetEngine | Listing Website Part 2

Learn how to build a Frontend Dashboard with Elementor & JetEngine from Crocoblock as I expand upon part 1 of the Building A Listing Website with WordPress mini-series.
✅ Part 1: • Create a Listing Websi...
✅ Repeater Fields Deep Dive: • JetEngine Repeater Fie...
In this installment I'll be covering the following key areas:
-Enabling the profile builder and forms functions
-Configure the Profile Builder
-Create the blank template files
-Link the template files to the Profile Builder
-Build the listing layout
-Add the listing layout to the recipe listing template
-Build the add recipe form (link to current deep dive tutorial)
-Build the edit recipe form
-Add the forms to the templates and finish up the whole process
A Frontend Dashboard built with Elementor provides an array of added benefits for you and your site contributors.
✅ Buy Elementor Pro: jo.my/1s0t2s2
✅ Buy Crocoblock: jo.my/croc
TIMESTAMPS
00:00:00 - Introduction
00:00:50 - A look at the end result
00:02:29 - Install & set up the Profile Builder and Forms
00:04:58 - Configure the Profile Builder
00:08:46 - Build the initial blank templates
00:10:25 - Add the templates to the Profile Builder
00:12:52 - Build the recipe listing
00:22:12 - Building the post listing page
00:26:30 - Building the add post form
00:45:50 - Build the edit post form
00:54:03 - What’s next?
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.
► EXCLUSIVE WPTUTS DISCOUNTS ◄
✅ WPVivid Backup Pro: jo.my/vividpro (use WPTUTS30 for 30% off)
✅ Project Huddle: jo.my/etafyp (WPTUTS for 20% off - Exclusive)
► MY PREFERRED HOSTING PROVIDERS ◄
✅ CloudWays: jo.my/1feeng8
✅ SiteGround: jo.my/sgwptuts
► WORDPRESS VISUAL PAGE BUILDERS ◄
✅ ELEMENTOR PRO: jo.my/1s0t2s2
✅ Brizy Pro: bit.ly/2Ji97r8
✅ 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
► WORDPRESS PLUGINS ◄
✅ SEOPress Pro: jo.my/seopress
► SUBSCRIBE ◄
bit.ly/2rX7rhu
► LETS CONNECT: ◄
👉 Twitter: / wptutz
👉 Facebook Group: wptuts.co.uk/facebook
SUPPORT: Our website offers additional information and perks. Please check it out! wptuts.co.uk

[@mohsinshakeel6482]

my favorite KZbinr for learning Elementor in the whole youtube. Thanks

[@MarcelLeteriTech]

Super thumbs up Paul! Thank You! This is an awesome series! I can't wait to see the next one. Huge value here.

[@bradleyhowell3298]

You have no idea how perfect your timing is for me, with this tut... wow when do you sleep!

[@hesammosavari8798]

Awesome content Paul, what would i do without you. probably many hours of frustration and agony.

[@PsychicWorldTV]

Thank you Paul, perfect timing for my latest project

[@MrJava24seven]

I tried this for giggles. Thanks Paul another awesome tutorial. I had a few issues that stumped me for a bit. Account page deleted. hahaha The Cause for my issue (perhaps not the same for everyone) Jet engine Profile Builder /pages / template mode = rewrite /use page content = on..... did the trick for me. ...I also found that when adding the account page back it has to be "edited" and "published" with elementor....Perhaps this wasn't the correct way to fix the issue but it worked for me....Thanks again Paul !!!

[@yedukondalugeedimalla]

it is not working for me, how can solve it.same thing is happening for me

[@tamaragiltrap2558]

thank you!!!

[@quangmainz]

Thanks so much for this!!! You have made my day, Paul! ;)

[@nenadpopovic1362]

You are just great with explanations!! ❤❤❤ Just continue like that🎉🎉

[@PLUS-sj4sf]

Amazingbas always! Thanx a million.

[@youngmediageeks]

This is a great series. Thank you.

[@lugasim]

your videos are amazingly easy to understand, so thank you for that.

[@wpeasy]

Your tutorials are next level excellent. I'm starting to make instructional videos to help other users. I have plenty of skills, but definitely not the video tutorial production skills that you possess :) Particularly how you simplify the amazing but not easy to grasp at first Crockoblock suite.

[@aamirkhan3019]

I follow your channel regularly.

[@NOALNOM]

Hey Paul!!! Now that BRICKS Theme is the new awesome kid in the block (lol) you'll need to create a new serie of tutorials of how create a Custom Frontend Dashboard but in BRICKS, all your followers will be humble thanksfully.

[@thatguyinjapan1]

This series is amazing. I had an issue that was boggling my mind. Every time I tried to update/edit a post my account page got deleted. I found the solution and verified it with 2 other Crocoblock sites. It is in the Submit Form. There is no need for a hidden_id (post id) as a field. I have verified this with 3 other sites. Submit forms - no hidden_id and it all works now.

[@AlexPlayerDigital]

THANK YOU. This has me stuck for hours...

[@ludovicallo]

Many thanks, this has stuck me for hours too !

[@AlexPlayerDigital]

@@ludovicallo HAD.. HAD!! Common, let the single letter typo RIP.

[@ludovicallo]

Sorry, English is not my language !@@AlexPlayerDigital

[@AlexPlayerDigital]

@@ludovicallo Ah, thought you were mocking my mistake :)

[@baliflorent6971]

Thanks. Now I know WordPress can build any CRUD application easily with jetEngine profile builder.

[@faisalzafar1125]

It was really helpful

[@giantleapworkspacespeciali723]

Wow, Great. yup, super perfectly timed, can't wait for the next one. hope its soon ...can't wait!, actually about to buy Jet engine because of this tutorial so far.

[@thatguyinjapan1]

Another note about this video. @wptuts - around the 40:39 mark you are showing how to map the fields out from the forms. On the forms, you used the format "recipe_ preperation_time" and say that it is mapped out to "recipe_ preperation_time" from the Recipe CPT. But the Recipe CPT field name is only "preperation_time" without the leading"recipe_" section. Does this need to be added in your video? Seems if you are telling the Notifications from which CPT to pull from, only the name from the CPT is the "mapped to" box needed.

[@bouhama1881]

Nice and very instructive. It would have been nice to test it after (a bit speedy at the end) followed part 1 and 2 , but on testing it was a bit scramble (egg 😄). Looking forward for part 3 thanks again

[@sammyvillarreal_youtube]

Another great tutorial! Thanks again. I've got a question... When creating frontend dashboards with Crocoblock, is there a way to allow certain repeater fields to be rearranged by the frontend user?

[@PatriceFornalik]

Thank you for your video, as always very clear. I was wondering if you knew a way to add a "user history page" for en membership site. That is to say, a way where a registered user can see the pages (and idealy le custom post type) he/she had read with a date to jump on it or see what he/she prefered. Thanks a lot.

[@diyzona]

One importan step was missed in tutorial. In the edit form, post_id field must be edited and in there the Query variable key must be edited to _post_id. If not the update post will mess with Profile builder pages, and rewrite everything wrong.

[@WillSmith-qt7me]

Thanks

[@treepocket2834]

Thank you sooooo much for this! I had scrapped pretty much everything I had done and restarted thinking I must have done something incorrectly. I don't know why I did not see this comment before as I typically check comment section first. Would have save me soo many hours of reworking and reworking.

[@aniket4572]

I just deleted the post Id feild from the edit recipe section. Is that good?

[@shazadmohammed925]

How do I add a community badge on all the listings that are submitted by the community?

[@mentalog6018]

Hello, excellent video tutorial. Can you answer a quick question? I have created certain subpages inside the profile builder. How do now redirect those specific subpages to a different prebuilt page within the site? Crockoblock should have an option that allows users to redirect the subpage to any link. Although I don't see it, and really don't want to use a plugin. Any help would be appreciated. Thanks again.

[@redtvtalks3464]

You are simply great, content delivery is amazing 👌hat's of you 👍plz make sure sub title don't overlap cursor on screen.

Hi Paul and I'm posting in general, I have a problem with the Jet Engine User Profile, specifically when updating a recipe, it turns out that clicking on update the account page disappears and the recipe is not updated, but a new one is created. Has anyone here managed to resolve this error?

[@olgastambulchik9653]

Great video! What plugin do you recommend using for a "Print a recipe to PDF" button ?

[@paulhildmann8392]

Excellent Video! Do you believe JetEngine is a better alternative to Advanced Custom Fields? I have a client who teaches classes in 3 different locations so we need to be able to list classes by date, location, time, and tuition fee. Just curious if you have some insite as to which might be a better alternative. Thanks for the tutorials, they're very helpful.

[@Open4Didact]

Woooh this video is huge , you can't imagine that this video will help me keep a client so thank so much, One thing i want asking to you is if i want : 1- Integrated payment to my listing that user can buy straight to listing 2 - Make a listing premium to appears on top of every listing cause is pay listing with membership acccount 3 - Integrated payment option in user account then user can manage his payment from customers. how should I do? Thank You somuch for all you have done till now is amazing YOU ARE GREATEST.

[@kitsophalheng7401]

Thanks Paul for awesome videos. Keep up the great work. I have one question: how can user register in our site in the first place before they can login?

[@marcodicarlo5231]

Awesome and super helpful video!!! But by any chance is it also possible to be able to schedule the publication date of the post always from frontend?

[@judemanatunga213]

Hi super tutorial thanks, can you advice how to combine multiple CPTs on one archive page, any plugin you recommend thanks

[@DanielBarbarini]

Great content! I hit a wall regarding a query. I have a post type with a lot of information that I divided into 5 forms and profile pages. I managed to edit the first form because the click comes from the listing. Now on the profile first page I tried to add a Dynamic Link to the second form but I just can't make it keep the same post id. Any idea?

[@muadmz]

Do you have any videos where we can compare similar custom post specs posted by different users? for example cars, real estate, etc. Keeping in mind comparing easily on mobile

[@MarceloGlezDigital]

Excellent Paul, I am wondering how to add a related CPT to the form. I have created a relationship in "Relation" but I cannot find information about it. Is there a tutorial? Thank you!

[@randomstranger9494]

YESSSSSS

[@ernestolauer7074]

Amazing content. Can i use the listing items that i made before installing profile and forms functionality? Thank you

[@chantalcoetzee8234]

amazing tutorial. is it possible to use this same idea for uploading products? i do a lot of online shops and this type of adding posts will be perfect for when adding products

[@Daniele77ba]

Hi Paul, probably I've spotted a mistake in the video that caused more than an headache. When You duplicate the "Add new post" in order to create the "Edit Post" form (46:46) You've suddenly gone to the "Pre-set form field values" and this is correct but ALSO in "Field Settings/Field: post_id:hidden" You must select URL Query Value too! I had a serious issue without activating that option! Isn't it ?

[@RivieraKid69]

What problem were you experiencing?

[@peposcz]

Thanks so much for the help. Without this modification, the Edit Recipe Template is edited instead of the Recipe post. I used a post type "Page" (not Profile Tempate) for editing the Recipe, and when editing the Recipe, this page was deleted, resp. its post-type has changed and a new Recipe entry has been created with the name of the Edit Recipe Page.

[@RivieraKid69]

I wonder if this is the cause of my error: ""Sorry, the content area was not found in your page. You must call the_content function in the current template, in order for Elementor to work on this page." May be worth mentioning it in the WPTuts fb group.

[@Daniele77ba]

@@RivieraKid69 You've suddenly gone to the "Pre-set form field values" and this is correct but ALSO in "Field Settings/Field: post_id:hidden" You must select URL Query Value too

[@RivieraKid69]

@@Daniele77ba Ok. I must be missing something because when I watch, when creating the Edit Recipe after copying it from Add Recipe, he does set the post-id, between 47:00 and 48:15, explaining what is going on also. I think the issue I mentioned is something else, the Account Page got stuffed, and reimporting the skins again seems to have caused a problem.

[@mohamedelkholy1252]

Is there a way to have multiple dashboards based on user role? for example a student dashboard and a teacher dashboard each with its own menus and functionality.

[@jeffspring2205]

Great video.Before users insert or edit a post they need to register first.Do we need another plugin for user registration or we can do that with jet engine?

[@WPTuts]

You can do that with either JetEngine or with the free form plugin from Crocoblock.

[@vidyakumari2854]

Thanks a lot for this video, I was actually looking for the solution to use stripe or PayPal payment on my subscription based website. Could you please elaborate how do you set up subscription expiry date and update this info in the custom post?

[@techsolutions3716]

You have added category checkboxes to assign terms, but i think you can't add new terms from front end right ?

[@torosuarez]

Hi Paul, question, How to make posts accessible to read, like not a listing, but more allow the user to create full posts like the WP regular ones, where you can enter the post and read the whole thing?

[@busyexpand]

How can you connect the listing to woo commerce so it becomes a product that can be purchased and tracked in an orders list

[@waynenunn7319]

Excellent tutorial. I have a large collection of recipes, is it possible to do a bulk import?

[@trooperstravels]

I think I missed how user set up an account in the first place to start listing, is that in this video?

[@marcjager5188]

Hi, I having some trouble displaying meta fields. I have created a post type let's say "Client Details" and then created all the meta fields. The I created a post for the post type. Now the problem is that i can't display any of the fields using "dynamic field" Maybe I don't understand it correctly I want to show some of these fields anywhere on the site, like for example in the header. Now i can see fields using listing grid and when logged in, but anywhere else on the site it shows an empty field? Is there anything i could do to display term data of a post anywhere in the website?

[@user-ow8yx4gk4l]

Hello. thanks for your great tutorial video. I have a problem with updating custom post type via jet engine form builder. when a user wants to create new post from CPT, it works correctly but when they want to edit (update) their own posts, it doesn't work and some part of website crashes! for example some pages will be deleted (such as account page created for dashboard). I configured all the settings based on your video. I tried multiple times to fix this problem but I couldn't. I appreciate you if you know the solution, tell me it. Thanks a lot.

[@treepocket2834]

I don't know if you have figured this out yet, but if not and it is only the updating part: In your edit form Field: post_id add the QRL variable also, then add the query variable key as _post_id I found this information in the comment section after endless hours of searching. It helped tremendously! also check your template if it is rewrite/content.

[@aik64g]

Paul, can we do this with bricksbuilder and jet engine?

[@ManeshNagarThinking4Success]

Hi there Paul - great tutorial thank you. Really enjoy your videos - much to learn from. I do have the following question: I followed your tutorial but for the purposes of updating / adding news posts. Side Note: I was attempting to follow your tutorial, but using the new jetForms and not the legacy JetEngine Forms When I tried updating a post - I somehow lost access to wp-admin - it seems the update did not update the right post I had to restore the site - and replicate everything from scratch. However, this time I asked someone from CrocoBlock to verify my settings - and he added the following change: in the edit form - the first field is "post id" which is hidden. And he mapped this to the "query variable: _post_id" which seems to be missing from your video. Is it possible that this is the reason the wrong post was updated when I tried? and is this necessary to have mapped?

[@Tikysk2]

23:51 thk bro gl!

[@Properture]

How does the listings uploaded by a user linked to the Woocommerce cart and checkout page?

[@wdgdingguo4020]

Great stuff! Can I do the same with JetEngine WITHOUT Elementor?

[@BneiAnusim]

Is there a feature in Elementor or Crocoblock to load data from a .csv?

[@honeypeadigital]

Late to the chat. I love the tutorial. Very helpful. The only problem I have is that all the tutorials show how to register and how to log in...but umm...how do you log out?

[@dominikmoravcik1896]

Can someone help me how to edit the user settings in the account side menu?

[@emran310]

@wptuts I have a problem with the Jet Engine User Profile, specifically when updating a recipe, it turns out that clicking on update the account page disappears and the recipe is not updated, but a new one is created. Has anyone here managed to resolve this error?

[@JameyTsey]

Hello, I have a question about why submited a post via jetengine form but cannot edit it in dashboard?

[@alihmd1628]

There was 1 issue, the wysiwyg edit buttons were taking the default custom button design, how to change them ?

[@Shapeways_io]

does anyone have the issue of when editing a recipe added, it duplicates it recipe instead updating the original receipe

[@rubelhussen3732]

Hi Paul, i need your template link just for practice purpose.

[@user-ud6gb5pz7s]

Whenever I want to submit the edit post it just updates the whole account page and the created post overwrites the account page. I followed every step tho...

[@shazadmohammed925]

Great video! A quick question. When a user submits their recipe, will this be searchable on the smart filter that we set up in part 1?

[@WPTuts]

Yes, these are just standard WordPress posts and can be indexed and filtered in the same way.

[@shazadmohammed925]

@@WPTuts Thanks! Also, how can I make the wysiwyg in the form a required field? There is no option for that.

[@johnwellington269]

Paul, can i buy this demo made site with wpvivid format?

[@CameronPrudames]

Great tut! How about if you only want someone to be able to create 1 post and then be able to edit it, but you no longer want to show the ADD POST!

[@dcsalg79]

It does not load the data in repeater of the form edit, why is it? I see the empty fields, but if the data is in the post type. please help me!

[@user-vo6cp3zw1r]

Been watching your tutorial for about 4 years now and i want to say thank you for your help, Also, I have a request, I'm trying to build a "Trip Adviser" website, can you do a tutorial on how to achieve this. ie user comes on and does a review once he does the first review the business is then listed on the site and cannot be changed unless by admin. Then other people can come on and review they can edit and change their comments but not business details, also they can add photos and videos that people can view just like Trip Advisor. The owner of the business can claim the business as the owner and adjust certain things like opening and closing times. etc Thank you

[@shazadmohammed925]

Hi, when i edit the recipe i get the following error "There was an error trying to submit form. Please try again later." I followed all your steps. Do you know what that could be?

[@AashishVerma-xz5wx]

Can anyone help me there's some issue in mine, couldn't understand them. When i delete any recipe post. The whole account page of the profile builder gets deleted and if i edit any recipe the account page turns itself into recipe post .

[@emanuelbrunoo1064]

Hi, Paul C I love your teaching, could you please adjust the subtitle of the JetEngine series, as it has one in Korean, I know I'm just one person asking for it, but I'm Brazilian and I don't understand anything and I've been using google translator to write this message, I'm very grateful for the little I try to understand and understand

[@nielsr3680]

@WPtuts I want to create a website where subscribers can upload private files. What they upload must only be visible and editable to them. Is that also possible? So others are never allowed to see those posts. I'd love to hear it and thank you!

[@nielsr3680]

Somebody the answer?

[@tamalhasan661]

Time 18:09, using Customized field output, to make it 'published' i/o 'publish' , can we not write %sed? Adding this 'ed' makes it published though!

[@WPTuts]

If you want to add that to every status, yes. But that wouldn't be ideal. ;)

[@tamalhasan661]

@@WPTuts Noted and thank you.

[@Shapeways_io]

when i edit a recipe my account page deletes

[@kartikpatel7220]

Please help me to solve this problem, I designed a dynamic website with the help of jet engine, but when anyone adds a post from the front end, the add post page automatically gets deleted. I don't know why this is happening.

[@treepocket2834]

I don't know if you have figured this out yet, but if not and it is only the updating part: In your edit form Field: post_id add the QRL variable also, then add the query variable key as _post_id I found this information in the comment section after endless hours of searching. It helped tremendously! also check your template if it is rewrite/content.I don't know if you have figured this out yet, but if not and it is only the updating part:

[@aaronparodipaez7085]

Instead of using Elementor, can I build the frontend interface with Spectra?

[@WPTuts]

Probably, but I don’t use Spectra to give a definitive answer.

[@mateuszklups3934]

Do somebody has any idea how to prevent user from editing other user's posts by changing _post_id param value in the url? User can get access to other's posts even when it not appear in the listing page..

[@WPTuts]

Have a look on my channel for frontend dashboard and there's a tutorial that covers all of that.

[@mateuszklups3934]

@@WPTuts thanks, definitely going to do that!

[@techbyfinne]

Can I let a user add content, but not have the abilities to edit and delete after the content is approved? Thanks for your videos / Update: I think I got the answers in the video :)

[@WPTuts]

You could set up a condition to check if the status is set to publish and then hide the edit option. That should work (I haven't tried it, but in theory that would the easiest way).

[@techbyfinne]

@@WPTuts thanks I will try that:)

[@BestMLMDXN]

Dear Sir, Can we use Jet Engine form, Jet Form directly in Elementor using Jet Form widget available in Elementor widget panel ? Can we directly create different types of forms with fields in Elementor ? I don't want to use Gutenberg. It seems to be clunky to me. Types of forms - Contact form, Registration form, Login form, Booking form etc 1. Contact Form with fields: Name, Email, Message and Submit button 2. Registration Form with fields: Name, Email, Password, Confirm Password and Registration button. 3. Login Form with fields: Username, Password and Login button. Is it possible to create new form fields directly in Elementor ? I know I keep asking you lots of questions because I consider you to be my teacher in the field of web design and development. I do not know coding but web design is my passion. Your tutorials has been very helpful to me and I keep waiting for your videos. I hope you will keep guiding me. Stay safe, stay healthy. With warm regards, Vivek Kumar ( Bihar , India )

[@MrComboLs]

Yes, you can

[@DIGraffiX]

I've followed along with the video to the letter and the edit listing link in the post works but the edit listing link in the profile menu doesn't. it goes to a blank form rather than a populated form. Any assistance you can offer?

[@darvey1979]

same issue here :(

[@darvey1979]

already refresh permalinks... wordpress and browser cache but still not working... did you find any solution?

[@dscooker3464]

same trouble

[@mdtitumir7236]

Boss might have learned a lot if your videos weren't awesome

[@RichardWadeUK]

Awesome stuff Paul... You are the Crocoblock King 🤴and I can’t wait until the next instalment of this amazing series. Keep up the great work