Tweet
First off, you'll need to modify the image sizing to fit some styles, but I have great results with 500x75 on default,which is a very favorable banner size for ads/announcements/etc... Secondly, I encourage you to use Glenn's advice on moving the search box to main nav bar - HERE - It gives you more room and a cleaner look for the banner.
I did this because I found NO rotating banner for VB5 and the ones for VB3/VB4 wouldn't port properly. It's not perfect, but it'll do the job for most people. This will place the banner at the right hand side of the header across from the site logo. If your logo is large, you'll need to shrink the banner to accommodate. This will randomize the image list, showing a random image with each page refresh. As it's in a global template, it's visible to guests and admins alike. To edit images in the future, just replace the image in the folder via FTP and it'll automatically update. If you need to make a coding change (image name or link), you will have to revisit the header template.
1) - Create a directory on your server to host the image files.
2) - Put your banner images in there and name them something unique.
3) - Go to Styles >> Style Manager
4) - In the "Choose Action" drop down select "Edit Templates" for the style you wish to modify.
5) - When the page refreshes, scroll down the list of default style templates until you see "header".
6) - Click header to highlight it and then click Customize (if file is unedited) or Edit (if it's been modified).
7) - When the template editor opens, scroll through the code to around line 368 or so and you'll see "<div class="toolbar">"
8) - Create a new line under that entry and add the following code:
9) - Save the template and visit your site to see if you like the placement.
I did this because I found NO rotating banner for VB5 and the ones for VB3/VB4 wouldn't port properly. It's not perfect, but it'll do the job for most people. This will place the banner at the right hand side of the header across from the site logo. If your logo is large, you'll need to shrink the banner to accommodate. This will randomize the image list, showing a random image with each page refresh. As it's in a global template, it's visible to guests and admins alike. To edit images in the future, just replace the image in the folder via FTP and it'll automatically update. If you need to make a coding change (image name or link), you will have to revisit the header template.
1) - Create a directory on your server to host the image files.
2) - Put your banner images in there and name them something unique.
3) - Go to Styles >> Style Manager
4) - In the "Choose Action" drop down select "Edit Templates" for the style you wish to modify.
5) - When the page refreshes, scroll down the list of default style templates until you see "header".
6) - Click header to highlight it and then click Customize (if file is unedited) or Edit (if it's been modified).
7) - When the template editor opens, scroll through the code to around line 368 or so and you'll see "<div class="toolbar">"
8) - Create a new line under that entry and add the following code:
Code:
<div align="right">
<script language="JavaScript">
function your_banner(){
var myimages=new Array()
//Add Banner images below. Add as many as you'd like.
myimages[1]="http://www.yoursite.com/yourfolder/your_banner_1.png"
myimages[2]="http://www.yoursite.com/yourfolder/your_banner_2.png"
myimages[3]="http://www.yoursite.com/yourfolder/your_banner_3.png"
//Add link to image below. Correspond bracketed ID.
var imagelinks=new Array()
imagelinks[1]="http://www.youbanner1link.com"
imagelinks[2]="http://www.youbanner2link.com"
imagelinks[3]="http://www.youbanner3link.com"
var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>')
}
your_banner()
</script>
</div>
Comment