CherryPick Studios

Surbma

<p>IMPORTANT! The latest version of Gravity Forms has a new option to add tabindex to its forms. When you insert a new form in a post or page, you can find this option under the “Advanced Options”. There you can give a value to the tabindex, which will fix this issue without my plugin. It means there is no need to use this plugin, if you give this tabindex value to every form on your page. This plugin is still working and it can save you time, so if you want to use it, there is no conflicts or any problem.</p>
<p>Fix for <a href="https://surbma.com/go/gravityforms/" rel="nofollow ugc">Gravity Forms</a> (affiliate link) tabindex issue, when more than one forms are displaying on one page.</p>
<p>Original solution from David Smith, <a href="https://gravitywiz.com/fix-gravity-form-tabindex-conflicts/" rel="nofollow ugc">Gravity Wiz</a>. Thank you!</p>


Surbma | Gravity Forms Tabindex Fix

I'm surprised, even embarrassed by the fact Gravity Forms doesn't do this automatically. Having to do this manually using "advanced options", give me a break! There's no reason you would ever want two fields to have the same tabindex.
Thanks for this.
Update: Looks like Gravity Forms added a solution so this plugin is no longer needed. Still, I appreciate the fix when it was needed!



Works, no configuration needed!

Fix for Gravity Forms tabindex issue, when more than one forms are displaying on one page.

Freemius

wptools

<blockquote>
<p>Embed gravity forms in Divi visual builder. Add styles for gravity forms border, background, title, description, inputs, labels, placeholder, errors, submit button & more. Premium version has 7-day FREE trial. No upfront payments needed.</p>
</blockquote>
<p>It has dependencies on the following,</p>
<ul>
<li><a href="http://bit.ly/2xcicxw" rel="nofollow ugc">Divi Theme</a> – Affiliate link</li>
<li><a href="https://rocketgenius.pxf.io/Rj0yR" rel="nofollow ugc">Gravity Form</a> – Affiliate link</li>
</ul>
<p>With the FREE plugin you can,<br />
* Add a gravityform on a divi page using the visual builder.<br />
* Configure the gravityform shortcode params</p>
<h3>Gravityform Shortcode Parameters</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/jwId9CUgxOc?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<ul>
<li><strong>Show Title</strong> – Toggle to display the form title. Defaults is <code>on</code></li>
<li><strong>Show Description</strong> –  Toggle to display the form description. Defaults is <code>on</code></li>
<li><strong>Ajax</strong> – Toggle to use AJAX to submit the form. Defaults is <code>off</code></li>
<li><strong>Tab Index</strong> – Specify the starting tab index for the fields of this form</li>
<li><strong>Field Values</strong> – Specify the default field values.
<ul>
<li>Example: field_values=’check=First Choice,Second Choice’. See also https://docs.gravityforms.com/using-dynamic-population/ for detailed information on dynamic population.</li>
</ul>
</li>
</ul>
<h3>Premium Plugin</h3>
<p>Premium plugin is available at <a href="https://wptools.app/wordpress-plugin/gravity-forms-divi-module/?utm_source=wp&utm_medium=plugin-page&utm_campaign=gf-divi&utm_content=description" rel="nofollow ugc"> https://wptools.app/wordpress-plugin/gravity-forms-divi-module/</a></p>
<blockquote>
<p>We offer a 7-day FREE trial on the premium plugin.</p>
</blockquote>
<h3>Style Form Background, Spacing & Border</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/Hg8fnxb4l5A?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>Set color, gradient, image or video backgrounds. Add border, margin & padding to form wrapper.</p>
<h3>Style Gravity Form Title</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/Tl88W1U2Uzg?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>Style the title typography and spacing using the divi module</p>
<h3>Style Gravity Form Description</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/Iy_JBVdFJSQ?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>To render gravityform description, toggle the <strong>Show Description</strong> to <code>on</code> in <strong>Gravityform Shortcode Parameters</strong>.</p>
<p>Style the description typography and spacing using the divi module</p>
<h3>Style Gravity Form Section Break Field</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/xJLCScsdg3o?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>Section break field adds a content separator to your gravity form – https://docs.gravityforms.com/section-break/</p>
<p>Style the content’s title, description, spacing and border color using the divi module.</p>
<h3>Style Input Fields, Input Wrapper & Input Placeholder</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/9Lsyn7Wdhdc?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<ul>
<li>Input fields are text, textarea, checkbox and radio fields. </li>
<li><code>Input Wrapper</code> wraps an input field. Manage input wrappers margin and padding.</li>
<li>Add background, border and rounded corners for text, textarea and dropdown fields.</li>
<li>Manage typography for input fields in the <code>Input General</code> section.
<ul>
<li>Manage checkbox and radio typography settings in <code>Checkbox/Radio</code> section.</li>
</ul>
</li>
<li>Manage margin and padding for text fields.</li>
<li>Manage typography for input placeholder text.</li>
</ul>
<h3>Style Label, Sub-Label & Input Field Description</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/XFxkwGRRE4c?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>Style gravityform’s label, sub-label and description for the inputs.</p>
<p>Set typography and spacing for them.</p>
<h3>Style Field Wrapper</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/XGhikyjuNBM?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>A <code>field wrapper</code> wraps the input field, label, sub-label and description.</p>
<p>Manage the field wrappers padding and margin in divi.</p>
<h3>Style Form & Field Validation Errors</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/CUBm1jCkKj0?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<ul>
<li><strong>Form Validation Error</strong> is a general validation error text for the whole form.
<ul>
<li>Manage typography, border color, margin and padding.</li>
</ul>
</li>
<li><strong>Field Validation Error</strong> shows the validation per field.
<ul>
<li>Manage typography, border color, background color, margin & padding.</li>
</ul>
</li>
</ul>
<h3>Style Forms Submission Confirmation Message</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/Vk_uk?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>Form submission displays a message. Style typography & background of the confirmation message.</p>
<h3>Style Gravityform Button</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/F7fNxHWb5RQ?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>Set button alignment, typography, border, rounded corner and background color with hover styles.</p>
<h3>Style Consent Field & Description</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/tFia_Ud54Ws?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>A gravityform consent field is a checkbox accompanied by description.<br />
It’s a compulsory field.</p>
<p>Style the checkbox’s and description’s typography, margin & padding</p>
<h3>Style Gravityform Footer</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/kbwzORqnWE8?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>Footer wraps the form buttons. Manage margin and padding for this element.</p>
<h3>Style Progress Bar</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/66DP_JBjGas?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>A multi-step gravityform has a progressbar at the top.<br />
Style the progressbar title’s typography, progressbar’s background and font color.</p>
<h3>Custom CSS Setting</h3>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/ly4WiUtYcD8?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></p>
<p>A fine-grained control over writing custom css for large number of form elements</p>


Divi Gravity Forms (WP Tools)

What else can I say, this plugin is super easy to use, and works great. 

Easy to use and works great

Divi 4 & 5 module to integrate Gravity Forms. Create custom-designed forms for your website using extensive style customization options, no coding …

Surbma | Gravity Forms Tabindex Fix vs Divi Gravity Forms (WP Tools)