Sidebar formatting changes on page with form

Gravity Support Forums » Plugin Support » Gravity Forms

webwoman
Member

On several of my websites I have an e-newsletter subscribe form in the sidebar using gf widget and it looks great except on pages where I have another gravity form on the page itself. In this instance, the sidebar form stretches out vertically.
Some examples.
Subscribe form - no form on page - http://positivebalance.co.nz/
Subscribe form - form on page - http://positivebalance.co.nz/contact-2/ or http://positivebalance.co.nz/coaching/book-a-coaching-session/

Same thing happens on these sites:
http://www.creative-web-ideas.com/index.php/contact/
and
http://www.avidbeauty.co.nz/index.php/contact-us/
and
http://theconnector.co.nz/contact/

All these sites use different themes. Three are using genesis framework and one is not.
I would love to be able to solve this as it looks awful.
Note only the creative web ideas site has been upgraded to the version of gravity forms just released.
Thanks

Posted 13 years ago on Thursday September 9, 2010 | Permalink
Kevin Flahaut
Administrator
When you use the function call to embed the form, or the third party widget, the default GF styles and scripts aren't loaded automatically. When you embed the form into the content editor, the scripts get enqueued. That's why you're seeing a difference.. the default styles are being loaded on pages with other forms.

I would suggest upgrading to the newest version and using the built-in sidebar widget.

If you do embed the form via the function call or the Yoast widget, you'll need to manually enqueue the scripts by adding a snippet to your functions.php file
```
wp_enqueue_script("gforms_ui_datepicker", WP_PLUGIN_URL . "/gravityforms/js/jquery-ui/ui.datepicker.js", array("jquery"), "1.3.9", true);

wp_enqueue_script("gforms_datepicker", WP_PLUGIN_URL . "/gravityforms/js/datepicker.js", array("gforms_ui_datepicker"), "1.3.9", true);

wp_enqueue_script("gforms_conditional_logic_lib", WP_PLUGIN_URL . "/gravityforms/js/conditional_logic.js", array("gforms_ui_datepicker"), "1.3.9", true);

wp_enqueue_style("gforms_css", WP_PLUGIN_URL . "/gravityforms/css/forms.css");
```
Without this, the conditional logic scripts, datepicker script, form CSS and other elements needed for the full form functionality aren't loaded.

You can find more information at the URL below

http://www.gravityhelp.com/documentation/embedding-a-form/
Posted 13 years ago on Thursday September 9, 2010 | Permalink
Carl Hancock
Administrator

@webwoman Is this happening with the official widget included in Gravity Forms v1.4 or is this an older version using Joost de Valk's yoast.com widget?

Posted 13 years ago on Thursday September 9, 2010 | Permalink
webwoman
Member

Just upgraded http://www.positivebalance.co.nz to the latest version and replaces the yoast widget with the official widget. The problem is still exactly the same.

Posted 13 years ago on Thursday September 9, 2010 | Permalink
Chris Hajer
Key Master

Checking all the examples, they all look fine. Can you post a screenshot of what you are seeing that is not right? Also, in what browser are you seeing the problem?

Posted 13 years ago on Friday September 10, 2010 | Permalink
webwoman
Member

I am using latest version of Firefox but have also checked the site in IE and the formatting is the same. Two scrreenshots showing homepage - widget looks normal, then contact page - same widget is stretched.
1. http://www.creative-web-ideas.com/wp-content/uploads/2010/09/homepage.png
2. http://www.creative-web-ideas.com/wp-content/uploads/2010/09/contactpage.png

Posted 13 years ago on Friday September 10, 2010 | Permalink
obvio
Member

is there a way to know if a call to a form actually exists on each specific template so I could enque the scripts only there? I won't be able to use is_category or category__in to check so I need something more robust.. in other words: is there a global $gforms so I can check if it exists?

Posted 13 years ago on Saturday September 11, 2010 | Permalink
webwoman
Member

Sorry I'm not sure where you're wanting me to look.

Posted 13 years ago on Sunday September 19, 2010 | Permalink
Kevin Flahaut
Administrator

Looks like @obvio's post was out of context and meant for another thread. I'm assuming that's the case.

So, a default Gravity Forms install version 1.4 with WordPress 3.0.1 gives me this.

default theme (twenty ten), no form in content area - form in sidebar

screenshot

default theme (twenty ten), form in content area and form in sidebar

screenshot

You'll notice that the formatting is the same for both instances of the sidebar form. I've tried this on a few sites and haven't had any issues or been able to reproduce this when using the default Gravity Forms widget for the sidebar form.

Looking at your page again, the default forms.css file isn't being loaded on the pages without a form in the content area. The widget should be enqueuing that file for you.

This appears to be something specific to your installations. It could be a theme-related issue or even a conflict with another plugin.. not sure

You can try disabling all of your plugins, checking the page to see if the forms.css gets loaded properly on the page with just the sidebar form. If so, then re-activate plugins one by one until something breaks to find where the conflict is.

If you still don't come up with anything, you're welcome to send us an admin login via our contact form and we'll be happy to get in there and take a look at it.

Posted 13 years ago on Sunday September 19, 2010 | Permalink