Here are the button modifications for this template.
The buttons included are "home" "barracks" "wars" "forums" "links" "about".
The file includes a install.txt file with instructions on how to install these buttons, i will also explain it in this thread.
-------------------------------------------
##### custom buttons for the Darkness theme for vBulletin####
1) First upload the images that came with this mod to the "vbulletin/images/Darkness/darkness" directory.
2) Goto the admin page and edit the header template.
styles & templates --> Style Manager
3) on the first line of the header template add the below code.
PHP Code:
<SCRIPT LANGUAGE = "javascript">
<!--
if (document.images)
{
image1on = new Image();
image1on.src = "images/Darkness/darkness/button-home2.jpg";
image1off = new Image();
image1off.src = "images/Darkness/darkness/button-home.jpg";
image2on = new Image();
image2on.src = "images/Darkness/darkness/button-account2.jpg";
image2off = new Image();
image2off.src = "images/Darkness/darkness/button-account.jpg";
image3on = new Image();
image3on.src = "images/Darkness/darkness/button-forum2.jpg";
image3off = new Image();
image3off.src = "images/Darkness/darkness/button-forum.jpg";
image4on = new Image();
image4on.src = "images/Darkness/darkness/button-submit2.jpg";
image4off = new Image();
image4off.src = "images/Darkness/darkness/button-submit.jpg";
image5on = new Image();
image5on.src = "images/Darkness/darkness/button-barracks2.jpg";
image5off = new Image();
image5off.src = "images/Darkness/darkness/button-barracks.jpg";
image18on = new Image();
image18on.src = "images/Darkness/darkness/button-about2.jpg";
image18off = new Image();
image18off.src = "images/Darkness/darkness/button-about.jpg";
}
function changeImages()
{
if (document.images)
{
for (var i=0; i<changeImages.arguments.length; i+=2)
{ document[changeImages.arguments[i]].src = eval (changeImages.arguments[i+1] + ".src");
}
}
}
// -->
</SCRIPT>
The above Javascript is used for the hover effects.
4) Find this code: (approx line 87)
Code:
<img src="images/Darkness/buttons/buttonback.jpg" border="0" width="568" height="30">
and replace with:
Code:
<a href="add-link-here" onmouseover="changeImages('image1', 'image1on')" onmouseout="changeImages('image1', 'image1off')"><img src="images/Darkness/darkness/button-home.jpg" name="image1" border="0" width="75" height="30"></a><a href="add-link-here" onmouseover="changeImages('image5', 'image5on')" onmouseout="changeImages('image5', 'image5off')"><img src="images/Darkness/darkness/button-barracks.jpg" name="image5" border="0" width="126" height="30"></a><a href="add-link-here" onmouseover="changeImages('image2', 'image2on')" onmouseout="changeImages('image2', 'image2off')"><img src="images/Darkness/darkness/button-account.jpg" name="image2" border="0" width="79" height="30"></a><a href="add-link-here" onmouseover="changeImages('image3', 'image3on')" onmouseout="changeImages('image3', 'image3off')"><img src="images/Darkness/darkness/button-forum.jpg" name="image3" border="0" width="103" height="30"></a><a href="add-link-here" onmouseover="changeImages('image4', 'image4on')" onmouseout="changeImages('image4', 'image4off')"><img src="images/Darkness/darkness/button-submit.jpg" name="image4" border="0" width="78" height="30"></a><a href="add-link-here" onmouseover="changeImages('image18', 'image18on')" onmouseout="changeImages('image18', 'image18off')"><img src="images/Darkness/darkness/button-about.jpg" name="image18" border="0" width="107" height="30"></a>
5) to modify the links all you need to do is change the text 'add-link-here' to the page you want the button linked to.
If you have any problems with these modifications you can copy and paste the 'header.txt' into your header style. Just remember to backup your old one first.
Linear Mode
