Based on the HTML structure of your theme, you need to use the first option, i.e., change 16 template files within the 6 BP folders transferred to your wp-chatter theme folder in server during the compatibility process.
If you’ve previously changed any of the BP template files in your theme folder in server, replace all of them for a clean slate by deleting the 6 BP folders – /activity, /blogs, /forums, /groups, /members, and /registration – then re-run Appearance > BP Compatibility.
Download the 6 clean BP folders to your computer hard drive.
A. At the top of each of those 16 template files I linked to above, replace
`
`
with
`
<div class="post clearfix maincontent" style="margin:0;" id="post-”>
`
Then, in each of 16 files, you’d like to change the BP Templates’ page title’s header tag from `
…
` or `
..
` to `
// Titles Of Respective BP Page Templates //
`, just watch out when you do this in the /activity/index.php page.
Save files.
B. At the bottom of the same 16 files, replace:
`
`
with the following (except for registration/register.php):
`
`
with the following for registration/register.php:
`
jQuery(document).ready( function() {
if ( jQuery(‘div#blog-details’).length && !jQuery(‘div#blog-details’).hasClass(‘show’) )
jQuery(‘div#blog-details’).toggle();
jQuery( ‘input#signup_with_blog’ ).click( function() {
jQuery(‘div#blog-details’).fadeOut().toggle();
});
});
`
Save files.
C. Upload the 6 BP folders containing the 16 files you’ve just revised to your server wp-content/themes/wp-chatter/
D. Copy the style modifications made in BP Twenty Ten at http://codex.buddypress.org/theme-development/theme-dev-bp-template-pack-walkthrough-twenty-ten-bp-1-5/3/ and paste to your theme’s stylesheet. Adjust to taste.
Thank you very much for this! Works brilliantly!
There is only a few minor style tweaks to be made and i am trying to get them to “stick”. I have changed the theme’s stylesheet and added the style modifications made in BP Twenty Ten that you referred. Unfortunately they don’t seem to work. 
You can check what i mean here – http://www.comicbooktherapy.com/members/wolverinept/
Or here – http://www.comicbooktherapy.com/members
This is the wp-Chatter stle.css – http://tinypaste.com/e0a293b7
This is the same with the referred changes – http://tinypaste.com/4cc2c1c5
Thanks in advance for an input on this!
What I see first is that your site’s two-column layout (on BP and non-BP pages) has some spacing issue compared with the two column layout of the wp-chatter theme demo (edit uri) http://wp-chatter.solostreamsites.com/2009/06/how-to-install-and-set-up-wp-smooth/ I think there should either be a page template or theme option that sets page layout to two columns as seen in demo.
The Twenty Ten style mods are basic changes to that theme and you’d have to adjust styles for your specific theme. Firebug, a Firefox add-on, can help you ID which selector you need to add/change styling. For example, your theme has background images for the UL’s which the Twenty Ten theme doesn’t have. So in your case, you’d need to delete those bg imgs for the list items like so:
`ul.item-list li { background: transparent none; }`
