Support » Theme: Storefront » Storefront conflicts with Gravity Forms

  • Resolved Toon Gerritsen

    (@toon-gerritsen)



    Hi,

    On my website with the Storefront theme, one of the Gravity Forms does not display.
    I found the following definition on the page that should display the form: <div id=”gform_wrapper_1″ class=”gf_browser_gecko gform_wrapper” style=”display:none”>

    I did not define this <div> and I don’t understand the style setting display:none
    The problem disappears when I select another theme.

    How can this happen and how can I repair this?

    PS.: on another page I see the definition <div id=”gform_wrapper_2″ class=”gf_browser_gecko gform_wrapper”> and this forms shows correctly (of course).

    I am using Storefront 2.3.5 with Gravity Forms 2.3.6

    Regards,
    Toon

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Job

    (@jobthomas)

    Automattic Happiness Engineer

    Hey @toon-gerritsen. This is not related to Storefront, but to Gravity Forms. I’d suggest contacting their developers.

    I have search the for the class and the ID on the Storefront repo and we don’t add any of that: https://github.com/woocommerce/storefront/search?q=gf_&unscoped_q=gf_

    That said, I’m not sure what the cause for this is, but that fact that the style is inline in a likely indication that there is somehow some custom CSS added. If it works with other forms and not with this one, I think checking if there’s no custom CSS added to the form or to your site, would be a first step.

    I’m going to mark this as resolved since it’s not a Storefront issue given that you can have another form display without problem.

    Hi Job,

    Gravity Forms sends me to Storefront (because the problem does not occur with other themes)…

    I meanwhile discovered that this problem may be due to a jquery conflict, see: https://stackoverflow.com/questions/17260059/gravity-forms-adding-display-none

    QUOTE
    If your theme moves scripts to the footer (frequently recommended for performance reasons) you’ll need to move the Gravity Forms scripts to the footer as well, so they get called after jQuery. You can do this by adding the following code to your theme’s functions.php file:

    add_filter(‘gform_init_scripts_footer’, ‘init_scripts’);
    function init_scripts() {
    return true;
    }
    UNQUOTE

    The proposed solution solved my problem.

    Regards,
    Toon

    Job

    (@jobthomas)

    Automattic Happiness Engineer

    Hi Toon, thanks for the update. I’ll also pass this on to our developers, to see if this is worth reviewing, but I’m not sure given that this is a specific plugin and I’m not sure how easy it would be to change this across the board.

    laceyrod

    (@laceyrod)

    Automattic Happiness Engineer

    Hi there!

    We’re going to mark this thread as “Resolved” now, but please feel free to open a new thread if you ever have any questions in the future.

    Thanks!

    Theme Author Automattic

    (@automattic)

    Resolved.

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.