MyBB Community Forums

After spending many hours searching for an easy way to include a bbcode break for Announcement postings on the portal, I have found one that works really well.

The utilizes jquery. I have attached the files that I modified for my website. The originals can be found, here. The original version included "..." and cut off 100 characters after the break point. I removed the "..." and set the cut off at 0 characters.

1. Download these files and place them on your server. Mine are at /jscripts.

2. Modify Template -> Portal Templates -> Portal
Add the following code underneath {$headerinclude}

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
<script src="jscripts/jquery.expander.js"></script>
<script src="jscripts/jquery.expander.min.js"></script>

<script>
$(document).ready(function() {
  var opts = {collapseTimer: 4000};

  $.each(['beforeExpand', 'afterExpand', 'onCollapse'], function(i, callback) {
    opts[callback] = function(byUser) {
      var by, msg = '<div class="success">' + callback;

      if (callback == 'onCollapse') {
        msg += ' (' + (byUser ? 'user' : 'timer') + ')';
      }
      msg += '</div>';

      $(this).parent().parent().append(msg)
    }
  });

  $('dl.expander dd').eq(0).expander();
  $('dl.expander dd').slice(1).expander(opts);


  $('ul.expander li').expander({
    slicePoint: 0,
    widow: 2,
    expandSpeed: 0,
    userCollapseText: '[^]'
  });

  $('div.expander').expander();
});

</script>

3. Create bbcode
Go to Configuration -> MyCode -> Add New MyCode

Regular Expression:

\[readmore\](.*?)\[/readmore\]

Replacement Text:

<div class="expander">$1</div>

Now anything within the readmore tags will be hidden behind a readmore link on the portal page. Also, by only adding the scripts to the Portal page, your announcement thread will still look like normal.

I see a few downloads of this. Have others found this tutorial useful?

Thanks buddy perfect working for me

Is there a way to make this simply link to the post itself, and not expand it?

I'm trying to use this as a solution to post excerpts on the Portal's Announcements posts.

I understand that there are Announcement Cutoff plugins, but those are all set to cut off after X characters or words; looking to utilize a tag to generate the Read More link.

Very awesome tutorial.

(2013-07-31, 06:55 PM)heydevo Wrote: [ -> ]Is there a way to make this simply link to the post itself, and not expand it?

I'm trying to use this as a solution to post excerpts on the Portal's Announcements posts.

I understand that there are Announcement Cutoff plugins, but those are all set to cut off after X characters or words; looking to utilize a tag to generate the Read More link.

I was originally looking for something similar to what you are asking, and tried a couple plugins also. Plugins I tried also would mess up bbcode also. As it cut it off at certain characters, it wouldn't have the end code bracket, so it would show the first bracket on the news posting.

I spent several days trying to find what you had described, and found many requests across several different sites, and most had the same conclusion.

After not being able to find what I was looking for with those, led me to doing this.

After I figured this out, I wanted to let everyone know of a work around so that news postings could still be condensed on the home page, but still look correct in the actual thread.

Still usefull! Thanks!