Design VBB styles - Lesson 1:Fixing Default Style
Do you want design a vbb styles ? ^^ Reading this tutorial .I think it's very useful to you .Now we must view this job
Lession 1 : Fixing Default Styles Split css :
-After setup Default styles ,open notepad , copy and save it
-Save with filename thietlapmau.css
-In headinclude template .Search $style[css] and replace
<link rel="stylesheet" href="thietlapmau.css" type="text/css" />
-Up file thietlapmau.css in root forum.Ex: http://yoursite.com/forum/thietlapmau.css .
It's not important but split css is very useful to manage or edit css file
Delete outer pages (grey area) :
You can del grey area outer pages .Open thietlapmau.css and find in body class
margin: 5px 10px 10px 10px change it to margin: 0px 0px 0px 0px .Save and F5 to load it again Delete logo in header:
-In header template search :
<br />
<div align="center">
<div class="smallfont" align="center">
<!-- Do not remove this copyright notice -->
$vbphrase[powered_by_vbulletin]
<!-- Do not remove this copyright notice -->
</div>
<div class="smallfont" align="center">
<!-- Do not remove $cronimage or your scheduled tasks will cease to function -->
$cronimage
<!-- Do not remove $cronimage or your scheduled tasks will cease to function -->
$vboptions[copyrighttext]
</div>
</div>
</form>
<if condition="$show['dst_correction']">
<!-- auto DST correction code -->
<form action="profile.php" method="post" name="dstform">
<input type="hidden" name="s" value="$session[sessionhash]" />
<input type="hidden" name="do" value="dst" />
</form>
<script type="text/javascript">
<!--
var tzOffset = $bbuserinfo[timezoneoffset] + $bbuserinfo[dstonoff];
var utcOffset = new Date().getTimezoneOffset() / 60;
if (Math.abs(tzOffset + utcOffset) == 1)
{ // Dst offset is 1 so its changed
document.forms.dstform.submit();
}
//-->
</script>
<!-- / auto DST correction code -->
</if>
<script type="text/javascript">
<!--
// Main vBulletin Javascript Initialization
vBulletin_init();
//-->
</script>
<div align="center">
<div class="smallfont" align="center">
<!-- Do not remove this copyright notice -->
$vbphrase[powered_by_vbulletin]
<!-- Do not remove this copyright notice -->
</div>
<div class="smallfont" align="center">
<!-- Do not remove $cronimage or your scheduled tasks will cease to function -->
$cronimage
<!-- Do not remove $cronimage or your scheduled tasks will cease to function -->
$vboptions[copyrighttext]
</div>
</div>
</form>
<if condition="$show['dst_correction']">
<!-- auto DST correction code -->
<form action="profile.php" method="post" name="dstform">
<input type="hidden" name="s" value="$session[sessionhash]" />
<input type="hidden" name="do" value="dst" />
</form>
<script type="text/javascript">
<!--
var tzOffset = $bbuserinfo[timezoneoffset] + $bbuserinfo[dstonoff];
var utcOffset = new Date().getTimezoneOffset() / 60;
if (Math.abs(tzOffset + utcOffset) == 1)
{ // Dst offset is 1 so its changed
document.forms.dstform.submit();
}
//-->
</script>
<!-- / auto DST correction code -->
</if>
<script type="text/javascript">
<!--
// Main vBulletin Javascript Initialization
vBulletin_init();
//-->
</script>
View this styles again .Your footer will better than default styles
Optimize statusicon:
-3 icon need mất 3 line .It's not well .Optimize it ,you can get new look
-In Forumhome template search:
Split the catelogy :
-I'll teach you a basic split We have more cases but this is a easy case
-Go to FORUMHOME template ....At first we'll split reg area
Search:
Join some catelogy column :
Default styles is more column (5column) .Very redundant We'll join to 3 column ^^ You know my current style have 1 column ^^ https://vborg.vbsupport.ru/showthread.php?t=115556
-Next the job,in forumhome_forumbit_level1_nopost search:
So whats the point of removing the css and saving it as an extrenal file, when you can do it by default?
I do this because other areas of my site share the same styles as VBulletin. For instance I have a business directory that integrates users, but not styles. I just attach the style sheet, change the class ids in the business dir app and it's set.
Lesson 2,3,4,5 are avaible but i don't have free time to translate .....Please contact if you like do it . I'm very busy and my eng isn't well to do it well .... T^T I have movie tutorial ,too .But it's very heavy to show here (Bandwidth isn't enough for everyone to download) ,PM me to get this link if you like this movie....
05-15-2006, 10:00 PM
Is it better than old ? ^^
08-09-2006, 05:11 PM
