[resolved] Adding a css class to the submit button

Gravity Support Forums » Plugin Support » Gravity Forms

Joachim Kudish
Member

Hello,

I've purchased this script from codecanyon: http://codecanyon.net/item/css3-buttons/109193 and want to use it for the submit button, but to do so, I need to apply a new css class to the button, is there a way to apply a class to it without modifying core plugin files?

Yes, I know I could just apply the css to the proper classes that GF generates, but doing it that way would mean a whole lot more work :)

Any help would be appreciated.

My form is here: http://pamplemoussedesign.ca.s92071.gridserver.com/wp/say-hello/ (temporary url)

PS: Sorry if this question has already been answered, I searched but didn't find anything

Posted 14 years ago on Tuesday June 29, 2010 | Permalink

You can do this by adding some jQuery to your header.php file. This is assuming you've got the jQuery library loaded of course.

<script type="text/javascript">
jQuery.noConflict();
  jQuery(document).ready(function($) {

     $("#gform_wrapper_1 .gform_footer input.button").addClass("mynewclassname");

  });
</script>

That's specific to that form ID. If you want it to apply to all forms, then you can leave the "#gform_wrapper1" portion off and it should work for all.

<script type="text/javascript">
jQuery.noConflict();
  jQuery(document).ready(function($) {

     $(".gform_footer input.button").addClass("mynewclassname");

  });
</script>

Posted 14 years ago on Tuesday June 29, 2010 | Permalink

Joachim Kudish
Member

Hi there,

Thanks a lot for your help, it's very appreciated!

Is there a minimum version of jQuery required for this script to work, currently the site has 1.4.2 enqueued in the footer.
I've added the script to the header of the page, but the new class name doesn't get applied to the button. I've tried both versions of the script you provided.

Any additional help would very nice :)

Posted 14 years ago on Tuesday June 29, 2010 | Permalink
Kevin Flahaut
Administrator

Nope. Your version is the latest and should be fine. You need to make sure that jQuery is loaded somewhere BEFORE you call this script. You can either move the jQuery call to the header or move your script to the footer somewhere after jQuery is loaded. That should get you rolling.

Posted 14 years ago on Tuesday June 29, 2010 | Permalink
Joachim Kudish
Member
Hey,

I just found this piece of code in the documentation, which might prove to be more efficient for what I am trying to do:
```
add_filter("gform_submit_button", "form_submit_button");
function form_submit_button($button){
    return "<input type='submit' value='My new button' />";
}
```
Thanks for the great tip though.
Case closed
Posted 14 years ago on Wednesday June 30, 2010 | Permalink
Kevin Flahaut
Administrator

Great deal. Thanks for the update

Posted 14 years ago on Wednesday June 30, 2010 | Permalink

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