Template-CSS Mod Display "Latest Threads" sidebar on Index page

Electric ShockDivided by Zero
#1
Been a long time since I did something productive, so just did this little experimentation a few moments ago and thought I would share it. And considering this is a pretty nifty addition alongside trying to reduce plugin queries as much as possible, this should prove quite useful.

This addition assumes you are applying the addition on the default theme, if on any other theme, required changes have to be made.

Also uses jQuery 1.10.2, though older versions may also work.
And lastly, it requires you to have the "float_left", "float_right" and "clear" classes untouched in global.css.

Alright, lets get on with it.

1. We need the jQuery library and noconflict function.
Open up your "headerinclude" template and add the following:
PHP Code:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<
script type="text/javascript">
jQuery.noConflict();
</
script
Note that the load() function is not used here, because we need the sidebar to be loaded only on the index, so to reduce the browser load, the function is included in the "index" template itself.

2. As noticed, we are using jQuery AJAX function, so we need to add the destination where the sidebar will be loaded.
Open your "index" template.
Find:
PHP Code:
{$header}
{
$forums
Replace with:
PHP Code:
{$header}
<
script type="text/javascript">
jQuery(function(){
jQuery(".latestthreads").load("{$mybb->settings['bburl']}/portal.php .latestthreads_portal"); 
}); </
script>
<
div class="clear"></div>
<
div class="latestthreads float_right" style="width: 19%">
</
div>
<
div class="float_left" style="width: 80%">
{
$forums}
</
div

3. Now to set the source destination.
Go to "portal" template.
Find:
PHP Code:
{$latestthreads
Replace with:
PHP Code:
<div class="latestthreads_portal">
{
$latestthreads}
</
div

Save the three templates and you're done!
[Image: 4441131748.png]View Screen Capture
[Image: FxbVPSd.png]
effoneDesigner
#2
1. I can't see you are using 2.0 library.
2. If it is for index only then why are you including ajax loading function in headerinclude and increasing unnecessary pressure? The library should be in headerinclude and the loader function should be in index template.

Nice share though. Thanks.
Electric ShockDivided by Zero
#3
I thought about 2, i'll update it in the evening.
[Image: FxbVPSd.png]

Possibly Related Threads…
Thread Author Replies Views Last Post
  Template-CSS Mod Implementing Board Statistics Icons on Index Page effone 6 3,158 10-19-2013, 11:45 AM
Last Post: effone
  Template-CSS Mod Latest Posts Links effone 0 967 01-16-2013, 04:33 PM
Last Post: effone