This guide will allow you to integrate the Aria 3.7.x skin with vBadvanced CMPS 3.0.x (Content Management & Portal System).
Main features:
http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » Main CSS
Category Strips (.tcat)
FIND:
REPLACE with:
Table Header (.thead)
FIND:
REPLACE with:
Table Footer (.tfoot)
FIND:
REPLACE with:
Popup Menu Controls (.vbmenu_control)
FIND:
REPLACE with:
Additional CSS Definitions
FIND:
REPLACE with:
FIND:
REPLACE with:
FIND:
REPLACE with:
Done!
http://www.yoursite.com/admincp/
vBa CMPS » Defaul Settings » Global vBadvanced Settings » Header Replacements
Enter the following:
Done!
http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » StyleVars
FIND:
Main Table Width: 760
REPLACE WITH:
Main Table Width: 800
Change all of the images paths from
to
Done!
http://www.yoursite.com/admincp/
vBa CMPS » Defaul Settings » Style Options
FIND:
Left Column Width: 175
REPLACE WITH:
Left Column Width: 200
FIND:
Right Column Width: 175
REPLACE WITH:
Right Column Width: 200
Done!
http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » Edit Templates
adv_portal_module_wrapper
FIND:
ADD below:
FIND and DELETE:
FIND:
ADD above:
Done!
http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » Edit Templates
navbar
FIND:
ADD above:
FIND:
ADD below:
Done!
http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » Edit Templates
header
FIND:
ADD before:
Done!
http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » Edit Templates
headinclude
FIND:
ADD below:
Done!
Upload the attached images to your forum/images/aria/misc/ folder.
and you are done!
Thanks to cor3y from GYSn for this
Main features:
- Rounded categories
- Dynamic home and forum buttons
- Working navbar and dropdown menu

http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » Main CSS
Category Strips (.tcat)
FIND:
Code:
#587CAD url(images/aria/misc/top1.gif) repeat-x top left
Code:
#587CAD url(http://www.yoursite.com/forum/images/aria/misc/top1.gif) repeat-x top left
FIND:
Code:
#587CAD url(images/aria/misc/top1.gif) repeat-x top left
Code:
#587CAD url(http://www.yoursite.com/forum/images/aria/misc/top1.gif) repeat-x top left
FIND:
Code:
#587CAD url(images/aria/misc/top1.gif) repeat-x top left
Code:
#587CAD url(http://www.yoursite.com/forum/images/aria/misc/top1.gif) repeat-x top left
FIND:
Code:
#587CAD url(images/aria/misc/top1.gif) repeat-x top left
Code:
#587CAD url(http://www.yoursite.com/forum/images/aria/misc/top1.gif) repeat-x top left
FIND:
Code:
/* ***** Header and Nav ***** */
.header_bg {
background: #FFFFFF url(images/aria/misc/nav_bg.gif) ;
}
Code:
/* ***** Header and Nav ***** */
.header_bg {
background: #FFFFFF url(http://www.yoursite.com/forum/images/aria/misc/nav_bg.gif) ;
}
Code:
/* ***** dotted hr ***** */
div.hr {
height: 1px;
background: url(images/aria/misc/hr.gif) repeat scroll center;
}
Code:
/* ***** dotted hr ***** */
div.hr {
height: 1px;
background: url(http://www.yoursite.com/forum/images/aria/misc/hr.gif) repeat scroll center;
}
Code:
.userinfo_bg {
background: #ededed url(images/aria/misc/postbit.jpg) ;
color: #000000;
border-left: 1px solid #FFFFFF;
border-top: 1px solid #FFFFFF;
}
Code:
.userinfo_bg {
background: #ededed url(http://www.yoursite.com/forum/images/aria/misc/postbit.jpg) ;
color: #000000;
border-left: 1px solid #FFFFFF;
border-top: 1px solid #FFFFFF;
}
http://www.yoursite.com/admincp/
vBa CMPS » Defaul Settings » Global vBadvanced Settings » Header Replacements
Enter the following:
Code:
memberlist.php
usercp.php
register.php
faq.php
calendar.php
search.php
login.php
forumdisplay.php
profile.php
private.php
subscription.php
member.php
online.php
http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » StyleVars
FIND:
Main Table Width: 760
REPLACE WITH:
Main Table Width: 800
Change all of the images paths from
Code:
/images/aria/.....
Code:
http://www.yourwebsite.com/yourforum/images/aria/.....
http://www.yoursite.com/admincp/
vBa CMPS » Defaul Settings » Style Options
FIND:
Left Column Width: 175
REPLACE WITH:
Left Column Width: 200
FIND:
Right Column Width: 175
REPLACE WITH:
Right Column Width: 200
Done!
http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » Edit Templates
adv_portal_module_wrapper
FIND:
Code:
$mods[formcode]
Code:
<!-- Categoty Top -->
<table border="0" cellpadding="0" cellspacing="0" width="$stylevar[tablewidth]" align="center">
<tr>
<td width="21" height="31" align="left" valign="top" style="background-image: url($stylevar[imgdir_misc]/top_bg.gif)"><img border="0" src="$stylevar[imgdir_misc]/top_left.gif" width="21" height="31" alt="" /></td>
<td height="31" width="60%" align="left" valign="middle" style="background-image: url($stylevar[imgdir_misc]/top_bg.gif)"><div class="category_title"><strong>$vba_style[portal_blockbullet] <if condition="$mods['link']"><a href="$mods[link]">$mods[title]</a><else />$mods[title]</if></strong> </div></td>
<td width="19" align="left" valign="middle"><img src="$stylevar[imgdir_misc]/top_end.gif" alt="" width="19" height="31" border="0" /></td>
<td align="right" valign="top" style="background-image: url($stylevar[imgdir_misc]/top_center.gif)"><if condition="$vba_style['portal_collapsemods']">
<a href="#top" onclick="return toggle_collapse('module_$mods[collapse]')" style="float:$stylevar[align=right]; padding-top: 9px"><img alt="" border="0" id="collapseimg_module_$mods[collapse]" src="$stylevar[imgdir_button]/collapse_tcat$modimgcollapse.gif" /></a>
</if>
</td>
<td width="14" height="31" align="right" valign="top"><img border="0" src="$stylevar[imgdir_misc]/top_right.gif" width="14" height="31" alt="" /></td>
</tr>
</table>
<!-- /Categoty Top -->
Code:
<thead>
<tr>
<td class="tcat" colspan="$mods[colspan]">
<if condition="$vba_style['portal_collapsemods']">
<a href="#top" onclick="return toggle_collapse('module_$mods[collapse]')" style="float:$stylevar[align=right]"><img alt="" border="0" id="collapseimg_module_$mods[collapse]" src="$stylevar[imgdir_button]/collapse_tcat$modimgcollapse.gif" /></a>
</if>
<span class="smallfont"><strong>$vba_style[portal_blockbullet] <if condition="$mods['link']"><a href="$mods[link]">$mods[title]</a><else />$mods[title]</if></strong></span></td>
</tr>
</thead>
Code:
</div>
<if condition="$mods['formcode']"></form></if>
Code:
<!-- Aria Categoty Bottom -->
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="12" align="left" valign="top"><img src="$stylevar[imgdir_misc]/blc.gif" width="12" height="13" alt="" border="0" /></td>
<td width="100%" style="background-image:url($stylevar[imgdir_misc]/bottom.gif)"><img src="$stylevar[imgdir_misc]/clear.gif" width="100%" height="13" alt="" border="0" /></td>
<td width="12" align="right" valign="top"><img src="$stylevar[imgdir_misc]/brc.gif" width="12" height="13" alt="" border="0" /></td>
</tr>
</table>
<!-- /Aria Categoty Bottom -->
http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » Edit Templates
navbar
FIND:
Code:
<!-- Categoty Top -->
<table border="0" cellpadding="0" cellspacing="0" width="100%" align="center">
Code:
<if condition="in_array(THIS_SCRIPT, array(adv_index))"> <else />
Code:
<!-- /Aria Forum Description -->
<div class="spacer"></div>
<br />
Code:
</if>
http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » Edit Templates
header
FIND:
Code:
<!-- Register -->
Code:
<if condition="in_array(THIS_SCRIPT, array(adv_index))">
<!-- Forum --><td width="78"><table width="78" border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="background:#FFFFFF url($stylevar[imgdir_misc]/xforum.gif);"><a href="$vboptions[bburl]?$session[sessionurl_q]"
onmouseover="JSFX.fadeIn('forum')"
onmouseout="JSFX.fadeOut('forum')"><img
src="$stylevar[imgdir_misc]/xforum.gif" name="forum" width="78" height="39" border="0" class="imgFader" id="forum" alt="" /></a></td>
</tr>
</table></td><!-- /Forum -->
<else />
<!-- Home --><td width="78"><table width="78" border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="background:#FFFFFF url($stylevar[imgdir_misc]/xhome.gif);"><a href="$vboptions[homeurl]?$session[sessionurl_q]"
onmouseover="JSFX.fadeIn('home')"
onmouseout="JSFX.fadeOut('home')"><img
src="$stylevar[imgdir_misc]/xhome.gif" name="home" width="78" height="39" border="0" class="imgFader" id="home" alt="" /></a></td>
</tr>
</table></td><!-- /Home -->
</if>
http://www.yoursite.com/admincp/
Styles & Templates » Style Manager » Aria » Edit Templates
headinclude
FIND:
Code:
JSFX.Rollover("logout", "$stylevar[imgdir_misc]/logout_over.gif");
Code:
JSFX.Rollover("home", "$stylevar[imgdir_misc]/xhome_over.gif");
JSFX.Rollover("forum", "$stylevar[imgdir_misc]/xforum_over.gif");
Upload the attached images to your forum/images/aria/misc/ folder.
and you are done!
Thanks to cor3y from GYSn for this