BuddyPress

Hello,

I would like to offer the possibility to the user to choose a specific css file (color theme) for their member page and upload an image in the background.

Does anyone know how to do it ?
How hard would it be if I wanted to write a plugin to do it ? Where can I learn ?

Thanks you for your help.

Best regards,

Re plugin – you might want to look at how BP Group CSS plugin is done – http://wordpress.org/extend/plugins/buddypress-group-css/ where CSS can be set by group

Re pure CSS manipulation – filter body class to add e.g. username to body class so you can manipulate layout, colors, fonts, etc. in individual member pages

Thanks @mercime, is it easily modifiable for someone who never wrote a plug-in ?
With some modification the user will have the possibility to personalize their member page ?

@johnwinch42 No, it is not easily modifiable if you’ve not written a plugin, but if you have PHP experience, give it a shot. And for pure CSS manipulation via body class filters, you as Super Admin would have to add individual member CSS in style.css – that’ll be a lot.

@mercime Where can I learn how to write a plug-in ?

I just want this two option :
- the user select a theme color in his option for his member page
- he can upload an image for the background of his member page and his activity (/members/themembertest/activity/76)

@johnwinch42 those are definitely cool options but no plugin has been released for those functions yet.
Check out http://codex.buddypress.org/extending-buddypress/creating-a-custom-buddypress-component/ – Unfortunately the BP Skeleton Component has not been upgraded since Feb 2010 – ping! @djpaul ping! @boonebgorges

You can use xprofile fields to specify certain CSS values in the users profile. Then you can retrieve the field value in the profile and modify the profile CSS with jquery. Its a bit of a work around but it works for me. Here’s an example:

1. Create an xprofile field and name it ‘Profile Background’
2. Edit your profile in buddypress and insert ‘#000000′
3. Go to wp-content/themes/yourtheme/members/single/member-header.php
4. On the 2nd line, just after <?php do_action( 'bp_before_member_header' ) ?> paste the following code:

<script>
$("#wrapper").css("background-color", "<?php bp_profile_field_data( 'field=Profile Background' ); ?>");
</script>

This will modify the profile background color according to what ever value you put in ‘Profile Background’

This is just off the top of my head, I’ll check how I’ve done it once I’m home this evening. I will be writing a plugin for this. The only drawback is the user needs javascript enabled other wise its pointless.

Is there any progress on this? I’d love to have this on my website