Skip to:
Content
Pages
Categories
Search
Top
Bottom

Converting Buddypress 1.8 to Bootstrap

  • Avatar of jtm21
    jtm21
    Participant

    @jtm21

    Hi guys

    I’m in the process of writing the spec for a new project that will be using Buddypress 1.8.

    I have a WordPress starter theme of my own, built with Bootstrap 3.0 (RC1 right now), upon which the whole site will be built.

    We’d like to integrate BP 1.8 into the new site, however instead of writing a bunch of CSS to make the BP pages look like the rest of the site, I’d like to change the layout files of BuddyPress to use Bootstrap’s HTML syntax therefore inheriting the styles and layouts of the whole theme automatically.

    My question is, how to best approach this:

    1 – Should I copy all the files from /bp-templates/bp-legacy/buddypress into my own theme’s /themeroot/buddypress and modify from there?

    2 – Should I override only the files I need, by copying them into my theme and obeying the theme hirearchy?

    3 – Is there a better way?

    Thanks very much in advance for any help or tips!

Viewing 11 replies - 1 through 11 (of 11 total)
  • Avatar of r-a-y
    r-a-y
    Moderator

    @r-a-y

    I would follow #2 – Only override the template files that you need.

    Keep in mind that the markup in the template files are quite specific to the JS. So that’s something that you’ll have to consider when changing the markup.

    Avatar of @mercime
    @mercime
    Keymaster

    @mercime

    @jtm21 check out how unsal did it this WP theme compatible with BP and built on Bootstrap http://wordpress.org/themes/firmasite

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    We ran through an exercise in unbinding many of the jQuery selectors from elements so that scripting was tied to classes rather than specific markup structure to allow for re-factoring of markup, so you ought to be able to structure markup as you wish but just pay close attention to IDs & Classes which must be preserved.

    Avatar of jtm21
    jtm21
    Participant

    @jtm21

    Thanks guys!

    @Hugo so in theory if I remove the default CSS stylesheets that come bundled with BP (no idea how right now) and re-write the markup in Bootstrap it should work?

    Also, I have a feeling I am following the wrong template hierarchy – are the /groups /activity etc folders created directly in the theme root?

    Thanks again all

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    @jtm21
    Yes essentially that would be fine, bearing in mind you might lose or have to account for any styles that were in place to deal with js frills.

    Generally now you can or should be using BP in theme compat mode as it offers more options now as well as ability to keep templates and assets neatly under /buddypress/ or /community/ adding directories directly to you theme root will invoke the older approach, and although still valid, less of a attraction now the theme compat templates can be customized for components, actions, user_ids etc.

    Check the functions.php in the bp-legacy template folders as that will show you the class used for setting up a theme and it’s assets.

    Avatar of jtm21
    jtm21
    Participant

    @jtm21

    ok thanks – what I did while testing was copy everything from /bp-legacy into [root]/buddypress and it worked fine.

    if i understand correctly what i need to do is simply add files into /buddypress/groups etc, and copy them from the bp-default theme in the plugin directory.

    Thanks a lot for the help

    Avatar of jtm21
    jtm21
    Participant

    @jtm21

    Also, could I take the Buddypress views from the Firmasite theme, update them to Bootstrap 3 and implement them in my theme? Do you think this would work?

    http://wordpress.org/themes/firmasite

    Of course I would be more than happy to share the outcome of my work back with you all.

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    No don’t mix files/templates from bp-default into your child /buddypress/, theme conpat templates and older bp-default templates have different structures. The point about theme compatibility is that the templates are template parts not full templates in their own right and inject their content into the WP function the_content() if you examine one you will note it has no header or footer calls.

    Not sure what your asking re that theme but it’s suggestive of copying work?? and as such I’ll make no comment, however why not simply use that theme as it’s already built on boostrap and create a child theme as you need.

    Avatar of jtm21
    jtm21
    Participant

    @jtm21

    Hi Hugo, thanks for the info on templates, I will research further.

    I was under the impression the theme would be open source and as a result I would make a derivative work and provide credit where due – of course I will investigate this fully. Although it appears to be a direct derivative of the BP theme itself.

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    I was under the impression the theme would be open source and as a result I would make a derivative work and provide credit where due – of course I will investigate this fully. Although it appears to be a direct derivative of the BP theme itself.

    Not sure what theme you are referring to but not getting into debate over GPL while essentially it preserves the right to copy and forces derivative works to carry the same licence on those parts that are derivatives, nothing is ever that clear cut. Personally I am in two minds over the veracity of the GPL

    Avatar of jtm21
    jtm21
    Participant

    @jtm21

    Agreed – don’t worry, I feel the same about it all :)

    For reference I was referring to http://wordpress.org/themes/firmasite

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

You must be logged in to reply to this topic.