Skip to:
Content
Pages
Categories
Search
Top
Bottom

Customising Registration Form


  • jamescushing
    Participant

    @jamescushing

    Hi all,

    I’m trying to customise the registration form using css classes (to work with a framework I’m using) – I was able to use the ‘bp_xprofile_field_edit_html_elements’ action to add some, but this only seems to apply to text inputs.

    How can I achieve the same for other fields such as selects and checkboxes? Ideally I’d like one hook in which I can customise the form completely… is this possible?

    If not, how easy would it be to create my own form entirely and post to the registration script as BP does?

Viewing 12 replies - 1 through 12 (of 12 total)

  • jamescushing
    Participant

    @jamescushing

    Bump


    jamescushing
    Participant

    @jamescushing

    Bump… how hard can this be, really? or at least a “no” of some kind so I’m not stuck waiting…


    Venutius
    Moderator

    @venutius

    Pretty sure this has gone over my head in that I don’t understand the issue, whenever I add an xProfile field to the registration form BP automatically adds a css class I can use for styling, are you not getting that?


    jamescushing
    Participant

    @jamescushing

    @venutius Thanks for replying

    I’m using a css framework as mentioned above, which uses its own preset CSS classes (e.g “form-control”) to standardise appearence. It’s classes I’m trying to add, not CSS for existing classes

    Thanks


    Venutius
    Moderator

    @venutius

    My only suggestion is that you can overload the registration page, this gives you access to the css for the username,password and email input fields, have you looked into that?


    jamescushing
    Participant

    @jamescushing

    Yeah I know about that, thanks though. What about all the xprofile fields?


    jamescushing
    Participant

    @jamescushing

    @venutius Any idea on this?


    Venutius
    Moderator

    @venutius

    The issue is that the bp template ages run functions that auto-format the output. what you’d have to do is overload the registration page then rewrite it using the bp base functions rather than the helper functions, that way you’d get to specify your own css. But I’m not the expert here, still learning bp, there probably will be other ways.


    jamescushing
    Participant

    @jamescushing

    @venutius I see what you mean now. I’m currently looking into the xprofile field object’s edit_field_html method and passing params into that. I’ll update here if and when I find a suitable solution


    Venutius
    Moderator

    @venutius

    That would be useful, modding the registration form is definitely on my list.

    One thing to look at is BP Better Registration, this is effectively a plugin overload of the whole registration process, you could probably use that as a basis for your own registration mods.


    jamescushing
    Participant

    @jamescushing

    I posted a solution here a couple mins ago but it got deleted when I edited it… odd…

    Anyway, sorry @venutius I only just logged in to see your reply – I came up with the rather-inelegant solution of using XPath in the end:

    
    $field_type = bp_xprofile_create_field_type( bp_get_the_profile_field_type() );
    
    if( bp_get_the_profile_field_type() == 'checkbox' ){
    
    	// Buffer output for modifying checkboxes
    	ob_start();
    
    		// Generate the field's html
    		$field_type->edit_field_html();
    
    		// Store the html
    		$field_html = ob_get_contents();
    
    	ob_end_clean();
    
    	$dom = new DOMDocument;
    	$dom->loadHTML( $field_html );
    
    	$div = $dom->createElement( 'div' );
    	$div->setAttribute( 'class', 'col-xs-6 col-sm-4 checkbox' );
    
    	$xpath = new DOMXPath( $dom );
    	$labels = $xpath->query( "//label[contains(@class, 'option-label')]" );
    
    	foreach( $labels as $label ){
    
    		$div_clone = $div->cloneNode();
    
    		$label->parentNode->replaceChild( $div_clone, $label );
    	
    		$div_clone->appendChild( $label );
    
    	}
    
    	echo $dom->saveHTML();
    
    }else{
    
    	// Generate the field's html
    	$field_type->edit_field_html(array(
    		'class' => 'form-control'
    	));
    
    }
    

    jamescushing
    Participant

    @jamescushing

    The above also works for the profile edit screen

    (Sorry for the double-post but I assume editing the original would have deleted it again somehow…)

Viewing 12 replies - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.
Skip to toolbar