-
AuthorPosts
-
November 18, 2015 at 7:37 pm #538506
Check out the attached screenshot from my Comments form (at the end of each blog post). This is viewed on a Mac, in the latest version of Chrome.
1. How can I change what fields show up, and which are required? Specifically, I’d like only Name and Website, and would like to control what’s required/optional.
2. Why the heck are the field labels aligned over on the right side? They should either be on top or left-aligned to the fields.
3. Notice the two checkboxes at the bottom. They’re not left-aligned properly, and the issue is even worse on mobile devices (the text isn’t even readable, because it overlaps itself.
- This topic was modified 9 years ago by Andy.
November 18, 2015 at 11:38 pm #538611Hey Bobby!
Here is a guide for some info, regarding the contact form:
https://premium.wpmudev.org/blog/customizing-wordpress-comment-form/let us know if that helps you out.
Best regards,
BasilisNovember 19, 2015 at 4:58 am #538703Sorry, no, that was a bit too technical for me. If there’s some CSS you can spoon-feed me that’ll 1) align those field labels properly and 2) align the two checkbox values at the bottom properly, I’d be really grateful.
Thanks!
November 21, 2015 at 3:59 am #540053Hey!
1.) Please add this in the functions.php file:
add_filter('comment_form_default_fields', 'comment_form_default_fields_mod', 10, 1); function comment_form_default_fields_mod($args) { $args['author'] = '<p class="comment-form-author"><label for="author">Name <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" aria-required="true" required="required" /></p>'; $args['email'] = '<p class="comment-form-email"><label for="email">Email</label> <input id="email" name="email" type="text" value="" size="30" aria-describedby="email-notes"/></p>'; $args['url'] = '<p class="comment-form-url"><label for="url">Website<span class="required">*</span></label> <input id="url" name="url" type="text" value="" size="30" aria-required=true" required="required" /></p>'; return $args; }
2.) That is the default style of the WP comment form. Add this in the Quick CSS field if you want to move the label above the field:
#commentform label { position: relative; left: auto; margin-bottom: 5px; }
3.) It doesn’t look that way on our installation. Please post the actual page with the form.
Cheers!
IsmaelNovember 21, 2015 at 5:05 am #540080Sure, that form is at: http://www.guitaranswerguy.com/dont-forget-to-wipe-your-strings (or any other blog post)
Your CSS did indeed move the field labels above the fields, but it affected #3 adversely. Now, the text is on the left and the checkboxes are on the right. So, a slightly different problem.
We’re getting closer though.
Thanks,
Bobby
November 25, 2015 at 3:25 pm #542460Hi!
so you want the checkbox to be on the left side? if yes use this code in Quick CSS field:
p.comment-subscription-form { display: flex; }
Best regards,
AndyNovember 27, 2015 at 6:31 pm #543768That did get them to the left, so we’re getting closer. Only remaining issue is the vertical alignment. You can see them here at the end of this post:
http://www.guitaranswerguy.com/dont-forget-to-wipe-your-strings/
November 30, 2015 at 5:21 pm #544628Hi!
try to add this code as well:
input#subscribe_comments, input#subscribe_blog { position: relative; top: 7px; }
and adjust as needed. Hope this will work for you!
Regards,
AndyDecember 4, 2015 at 9:43 pm #547279Okay, everything looks good now. Thanks!
December 5, 2015 at 9:02 am #547391 -
AuthorPosts
- The topic ‘Blog Comments Form – Want to change fields. Also,a CSS issues…’ is closed to new replies.