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:
Note:
-Thu gọn header : Optimize header
-Đưa l?n :Move up
-Chuyển xuống :Move down
-T?ch box: Split catelogy
-Gom c?c cột lại : Join column
-Thu gọn lại ,canh bỏ giữa : Optimize and align center
-Chuyển l?n tr?n:Move up
Quote:
Originally Posted by Zachery
So whats the point of removing the css and saving it as an extrenal file, when you can do it by default?
It's in thietlapmau.css .I put in root forum .When using private css file using css tool to edit it .I use topstyle pro to edit .You know I do this in 15 minites http://www.vongtaythanai.net/4rum/img/ps3.png => Only using css file
I make styles in localhost .No need ftp acess .Use private css file and edit template in acp .Making a styles is very quickly .Acp isn't support css better than topstyle pro
05-15-2006, 10:00 PM
Is it better than old ? ^^
05-16-2006, 02:50 AM
