آموزش قرار دادن اخبار و تاپیکهای مهم در ویبولتین

درود
شات در رزلوشن های کوچک :



در رزلوشن های بزرگ :



خب حالا برای اینکار ابتدا در جست و جوی قالب ها additional.css رو سرچ کنید و کد های زیر رو به آخرش اضافه کنید :

کد:

a {
text-decoration: none;
}
.wikitopiks {
background: rgb(229,229,229); /* Old browsers */
background: -moz-linear-gradient(-45deg, rgba(229,229,229,1) 0%, rgba(255,255,255,1) 48%, rgba(229,229,229,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(229,229,229,1)), color-stop(48%,rgba(255,255,255,1)), color-stop(100%,rgba(229,229,229,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(-45deg, rgba(229,229,229,1) 0%,rgba(255,255,255,1) 48%,rgba(229,229,229,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(-45deg, rgba(229,229,229,1) 0%,rgba(255,255,255,1) 48%,rgba(229,229,229,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(-45deg, rgba(229,229,229,1) 0%,rgba(255,255,255,1) 48%,rgba(229,229,229,1) 100%); /* IE10+ */
background: linear-gradient(135deg, rgba(229,229,229,1) 0%,rgba(255,255,255,1) 48%,rgba(229,229,229,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5e5e5', endColorstr='#e5e5e5',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
border: 1px dashed #ccc;
overflow: hidden;
height: 130px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
margin-top: 20px;
box-shadow: 0 0 0 5px rgba(255,255,255,0.6),0 0 5px 6px rgba(0,0,0,0.3);
-moz-box-shadow: 0 0 0 5px rgba(255,255,255,0.6),0 0 5px 6px rgba(0,0,0,0.3);
-webkit-box-shadow: 0 0 0 5px rgba(255,255,255,0.6),0 0 5px 6px rgba(0,0,0,0.3);
-o-box-shadow: 0 0 0 5px rgba(255,255,255,0.6),0 0 5px 6px rgba(0,0,0,0.3);
-ms-box-shadow: 0 0 0 5px rgba(255,255,255,0.6),0 0 5px 6px rgba(0,0,0,0.3);
margin: 20px 10px;
}
.wikitopikstext span{
font: 13px Byekan,B yekan,Tahoma;
color: #00b2e3;
background: url(http://www.up.wikivb.ir/images/mdueheokrtaqhnljjaa.png) no-repeat right 7px;
padding: 5px 10px;
padding-right: 21px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
border: 0px solid #d1d1d1;
-moz-transition: all 0.3s ease-in;
-webkit-transition: all 0.3s ease-in;
-o-transition: all 0.3s ease-in;
-ms-transition: all 0.3s ease-in;
}
.wikitopikstext span:hover{
   background: url(http://www.up.wikivb.ir/images/m3otoqy3e3aylysdkqdq.png) no-repeat right 7px;
   color: gray;
}
.wikitopikstext {
height: 8px;
margin-top: 25px;
margin-right: 20px;
margin-left: 20px;
}
.beststop2 {
position: absolute;
height: 39px;
width: 190px;
margin-top: -0px;
left: 100px;
}
.beststop2 span {
background: rgb(3,143,176); /* Old browsers */
background: -moz-linear-gradient(-45deg, rgba(3,143,176,1) 0%, rgba(40,195,231,1) 50%, rgba(10,179,218,1) 51%, rgba(3,158,194,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(3,143,176,1)), color-stop(50%,rgba(40,195,231,1)), color-stop(51%,rgba(10,179,218,1)), color-stop(100%,rgba(3,158,194,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(-45deg, rgba(3,143,176,1) 0%,rgba(40,195,231,1) 50%,rgba(10,179,218,1) 51%,rgba(3,158,194,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(-45deg, rgba(3,143,176,1) 0%,rgba(40,195,231,1) 50%,rgba(10,179,218,1) 51%,rgba(3,158,194,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(-45deg, rgba(3,143,176,1) 0%,rgba(40,195,231,1) 50%,rgba(10,179,218,1) 51%,rgba(3,158,194,1) 100%); /* IE10+ */
background: linear-gradient(135deg, rgba(3,143,176,1) 0%,rgba(40,195,231,1) 50%,rgba(10,179,218,1) 51%,rgba(3,158,194,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#038fb0', endColorstr='#039ec2',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    position: absolute;
    font: 13px Byekan,B yekan,Tahoma;
    color: #fff;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.6);
    left: -54px;
    top: -16px;
    padding: 8px 20px 11px 20px;
    border-radius: 0 6px 4px 4px;
-moz-border-radius: 0 6px 4px 4px;
-webkit-border-radius: 0 6px 4px 4px;
-o-border-radius: 0 6px 4px 4px;
-ms-border-radius: 0 6px 4px 4px;
    box-shadow: 0px 4px 2px rgba(0,0,0,0.2) inset,2px 2px 1px rgba(0,0,0,0.2);
-moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.6) inset;
-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.6) inset;
-o-box-shadow: 1px 1px 2px rgba(0,0,0,0.6) inset;
-ms-box-shadow: 1px 1px 2px rgba(0,0,0,0.6) inset;
}
.beststop2left {
position: absolute;
height: 0px;
width: 0px;
border-right: 5px solid #02566B;
border-left: 5px solid transparent;
border-top: 5px solid transparent;
border-bottom: 5px solid #02566B;
z-index: 999;
left: -64px;
margin-top: -16px;
} 

ذخیره کرده و قالب FORUMHOME رو جست و جو کنید ، درش کد زیر رو پیدا کنید :

کد:

 {vb:raw navbar}

و کد های زیر رو بعدش قرار بدید :

کد:

<!--bests start-->
<div class="wikitopiks">
<div class="beststop2"><div class="beststop2left"></div><span>اخبار و تاپیکهای مهم</span></div>
<div class="wikitopikstext">
<table width="100%" border="0">
<tr>
<td width="35%"><a href="#" ><span style="float: right;">یک تاپیک مهم</span></a></td>
<td width="35%"><a href="#" ><span style="float: right;">یک تاپیک مهم</span></a></a></td>
<td width="35%"><a href="#" ><span style="float: right;">یک تاپیک مهم</span></a></td>
</tr>
</table>
</div>
<div class="wikitopikstext">
<table width="100%" border="0">
<tr>
<td width="35%"><a href="#" ><span style="float: right;">یک تاپیک مهم</span></a></td>
<td width="35%"><a href="#" ><span style="float: right;">یک تاپیک مهم</span></a></td>
<td width="35%"><a href="#" ><span style="float: right;">یک تاپیک مهم</span></a></td>
</tr>
</table>
</div>
<div class="wikitopikstext">
<table width="100%" border="0">
<tr>
<td width="35%"><a href="#" ><span style="float: right;">یک تاپیک مهم</span></a></td>
<td width="35%"><a href="#" ><span style="float: right;">یک تاپیک مهم</span></a></td>
<td width="35%"><a href="#" ><span style="float: right;">یک تاپیک مهم</span></a></td>
</tr>
</table>
</div>
</div>  
<!--bests end--> 

برای ویرایش عنوان ها کد هایی رو که در FORUMHOME قرار دادید ویرایش کنید .

پیروز باشید

منبع:ویکی وی بی