Tagged: , ,

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • October 6, 2015 at 2:46 am #514108
    daninyyc

    Friends,

    I’m starting to sweat over embedding a Gravity Form into a WooCommerce product page under Enfold.
    Here is a sample page – http://www.cisvcalgary.com/product/family-membership-3-year-2015-18/

    The basics seem to work fine, but when users fill the form, something gets skewed with the formatting. When you type in a value in the first column and tab-skip to the next, two things happen:

    (1) the box “drops down” a bit, out of alignment (see: http://i.imgur.com/njjYGbr.gifv ) ; and

    (2) Instead of focusing on the next column, a strange popup appears at the top left corner, “Skip to toolbar” (see: http://i.imgur.com/Y9BRaSo.png ).

    At first, the form appeared off alignment altogether. I reached out to Gravity Support, and they suggested floating the element:

    #top .gform_wrapper .gfield_list_1_cell4 select {
float: left;
}

    That changed things up a bit, but the problem remains. Since the form renders fine in preview mode, Gravity seems to think that it’s either the theme or Woo… what are your thoughts?

    • This topic was modified 9 years, 1 month ago by daninyyc. Reason: edited for formatting
    October 6, 2015 at 6:25 am #514144
    daninyyc

    Adding one piece of information… Gravity Support asked me to deactivate all plugins and switch to a default theme (Twenty Fifteen). In doing that, the off centre box issue goes away, so, likely – a theme-specific issue. The strange popup does not.

    October 6, 2015 at 5:46 pm #514641
    Andy

    Hi!

    what happens if you deactivate all plugins but Gravity Forms?

    Regards,
    Andy

    October 6, 2015 at 5:56 pm #514648
    daninyyc

    Thanks Andy,

    Deactivated all plugins (but Gravity Forms). No change.

    Daniel

    October 7, 2015 at 7:37 am #514950
    Rikard

    Hi Daniel,

    Could you please provide us with a temporary admin login so that we can take a closer look? You can post the details in the Private Content section of your reply.

    Regards,
    Rikard

    October 8, 2015 at 12:47 am #515516
    daninyyc

    Hi,
    Just curious if you received the creds as I’m not seeing anything…. sending again, jic.

    Thanks,
    Daniel

    • This reply was modified 9 years, 1 month ago by daninyyc.
    October 8, 2015 at 9:21 am #515641
    Rikard

    Hi,

    Looks like it’s the box shadow CSS which is causing it, please try the following in Quick CSS to see if that helps: 

    .postid-52 input[type="text"]:focus {
    box-shadow: none !important;
}

    Regards,
    Rikard

    October 8, 2015 at 2:47 pm #515828
    daninyyc

    Thanks Rikard,

    Tried – but no, it didn’t make any difference. Any other thoughts?

    Daniel

    October 8, 2015 at 7:49 pm #516059
    daninyyc

    So this did part of the job… now it seems to work well for the “text” fields, but as soon as focus hits the dropdown at the very last column – the row bumps down and out of alignment again.

    • This reply was modified 9 years, 1 month ago by daninyyc. Reason: Testing some more
    October 9, 2015 at 2:10 am #516122
    daninyyc

    Okay, now this is really resolved.

    CSS-related. After 6(!) hours of googling, trial-and-error-ing, etc, this quick CSS resolved it:

    #top .gform_wrapper table.gfield_list td {
  vertical-align: middle;
}

    Thanks for all your help!

    October 9, 2015 at 2:17 pm #516465
    Andy

    Hey!

    glad you found a solution and thanks for sharing it with us! Let us know in a new ticket if you have some more questions related to the theme. We are happy to assist you.

    Regards,
    Andy

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Enfold + WooCommerce + Gravity Forms Troubles’ is closed to new replies.