vb.org Archive - Blue is the Colour

Ok, a few people have been asking how I did the fuzz effect on my forum category and banners, which doesn't actually require you to add the effect to every image.

What you do is use the category icons template modification which is listed about 20 times here and instead set the category icon as the table background, then lay an image with a fuzzed transparent centre over the top of the background. Since IE6 and below can't handle the effect, it instead just uses the background image for those browsers.

Open your forumhome_forumbit_level1/2_nopost templates.

FIND:

Code:

<td><img src="$stylevar[imgdir_statusicon]/forum_$forum[statusicon].gif" alt="" border="0" id="forum_statusicon_$forum[forumid]" /></td>

                        <td><img src="$vboptions[cleargifurl]" alt="" width="9" height="1" border="0" /></td>

REPLACE WITH:

Code:

<if condition="is_browser('ie') AND !is_browser('ie', 7)">

                                <td class="alt1" id="f$forum[forumid]">

                                        <img src="images/forumicons/$forum[forumid].png" alt="" border="0" id="forum_statusicon_$forum[forumid]" <if condition="$forum[statusicon] != 'new'">class="inlineimg fog"</if> />

                                </td>

                        <else />

                                <td style="background:transparent url(images/forumicons/$forum[forumid].png) center center no-repeat;" class="alt1 inlineimg<if condition="$forum[statusicon] != 'new'"> fog"</if> id="f$forum[forumid]">

                                        <img src="$stylevar[imgdir_misc]/iconmask.png" alt="" border="0" id="forum_statusicon_$forum[forumid]" />

                                </td>

                        </if>

Then all you have to do is create an ordinary 50px x 50px picture for each forum section, give it the same name as the ID of the forum (so if your forum category has the ID 30, name the icon 30.png and then put all your icons in a directory called images/forumicons.

And you're done! If you want to make the icons fade out when there are no new posts like I've done, just add the following to your additional CSS definitions:

Code:

.fog { opacity: 0.4; filter: alpha(opacity=40); -moz-opacity: 0.40; }

X vBulletin 3.8.12 by vBS Debug Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (3)bbcode_code_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (1)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (4)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.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/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.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 printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages:

X vBulletin 3.8.12 by vBS Debug Information

Page Generation 0.00919 seconds
Memory Usage 1,722KB
Queries Executed 10 (?)

More Information

Template Usage:

(1)ad_footer_end
(1)ad_footer_start
(1)ad_header_end
(1)ad_header_logo
(1)ad_navbar_below
(3)bbcode_code_printable
(1)footer
(1)gobutton
(1)header
(1)headinclude
(6)option
(1)pagenav
(1)pagenav_curpage
(1)pagenav_pagelink
(1)post_thanks_navbar_search
(1)printthread
(4)printthreadbit
(1)spacer_close
(1)spacer_open

Phrase Groups Available:

global
postbit
showthread

Included Files:

./printthread.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/class_bbcode_alt.php
./includes/class_bbcode.php
./includes/functions_bigthree.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
printthread_start
pagenav_page
pagenav_complete
bbcode_fetch_tags
bbcode_create
bbcode_parse_start
bbcode_parse_complete_precache
bbcode_parse_complete
printthread_post
printthread_complete

Messages:

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.00919 seconds Memory Usage 1,722KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (3)bbcode_code_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (1)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (4)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.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/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.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 printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: