Skip to:
Content
Pages
Categories
Search
Top
Bottom

[Resolved] New buddypress css styling problem – BP Compatibility


  • benzine
    Participant

    @benzine

    Hi

    I just installed buddypress on my site and discovered the great possibilities if offers. However, I’m having a hard time to put in the the css together to make it fit my theme. Can anyone have a look and help me out to get rid of the horizontal scroll bottomline?

    The site is here http://tinyurl.com/9u9yjg5

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

  • @mercime
    Keymaster

    @mercime

    @benzine horizontal scroll is not a CSS issue alone. You need to complete step 3 of the BP compatibility process. When I click on member benz benz, there’s no horizontal scrollbar but the sidebar has dropped to below content area.

    Open up your theme’s header.php file, copy all code, paste code in pastebin.com, click submit and post the generated URL here. Do the same for your theme’s index.php, page.php, sidebar.php and footer.php files. Let’s see.


    benzine
    Participant

    @benzine

    Hey mercime, thank you so much for taking the time to have a look at my problem.

    Indeed, I completed all the steps prior to installing buddypress but still I’ve got css problems. Though, I manage to solve some of these, this one still persists (I also will have to work on the other broken pages though). So, here we go for the requested pages codes:

    1. Header.php -> http://pastebin.com/scmezbUj
    2. sidebar.php -> http://pastebin.com/ZyTj63gq
    3. page.php -> http://pastebin.com/muiYt3Gy
    4. index.php -> http://pastebin.com/h81KkPBM
    5. footer.php -> http://pastebin.com/1Mm813G9

    Thanks a million for your valuable help. I’m eager to learn how to solve these sort of issues :)


    @mercime
    Keymaster

    @mercime

    @benzine your page.php has `get_template_part( ‘loop’, ‘page’ )` so do post the code for loop-page.php in pastebin.com as well


    benzine
    Participant

    @benzine

    Ok, here we go again :)

    loop.php -> http://pastebin.com/hY4QRvdS
    loop-page.php -> http://pastebin.com/3e3KVhuh
    loop-single -> http://pastebin.com/awtQMxpZ

    I greatly appreciate your help man, and hope this can be solved asap.

    Peace xxx


    @mercime
    Keymaster

    @mercime

    @benzine You need to change 16 template files within the 6 BP folders transferred to your Paediatric theme folder in server during the compatibility process.

    If you’ve previously changed any of the BP template files in your Paediatric 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 the following:
    `

    <?php if (get_option_tree('blog_layout_sidebar', '')) { echo '

    ‘; } else {echo ‘

    ‘;} ?>
    <div id="post-” >

    `

    Then, in each of 16 files, delete the BP Templates’ Page titles where found (usually found in index.php files within BP Template folders) since the BP titles are generated automatically during the BP Installation Wizard and you don’t want duplicate titles in one page. Be careful with the activity/index.php file.

    Save files.


    @mercime
    Keymaster

    @mercime

    B. At the bottom of the same 16 files, replace:
    `

    `

    with the following (except for registration/register.php):
    `

    <?php if (get_option_tree('blog_layout_sidebar', '')) {} else {echo '

    ‘;}?>

    `

    with the following for registration/register.php:
    `

    <?php if (get_option_tree('blog_layout_sidebar', '')) {} else {echo '

    ‘;}?>

    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/Paediatric/

    D. Copy the style modifications made in BP Twenty Ten at https://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.

    Final note: not sure whether the options re sidebar locations will work in BP template files with your theme. Some themes have options that work, some themes not at all. Make the top and bottom revisions with /members/index.php to start and see how that works out first.


    benzine
    Participant

    @benzine

    MAN U ROCK HARD

    You’re a guru. I don’t know how to thank you for your help and precious time, I don’t doubt, you dedicated to fixing my problem. You sincerely deserve a standing applause for your effort. Thank you a million for your kind consideration, I really, sincerely appreciate it.

    Btw, if I want to get rid of the sidebar, other than modifying my css for sidebar{display:none;}, is there a way to exclude it from the code you compiled? SOrry, am merely a designer not a programmer. I also want to list the members like an album view sort like (in rows and columns – grid like). Can you also help?


    @mercime
    Keymaster

    @mercime

    @benzine You’re welcome.

    == if I want to get rid of the sidebar, other than modifying my css for sidebar ==

    Two parts in removing sidebar in templates where you want full-width

    A. Near top of file, remove the line
    `<?php if (get_option_tree('blog_layout_sidebar', '')) { echo '

    ‘; } else {echo ‘

    ‘;} ?>`
    and replace it with
    `

    `

    B. Near the bottom of the file, remove the line
    `<?php if (get_option_tree('blog_layout_sidebar', '')) {} else {echo '

    ‘;}?>`
    and replace it with
    `

    `

    == I also want to list the members like an album view sort like (in rows and columns – grid like) ==

    This is now beyond BuddyPress template compatibilty. I would suggest checking out the styles used in themes set up with grids like those listed at http://www.dessign.net/grid-style-theme/ or posting or assistance at https://wordpress.org/support/forum/how-to-and-troubleshooting or hire a developer at http://jobs.wordpress.net/

    Marking this topic as resolved.


    benzine
    Participant

    @benzine

    Thanks a bunch mate. You eased my life a lot…really appreciate.


    @mercime
    Keymaster

    @mercime

    Cheers.

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘[Resolved] New buddypress css styling problem – BP Compatibility’ is closed to new replies.
Skip to toolbar