Skip Navigation

[Closed] Edit content using Toolset Form on front end

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.

This topic contains 9 replies, has 2 voices.

Last updated by Waqar 2 months, 3 weeks ago.

Assigned support staff: Waqar.

Author
Posts
#1607433

Hi there.

I have the edit form setup for editing content on the front end. I am using this shortcode:

[toolset-edit-post-link layout_slug="edit-your-existing-organisation-profile"]Edit %%POST_TITLE%%[/toolset-edit-post-link]

It appears on the post in the correct way, with only the post author able to see the link. But when they click on the link, the edit form does not open. Nothing happens.

I am using Elementor, and adding the shortcode to the Elementor template in that way.

I hope you can help me.

Many thanks for your time.
Andrew.

#1607955

Waqar
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi Andrew,

Thank you for contacting us and I'd be happy to assist.

The use of "layout_slug" in your shortcode suggests that you've placed the actual edit form inside a Toolset Layout.

Since you're using the Elementor template, it is not recommended to use a Layout in this case.

Can you please create a new Toolset content template from WP Admin -> Toolset -> Content Templates and without assigning it to any page/post, insert the edit form in that content template?

Next, you can update your "toolset-edit-post-link" shortcode to target this new content template using the "content_template_slug" attribute:
( ref: https://toolset.com/documentation/user-guides/front-end-forms/cred-shortcodes/#toolset-edit-post-link )


[toolset-edit-post-link content_template_slug='slug-of-new-ct']Edit %%POST_TITLE%%[/toolset-edit-post-link]

Note: You'll replace "slug-of-new-ct" with the actual slug of your newly created content template.

For this arrangement to work, please make sure that in the Elementor template, a "Post Content" module exists to show the content of the current post.

I hope this helps and please let me know if you need any further assistance around this.

regards,
Waqar

#1608111

Hi Waqar, thanks so much for your reply.

I have used those layout slugs in all places across the site, so I guess I had better do something about that. Please confirm I understand correctly, and then I have another related question at the end.

So to create a shortcode which is better for inserting in Elementor, please confirm I understand correctly (or correct where I am going wrong as I think I am missing a few steps):

  • Create a new Toolset content template from WP Admin -> Toolset -> Content Templates
  • Do not assign the template to any page or post
  • Insert the edit form in this new content template
  • Save the content template?
  • Where do I then get the new content template-based slug from?
  • Add the slug with the actual content template slug I created above
  • Make sure that the post content widget is in the post in the Elementor interface

Do I make one of these for every edit form on the site?

On a second but possibly related point, when a user clicks the edit button, the page reloads and the edit form loads at the bottom of the page. So if a user doesn't know to scroll down, then they will likely think it has not worked.

Is there any way to open the edit form on its own page, with just the edit form on? And then when they click to save their changes ion the form, they are redirected again back to the actual post to see their changes in place?

Thank again for your time, I look forward to hearing back from you.

Very best wishes, and stay safe.
Andrew.

#1612175

Waqar
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi Andrew,

Thanks for writing back and I apologize for the delay in getting back on this.

> Where do I then get the new content template-based slug from?

- You'll find the content template's slug on its edit screen, just below the top title.
( example screenshot: hidden link )

> Do I make one of these for every edit form on the site?

- Yes, since each edit form will have its own form shortcode, you'll create a separate Toolset content template for each one.

> Is there any way to open the edit form on its own page, with just the edit form on? And then when they click to save their changes ion the form, they are redirected again back to the actual post to see their changes in place?

- This is possible, but you'll end up creating more pages and doing more work and the ID of the post that needs to be edited will also be exposed in a URL parameter.

A simpler alternative would be to include some custom CSS code in this new content template with the edit form so that all the content above it is hidden when the edit form is showing so that the user doesn't have to scroll down for it.

regards,
Waqar

#1613023

Hi Waqar,

Thank for getting back to me.

I'm going to try those suggestions.

With regard to this: A simpler alternative would be to include some custom CSS code in this new content template with the edit form so that all the content above it is hidden when the edit form is showing so that the user doesn't have to scroll down for it.

— Can you please point me to any resources on how to do this? Or some advice from yourself on how it would be achieved. How would CSS hide content depending upon whether or not the form was showing? Would that require javascript? I'm fine with CSS, but not javascript.

If you can help, it would be very much appreciated.

Very best wishes,
Andrew.

#1615267

Waqar
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi Andrew,

Yes, this is possible through custom CSS code, without the need for any custom script.

Any custom CSS code added through the content template that holds that edit form will only be loaded when the edit form is showing, which will give you the opportunity to hide the unwanted parts from the regular content of the page.

And when the form won't be showing, that custom CSS code won't be loaded too and hence the regular content will show as it is.

Note: To check which CSS code is applying to different page elements and write custom CSS code accordingly, you can use Google Chrome's inspect element tool, as explained in this guide:
hidden link

In case you have difficulty in making this work, you can follow the rest of the steps, to the point where the edit form and the regular content is showing, and then share the link to an example page. I'll be able to share some specific pointers around custom CSS code too.

I'm setting your next reply as private so that you can share the temporary admin login details once this edit form is working.

regards,
Waqar

#1615845

Oh wow, this is great thank you. Can you keep this open while I try this out and get back to you, please?

Thank you so much for really excellent support.

#1616489

Waqar
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi Andrew,

You're very welcome.

I'm setting your next reply as private and the ticket will be open for the next couple of weeks.

regards,
Waqar

#1625337

Thank you.

I just got a message saying that this ticket is about to be closed. Please can you keep it open. I plan to test this out next week.

Many thanks again,
Andrew.

#1625745

Waqar
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi Andrew,

Please take your time.

The ticket will now stay open for another week and I've set your next reply as private again.

If you get this email again, you can just send a message.

Note: Even if this ticket gets closed, you can always start a new one and mention that it is related to this ticket, and I'll be able to follow up.

regards,
Waqar

The topic ‘[Closed] Edit content using Toolset Form on front end’ is closed to new replies.