Forum Home Enhancements - Layout, and a new statistics for "What's Going On?"

About this modification :

I will give you a new look for the "What's Going On?" box. It is not complicated, even very simple. You would have a statistics about "real" posts, rearranging the layout for "What's Going On?" become neat, and give it full size.
Not much to say, it is better to start immediately!

Install :

1. Make new statistics look !
   In FORUMHOME template, search for :
   

   			<div id="wgo_stats" class="wgo_subblock section">
   				<h3 class="blocksubhead"><img src="{vb:stylevar imgdir_misc}/forum_stats.png" alt="{vb:rawphrase x_statistics, {vb:raw vboptions.bbtitle}}" />{vb:rawphrase x_statistics, {vb:raw vboptions.bbtitle}}</h3>
   				<div>
   					<dl>
   						<dt>{vb:rawphrase threads}</dt>
   							<dd>{vb:raw totalthreads}</dd>
   						<dt>{vb:rawphrase posts}</dt>
   							<dd>{vb:raw totalposts}</dd>
   						<dt>{vb:rawphrase members}</dt>
   							<dd>{vb:raw numbermembers}</dd>
   						<vb:if condition="$show['activemembers']">
   						<dt>{vb:rawphrase active_members}</dt>
   							<dd>{vb:raw activemembers}</dd>
   						</vb:if>
   					</dl>
   					<p>{vb:rawphrase welcome_to_our_newest_member_x, {vb:link member, {vb:raw newuserinfo}}, {vb:raw newuserinfo.username}}</p>
   					{vb:raw template_hook.forumhome_wgo_stats}
   				</div>
   			</div>

   Replace with :
   

   						<div id="wgo_stats" class="wgo_subblock section">
   							<h3 class="blocksubhead"><img src="{vb:stylevar imgdir_misc}/forum_stats.png" alt="{vb:rawphrase x_statistics, {vb:raw vboptions.bbtitle}}" />{vb:rawphrase x_statistics, {vb:raw vboptions.bbtitle}}</h3>
   							<div>
   								<dl>
   									<dt>{vb:rawphrase threads}</dt> <dd>{vb:raw totalthreads}</dd>
   									<dt>{vb:rawphrase posts}</dt> <dd>{vb:raw totalposts}</dd>
   									<dt>{vb:rawphrase members}</dt> <dd>{vb:raw numbermembers}</dd>
   									<vb:if condition="$show['activemembers']">
   									<dt>{vb:rawphrase active_members}</dt> <dd>{vb:raw activemembers}</dd>
   									</vb:if>
   									<dd>{vb:rawphrase welcome_to_our_newest_member_x, {vb:link member, {vb:raw newuserinfo}}, {vb:raw newuserinfo.username}}</dd>
   								</dl>
   								{vb:raw template_hook.forumhome_wgo_stats}
   							</div>
   						</div>

   If you want easier look and neat, add to the front <br /> and <br /> at the end.
   
2. Make it neat : I will split statistics and icon legend into two column.
   - First, search for : <div class="blockbody formcontrols floatcontainer"> and add below :
   

   			<table cellpadding="{vb:stylevar padding}" cellspacing="{vb:stylevar spacing}" border="0" width="100%" align="center">
   				<tr>
   					<td width="60%" valign="top">

   - Then, search for :
   

   								{vb:raw template_hook.forumhome_wgo_stats}
   							</div>
   						</div>

   add above :
   

   					</td>
   					<td width="1%" valign="top">&nbsp;</td>
   					<td width="39%"  valign="top">

   - And finally, search for : {vb:raw template_hook.forumhome_wgo_pos5}, add above :
   

   					</td>
   				</tr>
   			</table>

   And, it over !
   
3. If you want your WGO full width (when use "Sidebar & Block"), please as in direction after path:
   - At very bottom, search for and delete (or cut) it:
   

   	<vb:if condition="$show['sidebar']">
   		</div>
   	</div>
   
   	<div id="sidebar_container"<vb:if condition="$show['sidebarposition'] == 'left'"> class="sidebarleft"</vb:if>>
   		<a id="sidebar_button_link" href="#">
   			<vb:if condition="$show['sidebarposition'] == 'left'">
   			<img id="sidebar_button" src="{vb:stylevar imgdir_misc}/tab-collapsed-left.png" alt="" />
   			<vb:else />
   			<img id="sidebar_button" src="{vb:stylevar imgdir_misc}/tab-collapsed.png" alt="" />
   			</vb:if>
   		</a>
   		<ul id="sidebar">
   			{vb:raw sidebar}
   		</ul>
   	</div>
   	</vb:if>

   - Then, search for : <!-- /main -->, add below :
   

   	<vb:if condition="$show['sidebar']">
   		</div>
   	</div>
   
   	<div id="sidebar_container"<vb:if condition="$show['sidebarposition'] == 'left'"> class="sidebarleft"</vb:if>>
   		<a id="sidebar_button_link" href="#">
   			<vb:if condition="$show['sidebarposition'] == 'left'">
   			<img id="sidebar_button" src="{vb:stylevar imgdir_misc}/tab-collapsed-left.png" alt="" />
   			<vb:else />
   			<img id="sidebar_button" src="{vb:stylevar imgdir_misc}/tab-collapsed.png" alt="" />
   			</vb:if>
   		</a>
   		<ul id="sidebar">
   			{vb:raw sidebar}
   		</ul>
   	</div>
   	</vb:if>

Do not difficult to do, and now please enjoy what you have made​​.

[BCP Hung]

Add a screenshot.

[ssslippy]

I tried doing the whats going on at 100% width trick and it breaks everything.

[BCP Hung]

Originally Posted by ssslippy

I tried doing the whats going on at 100% width trick and it breaks everything.

Can you give me your FORUMHOME template, maybe I need a screenshot.

[ssslippy]

If you notice you are moving a closing <vb:if> you can't do this as it leaves an included vb:if. You can not even save the template with the edit you are doing.

Also if u move the vb:if then statement attached to there it puts everything into one column.

[rob01]

any screenshot?

[BCP Hung]

Sorry, my bad, I really did not pay attention to <vb:if... .
Now, I fixed, it really work 100%.

[BCP Hung]

Major change.
I made a new look for it, remove a few code.
----------------------------------------------
Update ver 2.00 : New look !

[synseal]

Demo doesn't work for me?.

[BCP Hung]

Originally Posted by synseal

Demo doesn't work for me?.

Sorry men ! I have changed my default domain, new domain to vBulletin Demo has been setup, try it !