Sign Up! Login: Password: New User? Forgot? Support
Code 
 
 
Forums 
Forums : Forums > Forum Compact Mode (hides avatar & forum signature)
Mottie (SuperAdmin) 7/28/2009 4:51 PM EST : Forum Compact Mode (hides avatar & forum signature)
ACK!
Mottie
Posts: 3884

0
Like

0
Dislike

Forum Compact Mode

GuildPortal admin site link to original post

I wrote this script because sometimes the forum avatar or signatures can be very distracting. This button hides them while you are on that page. The avatar and signatures will reappear if you click on the button again or reload the page. You can add this button to either the top area next to the Forum Tools and Topic Tools menus (Top) or next to each post next to the top and bottom links (Side).

 Top
(Compact Link)
 
 Side  (Blue Icon)
 

The Code

Add the following into your Banner or Footer HTML or into a free form text/HTML content box (while in <> HTML mode) on your forum page.
<script type="text/javascript">
$(document).ready(function(){
 var addToTop = false;
 var compactTopText = 'Compact';
 var compactSideImg = 'http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/compact-blue.png';

// Don't change anything below
// ****************************
 if (addToTop) {
  $('div[id*="_mnuTopicAdmin"]').closest('td')
   .prepend('<a href="javascript:void(0)"><span id="compact">' + compactTopText + '</span></a>')
 } else {
  $('.MessageTopBottomCell1')
  .append('| <a href="javascript:void(0)"><img id="compact" src="' + compactSideImg + '"></a>')
 }
 $('.ContentRow').find('#compact').click(function(){ compactMode() })
  .parent().attr('title','Hide/Show Forum Avatar and Signatures').addClass('tooltip');
})
function compactMode(){
 $('img.MessageAuthorThumb').toggle();
 $('.MessageSignature').toggle();
 return false;
}
</script>
Customizing
  • Use the addToTop variable to place the button where you want it. If set to true, the button will placed next to the forum/topic tools menu. If false, it will be added into each post next to the top and bottom links. See the screen shots above.
    var addToTop = false;
  • If you decide to add the button to the top, use the compactTopText to customize the text or even add an image.
    var compactTopText = 'Compact';

    or

    var compactTopText = '<img src="URL TO YOUR IMAGE">';
  • If you decide to add the button to the side, use the compactSideImg variable to point to your image URL. I decided to leave this as an image since that is a pretty small area and you wouldn't be able to add much text (if any) in that area.
    var compactSideImg = 'http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/compact-blue.png';
Edit (4/28/2010): Updated with more specific classes for the avatar and post signature
Characters: Mottie Motty Mortie Ooshiny Mot Fudgems
TopBottom

Mottie (SuperAdmin) 4/28/2010 10:13 AM EST : RE: Forum Compact Mode (hides avatar & forum signature)
ACK!
Mottie
Posts: 3884

0
Like

0
Dislike

Updated to use more specific classes to hide the avatar and post signatures.
Characters: Mottie Motty Mortie Ooshiny Mot Fudgems
TopBottom

 
 
Key 
New posts No new posts
New posts ( popular ) No new posts ( popular )
New posts ( sticky ) No new posts ( sticky )
New posts ( locked ) No new posts ( locked )
 
 
Who's Online 
There are   members online.
 
 
So-and-so has logged on!
%title%
%message%