Hi @mmadden,
not sure i understand what you want to achieve. Are you creating a register page from scratch ?
Anyway….
Open the original BP register file (/buddypress/bp-templates/bp-legacy/buddypress/members/register.php). It contains many placeholders and conditionnals
So, for the mandatory NAME xprofile group (the only one you use), you have line 65
if ( bp_is_active( 'xprofile' ) ) : if ( bp_has_profile( array( 'profile_group_id' => 1, 'fetch_field_data' => false ) ) ) : while ( bp_profile_groups() ) : bp_the_profile_group();
--- blah---
Line 75 sit this placeholder do_action( 'bp_custom_profile_edit_fields_pre_visibility' ); where you can hook your additionnal information.
Line 98 there’s another one: do_action( 'bp_custom_profile_edit_fields' ); just above this function:
<p class="description"><?php bp_the_profile_field_description(); ?></p>
In register.php, the section you speak about goes from line 50 to 112
From /***** Extra Profile Details ******/ to </div><!-- #profile-details-section -->
Of course, you can also add your own placeholder to your register template.
Sorry if i’m wrong.
Thanks for your reply! I’m not sure I explained myself very well… When I refer to “placeholder”, I mean the text that is already in the input field when the page loads. This will be a responsive them and the end goal here is to save as much space as possible on the registration form by removing the labels altogether. I need to be able to output some default text into the field that will then disappear when the user begins typing in that field.
Do you mean such kind of text ?
Name (required)
--------------------------
| |
--------------------------
This field can be seen by: Everyone
That’s the right area, but no… I mean doing something like this:
<input type="text" placeholder="<?php _e('Username', 'buddypress'); ?> <?php _e( '(required)', 'buddypress' ); ?>" name="signup_username" id="signup_username" value="<?php bp_signup_username_value(); ?>" />
Instead of something like this:
<label for="signup_username"><?php _e( 'Username', 'buddypress' ); ?> <?php _e( '(required)', 'buddypress' ); ?></label>
…only for the profile field.
This is actually hardcoded in the register.php, so i would be very simple to modify i guess.
Make a copy of the original file
/buddypress/bp-templates/bp-legacy/buddypress/members/register.php
Add it to your child theme
/your_child_theme/buddypress/members/register.php
Change the HTML to your need.
Theme Compatibility & Template Files
>removing the labels altogether.
Please don’t remove labels altogether, responsive design does not mean writing malformed markup contrary to the specifications, nor for that matter do the new html5 atts. placeholder text is nice but does not replace the proper use of label/control pairs.
http://www.w3.org/TR/html5/forms.html#the-placeholder-attribute
>The placeholder attribute should not be used as a replacement for a label. For a longer hint or other advisory text, place the text next to the control.
WP has a convention for hiding label text using a class something like ‘screen-reader-text’ or ‘assistive-text’ can’t recall which and adding a ruleset to position the label element off screen(not! displayed none).
As for adding html5 atts to the additional profile field elements the only way will be if they have a filter, but think this is going to be tricky to implement.
Yes, I’ve already edited the input fields within the basic-details-section div. I want to edit the input field in the profile-details-section div to match, but there is no input field in the register.php for that section. Instead there’s this:
<div class="register-section" id="profile-details-section">
<h4><?php _e( 'Profile Details', 'buddypress' ); ?></h4>
<?php /* Use the profile field loop to render input fields for the 'base' profile field group */ ?>
<?php if ( bp_is_active( 'xprofile' ) ) : if ( bp_has_profile( array( 'profile_group_id' => 1, 'fetch_field_data' => false ) ) ) : while ( bp_profile_groups() ) : bp_the_profile_group(); ?>
Is there any way to get at the input tag that gets output to the profile-details-section?
That makes sense Hugo. I’ll look for a javascript/css solution. Support is pretty good for the placeholder attribute already though. I’d be willing to accept what I might lose. It would be nice to have the choice in all input fields.
Certainly using JS is probably the easiest/sensible option here, if you know your controls should be simple enough to add the placeholder attr to them.
While attempting another solution, I found a new problem. I got rid of the placeholder attribute and went back to using the label as you suggested. I positioned the label beneath the input and gave the input a transparent background. I was using the :focus and :valid states to hide and re-position the labels and inputs as needed. This worked fine on the inputs in the basic-details-section div, but the input in the profile-details-section doesn’t seem to be responding to the :focus or :valid states. I can apply regular styles, but nothing more. Can you think of any reason why that may be?
