|
How To Expand Custom Image Header
by
24 Jan 2007
We hear it many times... "How can I make my header image expandable to screen width?" This tutorial will help you accomplish this task. Requirements:
Let's start with a 780px header image ... you can use the example image below...  Then Crop the leftside (your logo part): And save it as head_left.gif Second crop the right side of the header image as shown below: And save as head_right.gif Next select background image -just 1 or 2px width like shown below: Crop the selected part and save it as headbg.gif: Now load all the three images to the misc folder of images... Next goto admincp> styles&templates> style manager> all style options> scroll down to header Delete the existing code complete and insert the follow there: Code:
<!-- logo --> <a name="top"></a> <center> <table border="0" width="100%" cellpadding="0" cellspacing="0" align="center" style="background-image:url($stylevar[imgdir_misc]/headbg.gif)"> <tr> <td align="left" valign="top"><a href="$vboptions[forumhome].php$session[sessionurl_q]"><img src="$stylevar[imgdir_misc]/head_left.gif" border="0" alt=""/></a></td> <td align="right" valign="bottom"><img src="$stylevar[imgdir_misc]/head_right.jpg" alt="" /></td> </tr> </table> </center> <!-- /logo --> <!-- content table --> $spacer_open $_phpinclude_output |