Skip Navigation

[Resolved] Style cred form in Divi?

This support ticket is created 5 years, 8 months ago. 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.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Hong_Kong (GMT+08:00)

This topic contains 3 replies, has 2 voices.

Last updated by Luo Yang 5 years, 8 months ago.

Assisted by: Luo Yang.

Author
Posts
#1318677

Tell us what you are trying to do?

I have a complex CPT with many fields - I want to be able to use Divi tabs (as an example) to place specific form fields in a way that the user can logically input their data.

I have been able to place the entire form in a page built with the classic Divi builder and all the fields display correctly - I use the appropriate escape characters to insert:

{!{cred_form form='location-post-form'}!}

in the Divi text box. This displays the entire form.

I want to be able to place individual fields on separate tabs but I am stuck trying to figure out how to do this.

I tried inserting the cred form text from the Toolset form builder and replacing the [] with escaped characters. When I do this, all I get is the actual text displayed, no form.

Is there any documentation that you are following?

I found this:
https://toolset.com/documentation/user-guides/styling-cred-forms/

but there isn't sufficient information here for me to understand how to integrate this into Divi.

Is there a similar example that we can see?
No.

What is the link to your site?
Not available - using a VM on laptop at present to get things up and running as a simple prototype with Divi and Toolset.

#1318745

Hello,

There isn't such kind of built-in feature within Toolset Forms plugin, I suggest you try to follow Divi document to setup the tabs with HTML codes:
hidden link

For example, you can follow above Divi document to setup the tabs, get the tab's HTML codes, then copy/paste those HTML codes into CRED form content, put teach form field into correspond place of HTML codes.

#1319589

Wow - this is crude and clumsy.

Thank you for the response - I appreciate the pointer - after extracting the Divi short codes, I entered them via Expert mode into the Post Form editor, placing the cred field short codes in the appropriate places.

The form now renders as intended.

After looking through other themes and visual page builders, it seems the same issue exists with all the ones I reviewed. It leaves a messy work flow... maintain the layout in Divi so that it can be edited as a template, maintain the post form in Toolset so that the fields can be edited, ordering changed etc - then clone the form, edit the HTML in expert mode merging the Divi short codes and the toolset cred form short codes together.

I am migrating a web app from Drupal 7... there is no straight path to Drupal 8 - requires a substantial re-write so we decided to target WordPress. WordPress with visual builder offers a quicker path to front end design but the integration between CPT and form creation is a significant workflow issue - from a maintenance perspective for the customer, this warrants some further thought and design decisions.

Is better integration between Toolset Forms and page builders something on your futures road map?

#1319785

Toolset Forms plugin supports Boostrap grid (hidden link), you can enable it by these:
Dashboard-> Toolset-> Settings-> General
in section "Bootstrap loading", enable option "Toolset should load Bootstrap 4"

When you edit a form, in section "Form editor", you can drag each field into different place.

But Bootstrap is using different grid system from Divi, so there might be other unexpected result, so it is not recommended to use Bootstrap in Divi theme.

There isn't existed futures road map for using Divi to design the Toolset Form content, you can add a feature request for it:
https://toolset.com/home/contact-us/suggest-a-new-feature-for-toolset/