PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Can Gravity Forms break my Carousel layout?

  1. I am a new customer who recently installed the Gravity Forms Developer Plug-in... and a few add-ons for it: Mail Chimp, Survey, Polls, Quiz, Toolbar, Duplicate Prevention & CSS Ready Class Selector

    I haven't actually done anything in terms of setting any of them up yet, just a default plug-in install.

    I use a theme called "Storefront Elegance" and on the front page it has a "carousel" of 5 images at a time, which general present horizontally and scroll right to left through a series of images of the "carousel type".

    Subsequent to installing the Gravity Forms plug-in, this carousel broke so that it now displays ALL the images in one tall vertical column, no scrolling, thus breaking my front page look.

    I've also recently done a few updates to other plug-ins, before I noticed this was broken, so I can't defacto pin it on the Gravity Forms install, but wondering if anyone has any idea if (and how) this was caused by the Gravity Forms plug-in?

    I'm pretty novice, but have some concept of CSS files and so forth. Wondering if a file got over-written, or maybe there is a conflict of some kind?

    Website is http://www.canadianpassionplay.com/
    (however I have temporarily turned off the carousel due to the broken layout)

    Posted 11 years ago on Saturday May 18, 2013 | Permalink
  2. Richard Vav
    Administrator

    Hello,

    I have taken quick look at the your site and you have the following javascript error

    Uncaught TypeError: Object #<Object> has no method 'on'

    straightaway I can tell you that points to your problem being an old version of jQuery because the .on() method was introduced in jQuery 1.7, so looking at the source code for your page I then spotted this really old version being loaded from Google probably by your theme

    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js'></script>

    You need to update that to version 1.8.3 which is included with WordPress 3.5.1, when WordPress 3.6 is released later this month the included version of jQuery will be updated to at least 1.9.1

    The recommended way to load jQuery is to enqueue it that way any plugins that require it know not to include it themselves.

    wp_enqueue_script("jquery");

    Edit: If you copy and paste the contents of your themes header.php and functions.php files seperately to http://www.pastie.org/ and post the links here I can help you update jQuery and make sure it is enqueued in the correct way as to avoid any problems in the future.

    Regards,
    Richard

    Posted 11 years ago on Saturday May 18, 2013 | Permalink
  3. Thanks so much for the detailed and helpful response Richard!

    Here is the header.php info:
    http://pastie.org/7928383.js

    Here is the functions.php info:
    http://pastie.org/7928387.js

    Posted 11 years ago on Sunday May 19, 2013 | Permalink
  4. This is in my style.css for that theme (in regards to my Carousel):

    http://pastie.org/7928405.js

    Posted 11 years ago on Sunday May 19, 2013 | Permalink
  5. Richard Vav
    Administrator

    Well it's not been included by your header or functions files, however in your functions file there is this line

    require_once ($includes_path . 'theme-js.php');				// Load javascript in wp_head

    so can you copy and paste the contents of theme-js.php which can be found in your themes /includes/ folder.

    Posted 11 years ago on Sunday May 19, 2013 | Permalink
  6. Here it is:

    http://pastie.org/7928643.js

    Posted 11 years ago on Sunday May 19, 2013 | Permalink
  7. Just to clarify for you, the Carousel was working fine 3 or 4 days ago and I haven't done anything related to jQuery that I am aware of.

    Posted 11 years ago on Sunday May 19, 2013 | Permalink
  8. Richard Vav
    Administrator

    OK, found it, in theme-js.php can you change this part of the file

    <?php
    function my_theme_enqueue_scripts() {
        // only on the front end; don't mess with Admin scripts
        if ( ! is_admin() ) {
            // Only enqueue the core-bundled jQuery script
            wp_deregister_script('jquery');//deregister current jquery
    		wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js', false, '1.3.2', true);//load jquery from google api, and place in footer
    		wp_enqueue_script('jquery');

    to this by removing lines 6 and 7

    <?php
    function my_theme_enqueue_scripts() {
        // only on the front end; don't mess with Admin scripts
        if ( ! is_admin() ) {
            // Only enqueue the core-bundled jQuery script
     		wp_enqueue_script('jquery');

    Now if the Carousel is still broken you are going to have to turn it back on so I can see it in it's broken state to try and identify the problem.

    Posted 11 years ago on Sunday May 19, 2013 | Permalink
  9. That broke the front page slider so it stopped loading (just showed an infinite loading icon)

    I reverted it to the old file, but before I did I re-enabled the carousel and there was no change.

    Posted 11 years ago on Sunday May 19, 2013 | Permalink
  10. Not sure if this helps at all, but this is the Custom CSS entries from the Theme Setup Page:
    http://pastie.org/7930968

    Posted 11 years ago on Sunday May 19, 2013 | Permalink
  11. Richard Vav
    Administrator

    It looks like you are using Storefront Elegance 1.4.5, version 1.5.7 was released earlier this year, since your version there have been a number of fixes and updates that include just to name a few

    • upgraded the jQuery version
    • Fixed errors in carousel
    • fixed a ton of bugs

    The problem is jQuery has to be updated so up-to-date plugins such as Gravity Forms will function correctly, and as I indicated in my first reply there is at least one javascript error present and that is being caused by the old jQuery version, as I haven't seen the site with the carousel or slider broken I can only assume their problems will most likely be a javascript errors as well.

    Posted 11 years ago on Monday May 20, 2013 | Permalink
  12. Ok I will check that out... and let you know. Again thanks for the help!

    Posted 11 years ago on Monday May 20, 2013 | Permalink
  13. Richard,

    Upgrading the theme solved the issue... thank you so much!

    Posted 11 years ago on Monday May 20, 2013 | Permalink
  14. Richard Vav
    Administrator

    You're welcome and thanks for the update

    Posted 11 years ago on Tuesday May 21, 2013 | Permalink
  15. David Peralty

    Closing this topic as it is resolved thanks to richard :)

    Posted 11 years ago on Tuesday May 21, 2013 | Permalink

This topic has been resolved and has been closed to new replies.