Skip Navigation

[Résolu] How to edit posts with a front-end form if using Elementor templates?

Ce fil est résolu. Voici une description du problème et la solution proposée.

Problem:
The normal workflow to edit posts doesn't work with Elementor. When clicking the link to edit a post, the full post is displayed rather than the edit form.

Solution:
Instead of the normal Toolset workflow you need to add the edit form to a standalone page (you can design the page in Elementor, or not), and when linking to that page to edit a post, pass the ID of the post to be edited via a URL parameter.

Full details in the thread below.

Relevant Documentation:
https://toolset.com/course-lesson/front-end-forms-for-editing-content/

0% of people find this useful.

This support ticket is created Il y a 1 an et 11 mois. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.

Sun Mon Tue Wed Thu Fri Sat
- 7:00 – 14:00 7:00 – 14:00 7:00 – 14:00 7:00 – 14:00 7:00 – 14:00 -
- 15:00 – 16:00 15:00 – 16:00 15:00 – 16:00 15:00 – 16:00 15:00 – 16:00 -

Supporter timezone: Europe/London (GMT+01:00)

This topic contains 1 réponse, has 1 voix.

Last updated by Nigel Il y a 1 an et 11 mois.

Assisted by: Nigel.

Auteur
Publications
#2365225

Nigel
Supporter

Languages: Anglais (English ) Espagnol (Español )

Timezone: Europe/London (GMT+01:00)

The normal workflow for editing posts with front-end forms doesn't work very well if using Elementor templates for the type of posts that you want to edit.

Either the edit form doesn't appear on the front end at all, or the normal output of the template is shown and the edit form only replaces part of the output (where the post content would normally appear).

How can you edit posts on the front end where only the edit form appears in place of the normal output?

#2365825

Nigel
Supporter

Languages: Anglais (English ) Espagnol (Español )

Timezone: Europe/London (GMT+01:00)

The problem

Here's a recap of the normal workflow, and an explanation of why it doesn't work when using Elementor templates (or other page builders that offer templates) to display single posts.

With Toolset, you create an edit form and then add that form to an unassigned Content Template (required to provide context for the form). Then, in the Content Template assigned to a post type (i.e. used to display single posts of that type) you insert a shortcode to generate the link to edit the post.

The URL of that link points to the same post (the current post, to be edited), but adds a URL parameter content-template-id which passes the ID of the content template containing the edit form. When the page loads Toolset intervenes to output the content from the template specified by the url parameter instead of the normal template.

If using Elementor templates this fails, because it is Elementor not Toolset controlling what is displayed, and the content-template-id URL parameter is ignored.

The solution

So an alternative is to add the edit form directly to a page. In that context the edit form doesn't know which post to edit, so we use a custom URL parameter to tell it. We can name the parameter what we want, so let's call it editID.

In the Elementor template for the single posts where we want the Edit link to appear, we will construct a dynamic link using Toolset shortcodes inserted into an Elementor Text module, like so:

<a href="[wpv-post-url item='123']?editID=[wpv-post-id]">Edit [wpv-post-title]</a>

The wpv-post-url will output the URL of the page containing the edit form (we use the item attribute to specify the ID of the post or page we want to output the URL of, in the example the page has an ID of 123), and we append a URL parameter editID whose value is provided by the wpv-post-id shortcode (the ID of the current post, the one we want to edit).

Next, where the edit form is inserted on a page, it needs to know to listen for the URL parameter editID to determine which post to edit. The wpv-search-term shortcode will output the value of a specified URL parameter, and that can be used to provide the value for the post attribute of the cred_form shortcode that is used to insert the form.

The form needs to be inserted with a shortcode, so don't use the Form block (if editing the page with the block editor use the Fields and Text block, in HTML mode) or the Elementor Toolset Forms module (use the Text module).

[cred_form form="name-of-edit-form" post="[wpv-search-term param='editID']"]

When visiting a post the resulting edit link should link to the page containing the edit form with an editID URL parameter, and when clicking the link that page should load with the edit form displayed, editing the content of the post you just left.

Links
https://toolset.com/course-lesson/front-end-forms-for-editing-content/
https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#wpv-post-url
https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#wpv-post-id
https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#wpv-post-title
https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#wpv-search-term
https://toolset.com/documentation/programmer-reference/forms/cred-shortcodes/#cred_form

This ticket is now closed. If you're a WPML client and need related help, please open a new support ticket.