Skip to:

Easy change of activity-design

  • nickrita


    The design of the acitivty-stream should be changegable easily.

    Expecially the font-size and color of the Link to a Post.

Viewing 9 replies - 1 through 9 (of 9 total)
  • I love these posts. So random. Build a child theme and change it to whatever your heart desires:



    I’m no css expert, but I thought the activity stream was really really really easy to modify.. you only need to tweak a few classes/id’s to get it to look quite a bit different.. So I can’t imagine an easier way to do it tbh



    I have to investigate further but I’d really want to style it so odd and even activities lines look lightly different. To improve readibility.



    Andy, I built a child-theme but I don’t find in the default.css which line is to change to edit the Link to the post.

    Bowe: If it is so really really really easy (I thoght this, too) then please tell me which line is to change to edit the Link to the post.

    D Cartwright


    Install firebug, right click on an activity item and click inspect. On the right is the css file and line number you need to look at.



    @ nickrita: I don’t believe all urls have a seperate class, although there might not even be one url with a special class.



    @ Xevo, thank you very much, you made my day! The Urls have no special classes. I solved my problem by adding one and put it behind this line .activity-list .activity-content a:first-child:focus { outline: none; }:

    .activity-list .activity-header a {

    background: #fff;

    color: #081831;

    font-family:Georgia,”Times New Roman”,Times,serif;




    The result can be seen on, which is my test-site for

    I had to change the code for the first-child, too, in order not to let it take the css from above:

    .activity-header a:first-child, span.highlight {

    background: #ececec;

    border-bottom: 1px solid #e4e3e3;

    border-right: 1px solid #e4e3e3;

    color: #777;

    font-size: 10px;

    font-family: Arial, Tahoma, Verdana, sans-serif;

    padding: 3px 8px;

    text-decoration: none;

    -moz-border-radius: 4px;

    -webkit-border-radius: 4px;

    border-radius: 4px;

    margin-right: 3px;


    I hope this will help everybody with the same problem as I had.

    Mike Pratt


    but @Andy, I hate reading the instructions ;-)


    You could achieve zebra striping of the activity-stream LI elements using this approach (tested as working but I would defer to the more experienced as to whether it’s a valid or best)

    In file bp-themes/bp-default/activity/activity-loop.php

    add line ‘<?php $class = ‘even’; ?>’ above line 20 ‘<?php while ( bp_activities() ) : bp_the_activity(); ?>’

    Immediately below the while loop on line 20 add:

    ‘<?php $class = ($class == ‘even’) ? ‘odd’ : ‘even’; ?>’

    To print out the odd or even classes go to the file:


    And add :

    ‘<?php print $class; ?>’ to line 5 so it looks like:

    ‘<li class=”<?php bp_activity_css_class() ?> <?php print $class; ?>” ‘

    You can then style the classes ‘odd’ and ‘even’ as you wish.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Easy change of activity-design’ is closed to new replies.
Skip to toolbar