Form button - neither custom image nor custom text will show up

Gravity Support Forums » Plugin Support » Gravity Forms

ricklepage
Member

I must be missing something obvious. I want to use a custom button for my very simple form.

In the Form Settings > Advanced tab I linked to this image as my button:

http://www.photoshopelementsuser.com/images/learningcenter9/get-kit-now-258px.png

(see here: https://img.skitch.com/20110929-chdhhc95tnwqbbdibashe8ytah.jpg )

... but when you go to the page, only the generic "Submit Comment" button appears (clearly affected by the CSS).

http://www.photoshopelementsuser.com/newlearn9/

Then just to experiment, I tried changing the text on the button, but that also didn't take.

Help a n00b?

Posted 12 years ago on Thursday September 29, 2011 | Permalink
Kevin Flahaut
Administrator
Something ( most likely in your theme ) is changing the forms markup in relation to the button. If you look at your theme's functions.php file, you'll probably find it there.

Your theme has this..
```
<button class="button round_button" type="submit"><span>Submit Comment</span></button>
```
and a standard form with the image option enabled has this..
```
<input type="image" tabindex="89" alt="Submit" class="gform_image_button" id="gform_submit_button_6" src="http://www.photoshopelementsuser.com/images/learningcenter9/get-kit-now-258px.png">
```
You can see that the input type is not even an actual "input" now but is using the button element. Also "round_button" is not a standard class name used in Gravity Forms.

Does the button work properly in the form preview? If so, then it's definitely some conflict with your theme. You may need to discuss that with your theme developer to find out how to disable whatever is overriding your form settings.
Posted 12 years ago on Thursday September 29, 2011 | Permalink
ricklepage
Member

Great advice - thanks! I will forward your thoughts on to our developer.

Regarding the button in the form preview - no, it doesn't work at all. I assumed that the form preview somehow did not include showing the button:

https://img.skitch.com/20110929-xs6pugba6ahe16p4ap78329u9i.jpg

Neither does it appear when working on the form -- should it?

https://img.skitch.com/20110929-qrbr242taja1xejysasucxx98t.jpg

Posted 12 years ago on Thursday September 29, 2011 | Permalink
Kevin Flahaut
Administrator

Yeah, it should be displaying in the preview. That's odd.

Here's my quick test: http://bit.ly/pbSnfJ

That's a screenshot from the preview in the 1.6 release candidate, but the preview functionality hasn't changed at all, just some of the header styling.

Something is amiss my friend. I'm not sure I'll be able to tell you what without seeing your actual form admin & preview page. If you'd like, you can send an admin login to your site via our contact form and we'll see what we can figure out.

--------------------------------------------------------

EDIT: just thought of this.. if there is a custom code in your theme functions file to change the button markup, that could also be executed in the preview window as well. I'm thinking of this filter in particular that replaces the standard button markup.

http://www.gravityhelp.com/documentation/page/Gform_submit_button

Check for that in your theme's functions.php file and see if you can find it or something similar. My guess is that's what's preventing your form options, specifically the button settings from displaying properly.

Posted 12 years ago on Thursday September 29, 2011 | Permalink
ricklepage
Member

Holy Code Jedi, Kevin.
You are absolutely spot on.

My own web guy just wrote me back to say that we did that in order to make the all-important "Submit Comment" button on our articles look that way.

https://img.skitch.com/20110929-1wifg63b3ni8fmnfhna7wxjcg4.jpg

Is there a way to be selective about this, so I can have my cake and eat it to, so to speak?

(i.e. have the submit button for comments look that way but use images where I want to elsewhere)

Would it work to create my own image of that button and then just instantiate that as the default unless otherwise requested by the Gravity Form?

Posted 12 years ago on Thursday September 29, 2011 | Permalink
Kevin Flahaut
Administrator

I would think your developer could modify his code so that it only targets the submit buttons in the comment form itself ( based on a class name, or inheritance from another element with an ID, etc. ) and doesn't apply globally to everything like your custom Gravity Forms.

I believe that would be the best solution moving forward without having to hack around everything else.

Posted 12 years ago on Thursday September 29, 2011 | Permalink
ricklepage
Member

We figured out that the code was only modified to preserve consistency between Gravity's button in our customer service "contact us" form and the submit button Wordpress uses across the rest of our site. I made a graphic version of that button, called it from the contact us form, and turned off the filter. Voila!
http://www.photoshopelementsuser.com/newlearn9/

Question the 2nd: Is there a way to minimize the gap between the "enter your email" field and the button? I'd like them to snug up to each other if possible.

Edit: something in the CSS, I found it.

Posted 12 years ago on Thursday September 29, 2011 | Permalink
Kevin Flahaut
Administrator

Okay, sounds like you're on the right track. Creative solutions for everyone today! Thanks for the update.

Posted 12 years ago on Thursday September 29, 2011 | Permalink

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