Help Center
How to Apply a Preset for User Account Page

How to Apply a Preset for User Account Page

This tutorial describes how to set up the User Account page using the JetEngine preset feature. Import the pre-set forms and account subpage templates on your WordPress website.

Before you start, check the tutorial requirements:

  • Elementor (Free version)

  • JetEngine plugin installed and activated

Profile Builder is a feature of the JetEngine plugin that allows users to create personal accounts and submit information directly from the WordPress website’s front end.

To simplify the crafting process, you can import the pre-made Account page and subpage templates with forms from the JetEngine Dashboard.

Importing Presets

Head to the WordPress Dashboard > JetEngine > JetEngine > Modules tab and ensure the Profile Builder toggle is enabled in the Default Modules section.

Warning

To import presets, you should enable the Forms (Legacy) module. The presets contain several pre-made forms (e.g., “Edit Post”), but be aware that JetEngine forms is the legacy feature. We recommend creating forms via the JetFormBuilder free plugin.

profile builder and forms modules activated in the jetengine dashboard

Then, open the Skins Manager and unfold the Presets tab.

Warning

If you click the “Import” button, the imported content will replace the previous content created with the Profile Builder feature.

jetengine skins manager

First, you can click the “Import” button near the User profile with editable content, which triggers a pop-up.

importing the user account page with subpages

As is written in the pop-up, the Account page with three subpages is imported and configured on your website. The subpages are:

  • “Main” with the Listing Grid that displays posts created by the current user;
  • “Edit post” with the “Edit post” form;  
  • “New post” with the “New post” form.

To close the pop-up, push the corresponding button.

Clicking the “Import” button near the Editable user settings page for user profile triggers another pop-up.

preset for user settings

This pop-up means that the “User Settings” subpage with the “Edit User” form is added to the Account page.

After importing presets, you should re-save the permalink structure. 

Move to WordPress Dashboard > Settings > Permalinks and click the “Save Changes” button at the bottom of the page.

re-saving permalinks on WordPress website

Adjusting Profile Builder Dashboard Settings

Go to the WordPress Dashboard > JetEngine > Profile Builder directory. In the Pages tab, the automatically created Account page is set as the Account Page option.

account page is set in the profile builder settings

Here, you can configure other settings described in the Profile Builder Overview.

For example, in the Template mode field, you can choose whether the templates of the Account subpages will be processed via templates or using page content.

For the Account page and its subpages imported with presets, the “Rewrite” Template mode is more suitable. If you want to use the “Content” Template mode, you should rebuild the Account page and its subpages.

Things to know

If you select the "Rewrite" option, you cannot edit the Account page since the content is displayed with the templates.

Learn more about the difference between the “Content” and “Rewrite” Template modes from the Creating User Account Page With Different Dashboard Structures tutorial.

rewrite template mode

Then, open the Account Page to observe the attached subpages. The User profile with editable content preset allows the import of the “Main,” “Add New Post,” and “Edit Posts” subpages. The Editable user settings page for user profile preset configures the “User Settings” subpage.

account page subpages

Unfold one of the subpages to observe its settings. All subpages have configured the Title, Slug, and Template options. You can rename the subpages and attach other templates to them if needed. 

These subpages also represent items on the menu placed on the Account page. You can conceal some subpages by activating the Hide from menu option, but they will still be accessible by URL.

You can also set user roles for whom the menu item will be shown in the Available for the user role field.

Things to know

Be aware the “Edit Post” subpage has the Hide from menu toggle enabled by default.

account subpages settings

To add new subpages, hit “+ Add New Subpage,” enter Title and Slug, attach the pre-made Template, adjust other settings, and hit the “Save” button.

Observing Elementor Templates

To check the imported subpage templates, navigate to the WordPress Dashboard > Templates tab, which is located under the Elementor tab. If you imported two presets, the Saved Templates tab will contain the “Edit User,” “Edit Post,” “Add Post,” and “User Post.”

To observe template content, hit the “Edit with Elementor” button.

elementor saved templates

The “Edit User” and “Edit Post” templates contain the JetEngine “Edit User” and “Edit Post” forms placed with the Form widget.

jetengine form in the subpage template

The “Add Post” template contains the JetEngine “New Post” form and Profile Menu widget. 

The Profile Menu shows the Account subpages as menu items by clicking which, users can proceed to the corresponding page. To learn more about its settings, proceed to the Profile Menu Widget Overview for Elementor.

profile menu widget

The “User Post” template contains the Profile Menu and Listing Grid widgets.

The Listing Grid displays the Listing template created for posts.

Unfold the Post Query tab and unroll the “Posts & Author Parameters” tab. It has the correspondent Type, the “Publish” option set for the Get posts with status field, and the “Current User” chosen set for the Posts by author field. With such settings, the Listing Grid displays only the published posts of the current user.

Warning

The following tabs (Posts Query, Terms Query, Users Query, Content Types Query) are considered legacy. We recommend using the Query Builder functionality and Custom Query tab, respectively.

listing grid post query tab

To observe the listing template settings, hit the “pencil” icon.

listing grid widget

If you hit the “gear” icon, you will open the Listing Item Settings

The Listing Settings tab contains such options:

listing item settings for the user post page
  • “Posts” Listing source;
  • “Post” From post type;
  • Preview Width range with the default value;
  • Make listing item clickable inactive toggle.

If needed, you can alter the settings.

The Listing template contains such widgets:

  • Dynamic Image with the “Post thumbnail” Source;
  • Dynamic Field with the “Post/Term/User/Object Data” Source and “Title” Object Field;
  • Dynamic Link with the “Profile Page” Source, “Edit Post” Profile Page, “Edit Post” Label, and “post_id=%current_id%” Query Arguments. That means after a user clicks on the Dynamic Link, they will be redirected to the account subpage with the form for the post editing and the ID of the chosen post transferred via URL.
edit post dynamic link

The Listing template can be edited here or follow the WordPress Dashboard > JetEngine > Listings directory. Find the “User Post Item” listing and hit the “Edit with Elementor” button.

user post item listing template

Examining Forms

To check the forms placed in the subpage templates, follow the WordPress > JetEngine > Forms path. Three imported forms are: “Edit User,” “Edit Post,” and “New Post.” To check their settings, hover over the needed form and hit the “Edit” button.

forms imported for the account page
Warning

These forms can be used for the Account page, but we recommend using the free JetFormBuilder plugin to create advanced forms.

Check out these tutorials if you decide to re-create the form with the JetFormBuilder plugin:

Checking the Account Page and Results on the Front End

Head to the WordPress Dashboard > Pages tab and find the Account page here.

wordpress account page

If you set the “Content” Template mode, you should use the Profile Menu, Profile Subpage Content, and other widgets on the Account page to customize it. Also, you need to delete the Profile Menu widget from the “User Post” template to avoid menu repetition.

If you set the “Rewrite” Template mode in the WordPress Dashboard > JetEngine > Profile Builder > Pages tab, you cannot edit the page since the content is displayed from the Account subpage templates. If you hover over the Account page and push the “Edit with Elementor” button, you’ll get the “Sorry, the content area was not found in your page.” error. With this mode, no changes are required.

To observe the Account page, push the “View” button.

By default, the Account page shows the “User Post” subpage template that in the Profile Menu is named “MAIN.”

user post account subpage template

Clicking the “Edit Post” link under a post redirects to the “Edit Post” subpage with the corresponding form. The form preset auto-fills the form fields with the chosen post data so you can edit them.

edit post account subpage template

If you click the “ADD NEW POST” menu item, you’ll proceed to the form for the post creation.

add new post form

If you press the “USER SETTINGS” menu item, you’ll open the “Edit User” form.

user settings account subpage

That’s all. Now you know how to set up the User Account page using the JetEngine preset feature for your WordPress website. Feel free to edit it so the Account page suits your needs.

Was this article helpful?
YesNo

Need help?

Ask Facebook community

Get answers from 22K Crocoblock Community experts from all over the world.

Start a live chat

Ask question to support agent and share its details via chat messages.