MyBB Community Forums

Intro

Thread Tools is Mybb template modification that adds set of thread tools under post list in showthread.Thread tools are divied into four categories:
a)Thread info (basic info about thread)

thread title
Author
Number of replies
Views
Last poster

b)Thread Tools

Link to printable version
Send thread
Subscribe/ unsubscribe link
New post link
Threaded or linear view mode

c)Thread Sharing (seven links and more options link divied into two blocks)

Facebook
Twitter
Google
Reddit
Digg
Linkedin
Stumbleupon

d)Thread links

Thread url - plain link
Thread BBcode link for forums

Installation

Unzip the content of thread_tools.zip file (included as attachment in first post) and copy image folder in your forum root (If You are asked to overwrite existing files / folder with another one then click yes).
Open the showthread.css that is used by your current forum theme (ACP -> Templates & Style -> Themes -> <your theme> -> showthread.css / Edit Stylesheet: Advanced Mode and replace all content inside with following one


ul.thread_tools, ul.thread_tools li {
	list-style: none;
	padding: 0;
	margin: 0;
}

ul.thread_tools li {
	padding-left: 26px;
	padding-bottom: 2px;
	margin-bottom: 2px;
	
	font-size: 11px;
}

ul.thread_tools li.printable {
	background: url(images/printable.gif) no-repeat 0px 0px;
}

ul.thread_tools li.sendthread {
	background: url(images/send.gif) no-repeat 0px 0px;
}

ul.thread_tools li.subscription_add {
	background: url(images/subscribe.gif) no-repeat 0px 0px;
}

ul.thread_tools li.subscription_remove {
	background: url(images/unsubscribe.gif) no-repeat 0px 0px;
}

ul.thread_tools li.new_post {
	background: url(images/new_post.png) no-repeat 0px 0px;
}

ul.thread_tools li.view {
	background: url(images/view.png) no-repeat 0px 0px;
}

img.vmiddle {
	vertical-align:middle;
}

.inline-block {
	display:inline-block;
              width:120px;
}

table#tools td {
              vertical-align:top;
}

.links_title {
	display:inline-block;
	width:120px;
}

.links_field {
	display:inline-block;
}

Save it.

Go to your theme template set (ACP -> Templates & Style -> Templates -> <your theme template set> -> Showthread template ->showthread template) and open showthread template.

Find following code:


<div style="float: right;">
					<span class="smalltext"><strong><a href="showthread.php?mode=threaded&amp;tid={$tid}&amp;pid={$pid}#pid{$pid}">{$lang->threaded}</a> | <a href="showthread.php?mode=linear&amp;tid={$tid}&amp;pid={$pid}#pid{$pid}">{$lang->linear}</a></strong></span>
				</div>

And remove it.

In head tag find

<script type="text/javascript" src="jscripts/thread.js?ver=1603"></script>

and add below

<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
<script type="text/javascript">
function toggle(){
	var div1 = document.getElementById('tools')
	if (div1.style.display == 'none') {
		tools.style.display = 'block'
	} else {
		tools.style.display = 'none'
	}
}
</script>

Find:

<div class="float_right">
		 {$newreply}
	</div>

and add

<a href="javascript: toggle()"><img src="{$theme['imgdir']}/thread_tools.png" alt="tools" /></a>

Output:

After that find:


<div class="float_left">
		<ul class="thread_tools">
			<li class="printable"><a href="printthread.php?tid={$tid}">{$lang->view_printable}</a></li>
			<li class="sendthread"><a href="sendthread.php?tid={$tid}">{$lang->send_thread}</a></li>
			<li class="subscription_{$add_remove_subscription}"><a href="usercp2.php?action={$add_remove_subscription}subscription&amp;tid={$tid}&amp;my_post_key={$mybb->post_code}">{$add_remove_subscription_text}</a></li>
		</ul>
	</div>

And remove it.

Under


	<div style="padding-top: 4px;" class="float_right">
		{$newreply}
	</div>
	<br style="clear: both;" />

add


<!--start: Thread tools-->
<div  id="tools" style="display:none">
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">
  <tr>
    <td class="thead" colspan="3">
      <strong>Thread tools</strong>
    </td>
  </tr>
  <tr>
    <td class="tcat" width="33%">
      <strong>Thread info</strong>
    </td>
    <td class="tcat" width="33%">
      <strong>Thread tools</strong>
    </td>
    <td class="tcat" width="33%">
      <strong>Thread Sharing</strong>
    </td>
  </tr>
  <tr>
    <td class="trow1" width="33%">
      <ul class="thread_tools">
        <li>
          <strong>Thread Title:</strong>{$thread['threadprefix']}{$thread['subject']}</li>
        <li>
          <strong>{$lang->author}:</strong>
          <a href="member.php?action=profile&amp;uid={$thread['uid']}">{$thread['username']}</a>
        </li>
        <li>
          <strong>Number of replies:</strong>
          <a href="javascript:MyBB.whoPosted({$thread['tid']});">{$thread['replies']}</a>{$unapproved_posts}</li>
        <li class="{$thread_type_class}">
          <strong>Number of views:</strong>{$thread['views']}</li>
        <li>
          <strong>{$lang->lastpost}:</strong>
          <a href="member.php?action=profile&amp;uid={$thread['lastposteruid']}">{$thread['lastposter']}</a>
        </li>
      </ul>
    </td>
    <td class="trow1" width="33%">
      <ul class="thread_tools">
        <li class="printable">
          <a href="printthread.php?tid={$tid}">{$lang->view_printable}</a>
        </li>
        <li class="sendthread">
          <a href="sendthread.php?tid={$tid}">{$lang->send_thread}</a>
        </li>
        <li class="subscription_{$add_remove_subscription}">
          <a href="usercp2.php?action={$add_remove_subscription}subscription&amp;tid={$tid}&amp;my_post_key={$mybb->post_code}">{$add_remove_subscription_text}</a>
        </li>
        <li class="new_post">
          <a href="showthread.php?tid={$thread['tid']}&amp;action=newpost">Go to new post</a>
        </li>
        <li class="view">
          <a href="showthread.php?mode=threaded&amp;tid={$tid}&amp;pid={$pid}#pid{$pid}">{$lang->threaded}</a>|
          <a href="showthread.php?mode=linear&amp;tid={$tid}&amp;pid={$pid}#pid{$pid}">{$lang->linear}</a>
        </li>
      </ul>
    </td>
    <td class="trow1" width="33%">
      <div>
        <ul class="thread_tools inline-block">
          <li>
            <a class="share addthis_button_preferred_1"><img class="vmiddle" src="{$theme['imgdir']}/share_buttons/facebook.png" alt="facebook" />&nbsp;Facebook</a>
          </li>
          <li>
            <a class="share addthis_button_preferred_2"><img class="vmiddle" src="{$theme['imgdir']}/share_buttons/twitter.png" alt="twitter" />&nbsp;Twitter</a>
          </li>
          <li class="trow1 smalltext">
            <a class="share addthis_button_google"><img class="vmiddle" src="{$theme['imgdir']}/share_buttons/google.png" alt="google" />&nbsp;Google</a>
          </li>
          <li>
            <a class="share addthis_button_preferred_5"><img class="vmiddle" src="{$theme['imgdir']}/share_buttons/reddit.png" alt="reddit" />&nbsp;Reddit</a>
          </li>
        </ul>
        <ul class="thread_tools inline-block">
          <li>
            <a class="share addthis_button_digg"><img class="vmiddle" src="{$theme['imgdir']}/share_buttons/digg.png" alt="digg" />&nbsp;digg</a>
          </li>
          <li>
            <a class="share addthis_button_linkedin"><img class="vmiddle" src="{$theme['imgdir']}/share_buttons/linkedin.png" alt="linkedin" />&nbsp;Linkedin</a>
          </li>
          <li>
            <a class="share addthis_button_preferred_6"><img class="vmiddle" src="{$theme['imgdir']}/share_buttons/stumbleupon.png" alt="stumbleupon" />&nbsp;Stumbleupon</a>
          </li>
          <li>
            <a class="share addthis_button"><img class="vmiddle" src="{$theme['imgdir']}/share_buttons/more.png" alt="more" />&nbsp;More options</a>
          </li>
        </ul>
      </div>
    </td>
  </tr>
  <tr>
    <td class="tcat" colspan="3">
      <strong>Thread links</strong>
    </td>
  </tr>
  <tr>
    <td class="trow1" colspan="3">
      <div style="padding:2px;">
        <div class="links_title">Thread url</div>
        <div class="links_field">
          <form name="url_select_all" action="">
            <input size="50" class="small" onclick="this.form.url.focus();this.form.url.select();"
            readonly="readonly" name="url" value="{$mybb->settings['bburl']}/showthread.php?tid={$thread['tid']}"
            />
          </form>
        </div>
      </div>
      <div style="padding:2px;">
        <div class="links_title">Thread BBCode</div>
        <div class="links_field">
          <form name="bbcode_select_all" action="">
            <input size="50" type="text" class="small" onclick="this.form.bbcode.focus();this.form.bbcode.select();"
            readonly="readonly" name="bbcode" value="[url={$mybb->settings['bburl']}/showthread.php?tid={$thread['tid']}]{$thread['threadprefix']}{$thread['subject']}[/url]"
            />
          </form>
        </div>
      </div>
    </td>
  </tr>
</table>
</div>

<br />
<!--end: Thread tools-->

Output:

Few informations:

You can place content from  anywhere in showthread template (on top,after post list,in bottom)
If you don't want toogle function (show / hide) then remove


<script type="text/javascript">
function toggle(){
	var div1 = document.getElementById('tools')
	if (div1.style.display == 'none') {
		tools.style.display = 'block'
	} else {
		tools.style.display = 'none'
	}
}
</script>

from header

and replace href="javascript: toggle()" with href="#tools"

Why don't you just use jQuery.noconflict() rather than "JQ = $; //rename $ function"?

Anyway, it doesn't look too bad, but I reckon it belongs below the actual thread rather than above.

Not to much to criticize however you wrote UnDREAD posts instead of Unread posts I suggest you fix that.

(2011-02-12, 05:36 PM)euantor Wrote: [ -> ]Why don't you just use jQuery.noconflict() rather than "JQ = $; //rename $ function"?

Anyway, it doesn't look too bad, but I reckon it belongs below the actual thread rather than above.

The correct way is:

var $j = jQuery.noConflict();

Where $j is whatever you want to reference the jQuery object as. Simply calling jQuery.noConflict() will force you to use jQuery:

jQuery.noConflict();
// All calls must use jQuery now
jQuery(document).ready(function(){
    // etcetera
});

// This way is preferred
var $j = jQuery.noConflict(); // Returns the jQuery object
$j(document).ready(function(){
    // etcetera
});

iirc you use j.noConflict();, where j is what you want to replace $. Not 100% sure though.

(2011-02-20, 03:01 AM)Scoutie44 Wrote: [ -> ]iirc you use j.noConflict();, where j is what you want to replace $. Not 100% sure though.

No, check my above post. You assign jQuery.noConflict to whatever you want to replace $.

Here's the jQuery documentation article on it.

oic, my memory hath failed me. I hate javascript >.>

(2011-02-21, 02:42 AM)Scoutie44 Wrote: [ -> ]oic, my memory hath failed me. I hate javascript >.>

It's not a bad language to learn, although it can get confusing because it's natively all OOP.

After one year Thread tools modification got some love (at last).

Following changes were made

Jquery requirement is gone (replaced by simple javascript toogle function)
Added addthis sharing service
Removed manual links to sharing sites (Facebook,Twiiter,Linkedin,Myspace..)
Few corrections on ampersands (for valid html output)

Johnny S

Euan T

Jason L.

Steven

Scoutie44

Steven

Scoutie44

Steven

Johnny S