Search code examples
wordpressbbpress

How can I show bbpress Super Sticky or Sticky posts above the forum posts?


I would like to be able to show Super Sticky or Sticky posts above the forum posts. In other words. I'll have posts on the page and the super/sticky posts will be there. However, above the lists of the posts, I would like to have the super/sticky posts there as well. Sort of like a "Featured Discussions" type section.


Solution

  • So I ended up doing this to solve my issue. I added a div above the table that holds the topics and then did me up some jquery as follows:

    var rows = $('table.bbp-topics').find('tr.super-sticky');
    
            rows.each(function(index) {
                var headhref = $('a.bbp-topic-permalink', this).attr('href');
                var headline = $('a.bbp-topic-permalink', this).html();
                var excerpt = $('.excerpt', this).text();
                var author = $('a.bbp-author-name', this).html();
                var photo = $('a.bbp-author-avatar > img', this).attr('src');
                var replies = $('.bbp-topic-voice-count', this).text();
                var followers = $('.bbp-topic-reply-count', this).text();
                var freshness = $('.bbp-topic-freshness > a', this).html();
                var meta = $('p.bbp-topic-meta', this).text();
    
    
                var newrow = '<div class="featured-row"><div class="topic-meta">' +
                    '<img class="author-photo" src ="' + photo + '">' +
                    '<div class="author">' + author +'</div> ' +
                    '<div class="topic-title"><a href="' + headhref + '">' + headline + '<a/></div>' +
                    '<div class="excerpt">' + excerpt + '</div></div>' +
                    '<div class="replies"><h3>Replies</h3><hr/><p>' + replies + '</p></div> ' +
                    '<div class="followers"><h3>Followers</h3><hr/><p>' + followers + '</p></div> ' +
                    '<div class="freshness"><h3>Updated</h3><hr/><p>' + freshness + '</p></div> ' +
                    ' </div>';
    
                console.log(newrow);
    
                $('#supersticky').fadeIn().append(newrow)
    
            })
    

    Hopefully this helps someone else.