Go Back   vb.org Archive > vBulletin Article Depository > Read An Article > vBulletin 3 Articles
Reload this Page Better Forum Layout
FAQ Members List Calendar Search Today's Posts Mark Forums Read

Reply
Page 1 of 2 1 2
 
Thread Tools
Better Forum Layout
pein87's Avatar
pein87
Join Date: Sep 2008
Posts: 352

 

Show Printable Version Email this Page Subscription
pein87 pein87 is offline 01-04-2009, 10:00 PM
How to seperate your forums for a cleaner, more appealing skin/style.

To start for those who arent good with xhtml never fear no additional coding will be used its pretty much a search, move, and delete deal.

Open you forumhome template to your default theme. I noticed that some skins had it so each forum was seperateed so with a bit of playing around and code reading I figured out how to do it and I would like to share with with my fellow members.

Search for
<!-- main -->
take note of all the code between the <!--main --> <!--/main --> comments thats the code will be changing, feel free to copy this to a txt file if you wanna play with it later on.


Notice the $forumbits variable, that is what maks up your entire forum on forumhome. Now copy this to a text document and save the file. DO NOT CUT AND PASTE! When you save you`ll see a bunch of forumhome templates.

Search for this template:

forumhome_forumbit_level1_nopost
open this template this is what we will be mostly editing.

See how incomplete this template is? Thats because its what your software prints each time you make a new forum.

Ok I`ve already done the edit for you but to explain it the standard vbulletin skin has the $forumbits variable evaled to the forumhome_forumbit_level1_nopost template.

Clear the entire forumhome_forumbit_level1_nopost template and add this code:

PHP Code:
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<thead>
    <tr>
        <td class="tcat" colspan="<if condition="$vboptions[showmoderatorcolumn]">6<else />5</if>">
            <if condition="$childforumbits">
            <a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('forumbit_$forumid')"><img id="collapseimg_forumbit_$forumid" src="$stylevar[imgdir_button]/collapse_tcat{$collapseimg_forumid}.gif" alt="" border="0" /></a>
            </if>
            <a href="forumdisplay.php?$session[sessionurl]f=$forum[forumid]">$forum[title]</a>
            <if condition="$show['forumdescription']"><div class="smallfont">$forum[description]</div></if>
            <if condition="$show['subforums']"><div class="smallfont"><strong>$vbphrase[subforums]</strong>: $forum[subforums]</div></if>
        </td>
    </tr>
</thead>
<tbody>
    <tr align="center">
      <td class="thead">&nbsp;</td>
      <td class="thead" width="100%" align="$stylevar[left]">$vbphrase[forum]</td>
      <td class="thead">$vbphrase[last_post]</td>
      <td class="thead">$vbphrase[threads]</td>
      <td class="thead">$vbphrase[posts]</td>
      <if condition="$vboptions['showmoderatorcolumn']">
      <td class="thead">$vbphrase[moderator]</td>
      </if>
    </tr>
</tbody>
<if condition="$childforumbits">
<tbody id="collapseobj_forumbit_$forumid" style="{$collapseobj_forumid}">
$childforumbits
</tbody>
</if>
</table><br /> 
This code adds the the colum name to the top of the table making it a table head instead of a table body and the post/forumname display is not a table head, its instead been switched to a table body. You bascilly just moved a few things around changed the tags around and deleted some useless code. Now you have the forum leaders colum. Its not good to place this in the forumbits template because each forum would have it at the end, we can add it below it as a seperate table but it would just be floating there since after each forum a space is included. TO fix it we will move it to the bottom of the whats going on area.

Open forumhome template and find:

$template_hook[forumhome_wgo_pos5]

This is near the end right before this:

</table>
<br />
<!-- end what's going on box -->

Place this code right above itAfter the </if>)


PHP Code:
<tbody>
    <tr>
        <td class="tfoot" align="center" colspan="<if condition="$vboptions['showmoderatorcolumn']">6<else />5</if>"><div class="smallfont"><strong>
            <a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a>
            <if condition="$vboptions['forumleaders']">&nbsp; &nbsp;
            <a href="showgroups.php$session[sessionurl_q]">$vbphrase[view_forum_leaders]</a></if>
        </strong></div></td>
    </tr>
</tbody> 
This moves the forum leaders colum below the whats going on box to cap it off and makes your forum look nicer.


Code should look like this:

PHP Code:
</if>
<tbody>
    <tr>
        <td class="tfoot" align="center" colspan="<if condition="$vboptions['showmoderatorcolumn']">6<else />5</if>"><div class="smallfont"><strong>
            <a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a>
            <if condition="$vboptions['forumleaders']">&nbsp; &nbsp;
            <a href="showgroups.php$session[sessionurl_q]">$vbphrase[view_forum_leaders]</a></if>
        </strong></div></td>
    </tr>
</tbody>
$template_hook[forumhome_wgo_pos5]
</table>
<br />
<!-- end what's going on box --> 
Now to finish out this project when you save use the save and reload option so your brought back to the template.

Find:

<!-- main -->

Delete everything after this all the way till you see:

<!--/main -->

Next add this in between the <!--main --> and <!-- /main --> comments.

$forumbits
$forumhome_markread_script

so it should look like this:

<!--main -->
$forumbits
$forumhome_markread_script
<!-- /main -->

Next save and enjoy your newly styled forum now you can make your defaut theme into a nice new skin using vbulletin's built in style manager.
Images provided to see the final out come and attached txt file with info aswell for easy access for those like me and cant be online much. Also tiny green check marks in images means valid xhtml transitional. I use a firefox plugin with and sgml and xml/xhtml validater.

UPDATED

If your making the change to 3.7.5 or any of the 3.8.x versions use this instead of the above forumhome_forumbit_level1_nopost

PHP Code:
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<thead>
    <tr>
        <td class="tcat" colspan="<if condition="$vboptions[showmoderatorcolumn]">6<else />5</if>">
            <if condition="$childforumbits">
            <a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('forumbit_$forumid')"><img id="collapseimg_forumbit_$forumid" src="$stylevar[imgdir_button]/collapse_tcat{$collapseimg_forumid}.gif" alt="" border="0" /></a>
            </if>
            <a href="forumdisplay.php?$session[sessionurl]f=$forum[forumid]">$forum[title]</a>
            <if condition="$show['forumdescription']"><div class="smallfont">$forum[description]</div></if>
            <if condition="$show['subforums']"><div class="smallfont"><strong>$vbphrase[subforums]</strong>: $forum[subforums]</div></if>
        </td>
    </tr>
</thead>
<if condition="!$show['collapsable_forums']">
<tbody>
</if>
    <tr align="center">
      <td class="thead">&nbsp;</td>
      <td class="thead" width="100%" align="$stylevar[left]">$vbphrase[forum]</td>
      <td class="thead">$vbphrase[last_post]</td>
      <td class="thead">$vbphrase[threads]</td>
      <td class="thead">$vbphrase[posts]</td>
      <if condition="$vboptions['showmoderatorcolumn']">
      <td class="thead">$vbphrase[moderator]</td>
      </if>
    </tr>
<if condition="!$show['collapsable_forums']">
</tbody>
</if>
<if condition="$childforumbits">
<if condition="!$show['collapsable_forums']">
<tbody id="collapseobj_forumbit_$forumid" style="{$collapseobj_forumid}">
</if>
$childforumbits
<if condition="!$show['collapsable_forums']">
</tbody>
</if>
</if>
</table><br /> 
You will still need to do the part with the forum leader part but this is a replacement to fix template upgrades in those versions.
Attached Images
File Type: jpg layout_tutorial.jpg (85.6 KB, 0 views)
File Type: jpg layout_tutorial2.jpg (82.3 KB, 0 views)
Attached Files
File Type: txt layout_tutorial.txt (5.3 KB, 32 views)
Reply With Quote
  #2  
Old 01-08-2009, 01:41 AM
StuntFactoryX StuntFactoryX is offline
 
Join Date: May 2006
Posts: 228
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
doesnt this change alot on upgrades? so im assuming this is only good for certain versions?
Reply With Quote
  #3  
Old 01-08-2009, 08:28 AM
sensimilla sensimilla is offline
 
Join Date: Dec 2004
Location: Poland
Posts: 555
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
There is a simple plugin that does it, what for editing templates...
Reply With Quote
  #4  
Old 01-09-2009, 03:55 PM
pein87's Avatar
pein87 pein87 is offline
 
Join Date: Sep 2008
Posts: 352
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
It will stay the same on all versions except the newest havent had time to fix it ti work with 3.7.5 and 3.8.x I will and will update this if you added it notice when you upgrade it says revert templates.
Reply With Quote
  #5  
Old 01-15-2009, 02:36 PM
Mike-D Mike-D is offline
 
Join Date: Jan 2006
Location: Cologne / Germany
Posts: 270
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
Quote:
Originally Posted by sensimilla View Post
There is a simple plugin that does it, what for editing templates...
TMS would be more better than using a Plugin instead of

Quote:
Originally Posted by StuntFactoryX View Post
doesnt this change alot on upgrades?
Once you have TMS installed and the Code has been modified you've never to worry about Upgrades or something like that
Reply With Quote
  #6  
Old 01-19-2009, 01:11 PM
gazzak gazzak is offline
 
Join Date: Sep 2006
Posts: 48
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
Can someone please point to this TMS mod as it's impossible to search for 3 letter variables
Reply With Quote
  #7  
Old 01-19-2009, 01:37 PM
dyna88 dyna88 is offline
 
Join Date: Dec 2006
Location: Wisconsin
Posts: 164
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
Quote:
Originally Posted by gazzak View Post
Can someone please point to this TMS mod as it's impossible to search for 3 letter variables
https://vborg.vbsupport.ru/showthread.php?t=152931
Reply With Quote
  #8  
Old 01-29-2009, 11:09 PM
ali7118 ali7118 is offline
 
Join Date: Jul 2007
Posts: 25
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
Thank you ..

--------------- Added [DATE]1233277810[/DATE] at [TIME]1233277810[/TIME] ---------------

Thank you
Reply With Quote
  #9  
Old 01-31-2009, 06:06 AM
Raug Raug is offline
 
Join Date: Apr 2008
Posts: 25
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
<span style="text-decoration: line-through">What determines the width of the "Last Post" column on the forumhome? I noticed that on my board as well as others with a similar layout have varying widths. Is there a way to make it uniform?</span>

Nevermind, I found a way to get close to making them even.
Reply With Quote
  #10  
Old 02-06-2009, 07:15 PM
yoksito yoksito is offline
 
Join Date: Nov 2006
Posts: 15
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
thanks.... I wanted to put this code in my style
Reply With Quote
Reply
Page 1 of 2 1 2

« Previous Thread | Next Thread »
Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT. The time now is 02:04 PM.

Contact Us - Archive - Top

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.04726 seconds
  • Memory Usage 2,387KB
  • Queries Executed 24 (?)
More Information
Template Usage:
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)ad_showthread_beforeqr
  • (4)bbcode_php
  • (3)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)modsystem_article
  • (1)navbar
  • (4)navbar_link
  • (120)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (1)pagenav_pagelink
  • (10)post_thanks_box
  • (10)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (10)post_thanks_postbit_info
  • (9)postbit
  • (3)postbit_attachment
  • (10)postbit_onlinestatus
  • (10)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 
Phrase Groups Available:
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files:
  • ./showthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_post_thanks.php 
Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • forumjump
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • post_thanks_function_post_thanks_off_start
  • post_thanks_function_post_thanks_off_end
  • post_thanks_function_fetch_thanks_start
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • fetch_musername
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_attachment
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete