如何使用钩子编辑重力形式？

Question

我正在制作一个简单的电子邮件注册表单，并希望消除重力表单所具有的所有臃肿。我知道我无法摆脱一些 javascript，但我希望能够在不使用 ul 的情况下使表单工作，删除标题和描述等。

这是电子邮件注册的静态 html 版本的样子（我使用的是 bootstrap 3）：

我怎样才能让我的重力形式来自：

<div class="gf_browser_chrome gform_wrapper" id="gform_wrapper_2"><form method="post" enctype="multipart/form-data" id="gform_2" action="/exrnawp/" class="form-horizontal">
                        <div class="gform_heading">
                            <span class="gform_description"></span>
                        </div>
                        <div class="gform_body">
                            <ul id="gform_fields_2" class="gform_fields top_label description_below"><li id="field_2_1" class="gfield               gfield_contains_required"><label class="gfield_label" for="input_2_1">Email<span class="gfield_required">*</span></label><div class="ginput_container"><input name="input_1" id="input_2_1" type="email" value="" class="medium" placeholder="Email Newsletter"></div></li>
                            </ul></div>
        <div class="gform_footer top_label"> <input type="submit" id="gform_submit_button_2" class="button gform_button" value="Get Updates!" onclick="if(window[&quot;gf_submitting_2&quot;]){return false;}  if( !jQuery(&quot;#gform_2&quot;)[0].checkValidity || jQuery(&quot;#gform_2&quot;)[0].checkValidity()){window[&quot;gf_submitting_2&quot;]=true;} ">
            <input type="hidden" class="gform_hidden" name="is_submit_2" value="1">
            <input type="hidden" class="gform_hidden" name="gform_submit" value="2">
            <input type="hidden" class="gform_hidden" name="gform_unique_id" value="">
            <input type="hidden" class="gform_hidden" name="state_2" value="WyJhOjA6e30iLCIxNTU1YWU5Yzg1OGIxMDQ3ZGY5ZGZlZGU2MzA1ODNlMSJd">
            <input type="hidden" class="gform_hidden" name="gform_target_page_number_2" id="gform_target_page_number_2" value="0">
            <input type="hidden" class="gform_hidden" name="gform_source_page_number_2" id="gform_source_page_number_2" value="1">
            <input type="hidden" name="gform_field_values" value="">

        </div>
                </form>
                </div>

对此：

<form class="form-inline" role="form">
  <div class="form-group">
    <input type="email" class="form-control" id="exampleInputEmail2" placeholder="Email Newsletter">
  </div>
  <button type="submit" class="btn btn-warning pull-right"><strong>SIGN UP</strong>    </button>
</form>

Answer 1

删除标题和描述 HTML 应该像在 [gravityform] 短代码上为“title”和“description”属性传递“false”一样简单，或者如果您手动调用它，则在gravity_form() 函数上传递它们的等效属性。

如果您打算让 Gravity Forms 处理表单的提交，则需要保留大部分（如果不是全部）隐藏字段，这些字段用于让 GF 识别实际的 Gravity 表单是提交（而不是其他表单和任何其他对您网站的 POST 请求）。

如果你感觉很活泼，你可以通过“gform_get_form_filter”钩子完全重写表单的整个输出。它没有记录，但它将整个表单标记作为字符串和 $form 对象传递。

Answer 2

我最终使用了 jquery，它工作得很好，但不是最有效的方法。

<script>
$(document).ready(function(){
    $( ".gform_body" ).replaceWith( "<div class='form-group'><input name='input_1' id='input_2_1' type='email' value='' class='medium form-control' placeholder='Email Newsletter'></div>" );
    $('#gform_submit_button_2').addClass('btn btn-warning pull-right');
});
</script>

Answer 3

我知道这是一篇很老的帖子，但由于有关此事的文档很差，人们可能最终会在这里寻找答案（就像我一样），我想我会分享我最终的方法结束了。

所以，我所做的是使用 PHP 的 DOMDocument 类从 .gform_body 和 .gform_footer 容器以及 ul 元素中清理表单。然后，事情变得更加简单，因为您可以使用 Gravity Forms 的原生过滤器 gform_field_container、gform_field_input 和 gform_submit_button 来修改字段。

更详细的描述，这里是我的教程use DOMDocument to clean-up Gravity Form's markup。