I'm having a Theme conflict and I'm trying to figure out what I can do to fix it. I did the checks and it works fine with the default theme. Had all the plugins deactivated and checked and that wasn't the problem. Any ideas? Here's the link: http://www.carolina-clean.com/bid.
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.
Theme Conflict. What to do?
-
Posted 12 years ago on Thursday July 14, 2011 | Permalink
-
Justin, please describe what does not work within your existing theme. Thanks.
Posted 12 years ago on Thursday July 14, 2011 | Permalink -
Oh sorry. The theme is fine. It's just the form looks all messed up. Not aligned correctly, button doesn't look right, etc. I guess the theme is messing up the form?
Posted 12 years ago on Thursday July 14, 2011 | Permalink -
The form inherits the CSS from your theme. If the form looks OK when you preview it, but looks different and bad when displayed within a page on your site, it's usually the theme's CSS that is the problem.
Please the things you are unhappy with, and in what browser you're seeing them, and we'll see what we can do about fixing them up. It's not a major thing: just some additions to your theme's site.css.
Posted 12 years ago on Thursday July 14, 2011 | Permalink -
The form looks perfect in the preview. But on the site the form is not aligned correctly. It's double the size of the preview form. The submit button (I'd like to setup an appointment) looks bad. Looks nothing like it should. Using Google Chrome as my browser.
Posted 12 years ago on Thursday July 14, 2011 | Permalink -
Looks like the #contact-form styles starting on line 436 are not specific enough and apply to all form elements, not just the contact form elements as designed.
I took lines 434 through 496 and made them apply specifically to the #contact-form elements. You can copy and replace just those lines with these lines:
http://pastie.org/pastes/2210808/textThe part to replace runs from this line:
#contact-form { width:450px; }to this line:
/* end-contact */That takes care of most of the layout problems.
The background image for the submit button is coming from a background image applied to all input buttons. Try overriding it by adding this to the end of your site.css:
.gform_wrapper .gform_footer input.button, .gform_wrapper .gform_footer input[type="submit"] { background-image: none; }See if that gets you headed in the right direction.
Posted 12 years ago on Thursday July 14, 2011 | Permalink -
I have no clue where to change these. I bought this theme from themeforest. Where do I make these changes?
Posted 12 years ago on Thursday July 14, 2011 | Permalink -
Ok I made the changes in the site.css using Dreamweaver. But when I go to upload the new theme zip I get "do you want to do this" please try again. What's going on?
Posted 12 years ago on Thursday July 14, 2011 | Permalink -
If you send an admin log in to your WordPress site using our Contact Form someone will be able to help you make those changes for you. Thanks for hanging in there.
Posted 12 years ago on Thursday July 14, 2011 | Permalink -
Ok just sent it over.
Posted 12 years ago on Thursday July 14, 2011 | Permalink -
Like Chris mentioned, the problem is with blanket CSS rules being applied to all inputs and labels by your theme. If you look at the theme stylesheet, site.css (line 436) floats all inputs to the left and again in the site.css file (line 463) the rule is floating the labels and constraining the label width to 140px wide.
If you disable these properties, you'll see that the form formatting is corrected.
screenshot: http://bit.ly/ozENQG
The easiest way to remedy your issue (and probably future form formatting issues) is to remove those properties from your stylesheet. If you don't want to do that, you'll need to use better inheritance and target the forms with some new CSS rules to override the theme styles.
You can find information and examples on how to properly do that in the documentation here:
http://www.gravityhelp.com/documentation/page/CSS_Targeting_Samples
If you're not sure where to put your CSS, you'll probably need to contact your theme provider for guidance. You should be able to append any new CSS rules to the end of the site.css file. Beyond that, you shouldn't need to re-upload the entire theme to your WordPress installation. Dreamweaver should let you make a normal FTP connection and then edit/upload individual files directly. If you're not sure how to do that, you'll probably do well searching google for a quick tutorial.
If you get stuck, you may consider contracting a developer to help you out. Here's a good place to start looking for someone if you need.
Posted 12 years ago on Thursday July 14, 2011 | Permalink -
Ok getting close.
Got everything aligned but the button looks like a rectangle. Any ideas how to fix that?
Link:
http://www.carolina-clean.com/bidPosted 12 years ago on Thursday July 14, 2011 | Permalink -
Yep, you've turned off the background image that was being applied to the submit element (see site.css line 1836)
You'll need to remove that rule, the set the border on the element to none. After that, you'll need to tweak the properties to define a height so the background image is positioned properly.
Looking at your background image, it appears that it's intended to be used as a "CSS sprite" with multiple states (active, focus, etc). That's not going to work quite the same with how the form is structured here. You can talk with your theme provider about alternate ways to style this, but the easiest thing is going to be for you to simply create a new button image and apply it in the form settings.
If you really need to use the original sprite "sliding doors" technique, then you can use this filter to change the form markup to accommodate that.
http://www.gravityhelp.com/documentation/page/Gform_submit_button
Posted 12 years ago on Thursday July 14, 2011 | Permalink -
Talked to the developer. He's working on the update now. Thanks for all the help guys.
Posted 12 years ago on Friday July 15, 2011 | Permalink -
Great Justin. We're happy we could help.
Posted 12 years ago on Friday July 15, 2011 | Permalink
This topic has been resolved and has been closed to new replies.