- This topic is empty.
-
AuthorPosts
-
April 14, 2015 at 6:00 pm #200468
Rambo
ParticipantI’ve added some CSS to my theme’s main style.css style sheet as recommended by the plugin’s developer but AJAX isn’t working and the form is a mess except for the ‘Send’ button. The form should send a message and run without refreshing like it does.
.wpcf7-form .contact-form-left { width: 345px; float: left; } .wpcf7-form .contact-form-right { width: 516px; float: right; } .wpcf7-form p { color: #555555; } .wpcf7-form input.wpcf7-form-control { margin: 6px 0 24px 0; padding: 6px 12px; color: #666666; background: #f2f2f2; border: 1px solid #d9d9d9; border-radius: 6px; float: left; width: 320px; height: 32px; } .wpcf7-form textarea.wpcf7-textarea { height: 200px; margin: 6px 0 24px 0; padding: 3px 12px; color: #666666; background: #f2f2f2; border: 1px solid #d9d9d9; border-radius: 6px; } .wpcf7-form input.wpcf7-submit { width: 120px; height: auto; background: #5064f2; border: none; color: white; border-radius: 6px; text-shadow: none; box-shadow: none; font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 120%; padding: 12px 32px 14px 32px; -webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; position: relative; top: 0; } .wpcf7-form input.wpcf7-submit:hover { top: -2px; color: white; background: #343434; }
April 14, 2015 at 9:28 pm #200480Rambo
Participantwould also be nice if we can add a cool blue glow around the text fields just like with Twitter Bootstrap, but i’ll take whatever you guys provide and I really appreciate all your help. thanks i mean it!
free cookies for everyone :P
April 15, 2015 at 1:30 am #200486Paulie_D
MemberSo what’s the actual question?
but AJAX isn’t working and the form is a mess except for the ‘Send’ button.
AJAX or something else?
I can see that you are using
<br>
for spacing which never a good idea. That’s what margins & padding are for as well as the usual layout methods.Also, rather than paragraphs tags you should be using
<label>
sPerhaps you could make a Codepen of this form rather than force us to use Developer Tools to inspect the site.
April 15, 2015 at 9:39 am #200515Rambo
ParticipantThe issue is AJAX isn’t working for some reason, the page will reload when it shouldn’t. The other is the styling, I tried to style the form but looks like the button was all it did style.
April 15, 2015 at 10:45 am #200521Paulie_D
MemberFor the styling
Perhaps you could make a Codepen of this form rather than force us to use Developer Tools to inspect the site.
but you should fix the HTML & layout issues I mentioned first.
Take out all the
br
tags and use proper layout methods.April 15, 2015 at 10:52 am #200523Rambo
ParticipantGood idea! I don’t want to add the Bootstrap CSS just to get the fields to glow blue, if anyone can tell me what I should do to get the fields organized. Again, thanks for all of everyone’s help.
April 15, 2015 at 12:07 pm #200529Rambo
ParticipantPlease someone can tell me how to clean up the fields and add that cool bootstrap like glow to all the fields.
April 15, 2015 at 1:57 pm #200534Paulie_D
MemberIf you don’t want to add the Bootstrap CSS to get their styles
Just download a custom build of just the parts you do want.
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.