Skip to:
Content
Pages
Categories
Search
Top
Bottom

how to have comment and replies collapse and expand.

  • @aliceembroid

    Participant

    I have buddypress with just one activity stream, I want to have it so that replies will be collapsed until a user clicks on it to read the threads. Can someone help me please?
    My page is very long and hard for people to find the comments they want to read.
    http://eembroiderydesigns.com/social/

Viewing 25 replies - 1 through 25 (of 71 total)
  • @aliceembroid

    Participant

    Does anyone have an answer?

    @timothyjunior

    Participant

    give me about an hour and i can get this working for you

    @timothyjunior

    Participant

    ok, break out notepad++ or any text editor and make back ups these two files:
    – /wp-content/plugins/buddypress/bp-themes/bp-default/activity/entry.php
    -/wp-content/plugins/buddypress/bp-themes/bp-default/header.php

    add this to your header.php file within the head section :
    `

    `

    now locate entry.php and replace : `

    `
    with this code :
    `

    $(document).ready(function(){

    $(“li#activity- div.activity-comments ul”).hide();

    $(“li#activity- a.acomment-reply”).click(function(){
    if ( $(“p.collapse-“).css(“display”) == ‘none’ ){

    $(“p.expand-, p.collapse-, li#activity- div.activity-comments ul”).toggle(100);

    }
    return true;
    });

    $(“p.expand- a”).click(function(){

    $(“p.expand-, p.collapse-, li#activity- div.activity-comments ul”).toggle(100);
    return false;

    });

    $(“p.collapse- a”).click(function(){

    $(“p.expand-, p.collapse-, li#activity- div.activity-comments ul”).toggle(100);
    return false;

    });

    $(“li#activity- input[name=ac_form_submit]”).click(function(){

    if ( $(“p.collapse-“).css(“display”) == ‘none’ ){

    $(“p.expand-, p.collapse-, li#activity- div.activity-comments ul”).toggle(100);

    }
    return true;
    });

    });

    `

    heres a little css to work with:
    `.expandable {
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    background: none repeat scroll 0 0 #F4F6F8;
    border: 1px solid #EEEEEE;
    margin-bottom: 2px;
    text-align: center;
    text-shadow: 1px 1px 1px #FFFFFF;
    }

    .expandable p {
    margin: 0px;
    }`

    remember to always back up your files, hopefully someone makes a plugin with this functionality so we can stop messing with the core of buddypress.

    *Can’t believe that took me 5 hours lol

    @janismo

    Participant

    hi @timothyjunior nice update, definitely will try.
    messing with core files isn’t smth terrible, all you should have is child theme of bp-default.

    @timothyjunior

    Participant

    thanks @janismo, and you’re correct. If you have a child theme then it would be best to post to those files.
    I forgot about child themes when i took on this test. definitely something i should remember.

    @aliceembroid

    Participant

    Oh boy thank you so much, I had not checked back because I had lost hope that anyone would answer me. I am off to try it now. Thank you thank you thank you.

    @aliceembroid

    Participant

    That worked! you are a genius, the exception is that it does not collapse the comments on photos or newly registered members. But I guess that is a problem for another day. Thank you so much. check it out.
    http://eembroiderydesigns.com/social/

    @aliceembroid

    Participant

    Timothy, thank you so much, it is perfect now. I did not add the css. I was not sure where to add it. but I am so happy with how it is all working now.
    Alice.

    @el_terko

    Participant

    Nice, very nice, thanx @timothyjunior and @aliceembroid for sharing this.
    Now, how would I add a comments count field ? I mean, showing the comments count if there are any comments or showing nothing if there are not. Am I clear enough ?

    @timothyjunior

    Participant

    Glad its working now alice, and i think the css isn’t needed, but if you want to test it -> wp-content-> themes -> bp-columns ->custom.css
    What i usually do is scroll down to the very bottom and type this
    `/* Custom Modifications */`
    then my css code, to keep it separate from the default css

    where would you like to show the comments? Buddypress does this by default for logged in user via the reply link : reply(#comments).

    @el_terko

    Participant

    I can see on @aliceembroid site that it shows as “show comments”. I would like to have a comments count as “show comments (x)” being x the total number of comments.
    So each visitor can know at a first glance if that activty has any comments or not before pressing “show comments”

    @timothyjunior

    Participant

    that jquery code i supplied allows a “show comments” option only if the activity has comments, if the activity does not have comments it will show nothing.

    but i understand what you are saying, just replace:
    `Show Comments`
    with this:
    `Show Comments ()`

    @aliceembroid

    Participant

    josemv you can see how many comments are there if you look at the reply button the yellow one on my site.
    Alice.

    @janismo

    Participant

    hi again @timothyjunior ,

    – in your updated code for header.php you have typing mistake on the end of the 2nd line (closing script tag)
    – comments/replies of all the activities that go after load more button is pressed are already revealed/expanded and cannot be hidden. Is here any quick fix, or this is exactly what you wanted to achieve?

    thanks!

    @timothyjunior

    Participant

    Hi @janismo , the typing mistake you mentioned was done by buddpress. because i did not include a space between the opening and closing tag it defaulted to a greater than entity, which is odd.
    *edited
    It’s still using an html entity at end of the script tag, i guess because there is a url within the script.

    Thank you for calling the load more button to my attention, I will have to add another jquery action if it is clicked upon, but It might be tomorrow because its easter sunday.

    @aliceembroid

    Participant

    Thanks James I had not noticed that.
    Timothy, I am not sure what is happening to your code you have
    ` `
    in the second line. with a colon after the url.
    I have
    `<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"&gt&quot; `
    with quotations at the end of the url. It works with quotes it won’t work with the colon.
    have a great Easter. (it is already Monday here down under)
    Alice.

    @aliceembroid

    Participant

    I see what is happening to your code. buddypress is changing it. How stranges.

    @timothyjunior

    Participant

    Yea, that’s what i mention before it has something to do with buddypress.
    Ok well most of the easter stuff has passed, so ill try to work on a fix asap.

    and thanks alice.

    @aliceembroid

    Participant

    Timothy you are a star.

    @timothyjunior

    Participant

    well, i had it working… then i went to pick up some food, and my computer died.. i broke my own rule. Save your files……

    I’ll have it working sometime tomorrow after i rewrite the code, sorry for the delay

    @aliceembroid

    Participant

    No need to apologise Timothy, I very much appreciate your help.
    Alice.

    @timothyjunior

    Participant

    ok alice did you back up your header.php and entry.php files? Before i replace the old code i would like for you to undo all the changes. If you need any help just let me know.

    @aliceembroid

    Participant

    Ok Timothy I have undone all of the changes.
    Alice

    @timothyjunior

    Participant

    Ok I added the new code, let me know if it’s working properly .

    @aliceembroid

    Participant

    Thanks Timothy that is perfect. If you are ever in South East Queesnland I will shout you a beer.(if you drink beer).

Viewing 25 replies - 1 through 25 (of 71 total)
  • The topic ‘how to have comment and replies collapse and expand.’ is closed to new replies.
Skip to toolbar