TagBot Templates from ISDN*tek

Menu Buttons for your Store or ME page.

Javascript code works on eBay and major new browsers.

Up to fifteen buttons per menu, stackable.

Choose from five different 3D button colors.

Buttons have visual rollover and click effects.

Select fonts and text colors.

Copy these buttons or use your own button blanks.

Copy the above buttons to your web host, and also into the TagBot "backgrounds" directory or into the same directory as the template, if you would like to see them while designing your menu.

MenuButtonColumn.tpl

[TagBot$Learn more about the designer of this Template =http://members.ebay.com/aboutme/shipscript][TagBot$IrfanView Free Desktop Image Editor =http://www.irfanview.com][TagBot$Free Online Image Editor =http://www.imagetweak.net][TagBot~INSTRUCTIONS: =
This is column of visually-tactile buttons created with javascript. It uses two button images. To preview this template, dbl-click the export tab. These Buttons have been tested on FireFox 1, Internet Explorer 6, Netscape7, Opera 7,  and eBay.

The exported code should be inserted wherever your buttons are to appear, typically within a table.

The template references several blank buttons that you may save to your own host, or you can make your own blank buttons. Buttons can be made quite easily out of any background tiles using IrfanView (click the help menu to download a free copy of the program). Use IrfanView's menu "Image > Effects > 3D Button" to add the shadows and save the image as the "up" button. Then flip the button 180 degrees and save it as the "down" button, using "Image > Rotate right > Rotate right."

This program will make up to fifteen buttons.  Leave unused button labels blank. If you need more buttons, you can make two menus and stack them together. Or you can add the extra buttons to the list in the exported code.

When labeling the buttons, do not use quotes in the label, as quotes are used by the javascript code. The code will default to open the menu links in the same browser window, or you can choose the option to open in a new window.

A clear gif image is used by the script as a landing place for mouse clicks. The URL is currently eBay's clear gif for auction pages. Use your own copy of the image if the menu will be on your own website.

You may choose font attributes for the buttons. If you use a fancy font that few other users will have on their machines, then add a second and maybe third font choice to the list, separating each choice with a comma.

]
[TagBot$More Buttons =http://www.isdntek.com/tagbot/backgrounds/_buttonlist.htm]
[TagBot$Backgrounds =http://www.isdntek.com/tagbot/backgrounds/_tilesheet.htm]

// -------------------------------------------- 
//     You may have any number of buttons.
//     Leave unused button labels blank.
//     Notice the quotation marks surrounding the 
//     labels. Do not use quotes inside the label.
//     Links can open in the same window or a new 
//     window.
// -------------------------------------------- 
var BtnLabel=new Array()   //-- don't edit this line
var BtnLink=new Array()    //-- don't edit this line

BtnLabel[1] ="[TagBot!Button Label 1 =ClicPic]"[TagBot?Link1:Link 1 =http://www.isdntek.com/clicpic.htm]
BtnLabel[2] ="[TagBot!Button Label 2  =RagTag]"[TagBot?Link2:Link 2  =http://www.isdntek.com/ragtag.htm]
BtnLabel[3] ="[TagBot!Button Label 3  =Rainbow]"[TagBot?Link3:Link 3  =http://www.isdntek.com/rainbow.htm]
BtnLabel[4] ="[TagBot!Button Label 4  =TagBot]"[TagBot?Link4:Link 4  =http://www.isdntek.com/tagbot.htm]
BtnLabel[5] ="[TagBot!Button Label 5  =button 5]"[TagBot?Link5:Link 5  =http://www.isdntek.com/etools.htm]
BtnLabel[6] ="[TagBot!Button Label 6  =button 6]"[TagBot?Link6:Link 6  =http://www.isdntek.com/etools.htm]
BtnLabel[7] ="[TagBot!Button Label 7  =button 7]"[TagBot?Link7:Link 7  =http://www.isdntek.com/etools.htm]
BtnLabel[8] ="[TagBot!Button Label 8  =]"[TagBot?Link8:Link 8  =http://www.isdntek.com/etools.htm]
BtnLabel[9] ="[TagBot!Button Label 9  =]"[TagBot?Link9:Link 9  =http://www.isdntek.com/etools.htm]
BtnLabel[10]="[TagBot!Button Label 10 =]"[TagBot?Link10:Link 10 =http://www.isdntek.com/etools.htm]
BtnLabel[11]="[TagBot!Button Label 11 =]"[TagBot?Link11:Link 11 =http://www.isdntek.com/etools.htm]
BtnLabel[12]="[TagBot!Button Label 12 =]"[TagBot?Link12:Link 12 =http://www.isdntek.com/etools.htm]
BtnLabel[13]="[TagBot!Button Label 13 =]"[TagBot?Link13:Link 13 =http://www.isdntek.com/etools.htm]
BtnLabel[14]="[TagBot!Button Label 14 =]"[TagBot?Link14:Link 14 =http://www.isdntek.com/etools.htm]
BtnLabel[15]="[TagBot!Button Label 15 =]"[TagBot?Link15:Link 15 =http://www.isdntek.com/etools.htm]

BtnLink[1] = "[TagBot?Link1]"
BtnLink[2] = "[TagBot?Link2]"
BtnLink[3] = "[TagBot?Link3]"
BtnLink[4] = "[TagBot?Link4]"
BtnLink[5] = "[TagBot?Link5]"
BtnLink[6] = "[TagBot?Link6]"
BtnLink[7] = "[TagBot?Link7]"
BtnLink[8] = "[TagBot?Link8]"
BtnLink[9] = "[TagBot?Link9]"
BtnLink[10]= "[TagBot?Link10]"
BtnLink[11]= "[TagBot?Link11]"
BtnLink[12]= "[TagBot?Link12]"
BtnLink[13]= "[TagBot?Link13]"
BtnLink[14]= "[TagBot?Link14]"
BtnLink[15]= "[TagBot?Link15]"

// -------------------------------------------- 
//     Do you want all links to open in a new window? 
//     Insert "Y" or "N".
//     The clear gif image is where the mouse is
//     clicked. The URL is currently eBay's clear
//     gif for auction pages. Use your own image
//     for your own website.
// -------------------------------------------- 
var NewWindow = "[TagBot#Open Links in a New Window? =N|Y]"   
var ClearGif  = "[TagBot?ClearGif]"

// -------------------------------------------- 
//     Choose font attributes and number of 
//     text rows per button. 
//     Comma-delimit multiple font choices
//     starting with your preferred font first.
// -------------------------------------------- 
var RowsPerBtn= [TagBot#Text Lines per Button =1]
var FontSize  = [TagBot#Font Size (px)=14]
var FontFace  = "[TagBot#Font Style =Arial| Trebuchet MS| Comics Sans MS | Verdana], Sans-Serif, Helvetica"
var TextAlign = "[TagBot#Button-Text alignment =none|center]"  //choose "center" or "none"
var TextMargin= (BtnHt-FontSize*RowsPerBtn-4)/2

// -------------------------------------------- 
//           End of modification section.      
//           Do not edit below.         
// -------------------------------------------- 
var pos=TextAlign.indexOf("enter");
if (pos>=0){LtMargin=0}else{LtMargin=5}
var pos=NewWindow.indexOf("Y");
if (pos>=0){BtnWindow=" target=_blank"}else{BtnWindow=""}
var quot="'"
for (i = 0; i < BtnLabel.length; i++){if (BtnLabel[i]){
document.write('<tr><td valign=center style="width:'+BtnWid+'; height:'+BtnHt+';">'+
'<div style="position:relative; top:0; left:0; width:'+BtnWid+'; height:'+BtnHt+';">'+
'<img src='+BtnDnImg+' style="position:absolute; top:0; left:0; width:'+BtnWid+'; height:'+BtnHt+';visibility:hidden">'+
'<img id=Btn'+i+'Img'+BtnKey+'  src='+BtnUpImg+' border=0 width='+BtnWid+' height='+BtnHt+'>'+
'<div id=Btn'+i+'Txt'+BtnKey+'  style="position:absolute; top:0; left:0; width:'+BtnWid+'; height:'+BtnHt+'; '+
'  padding:'+TextMargin+'px; font-family:'+FontFace+'; color:'+BtnUpColor+'; '+
'  font-size:'+FontSize+'px; font-weight:bold; text-decoration:none; margin-left:'+LtMargin+'px;" >'+
'<'+TextAlign+'><span style="width:100%; height:100%; ">'+BtnLabel[i]+
'</span></'+TextAlign+'></div>'+
'<a id=GoLink'+i+BtnKey+' href='+BtnLink[i]+BtnWindow+' style="text-decoration:none;">'+
'<img src='+ClearGif+' style="position:absolute; border:0; top:0; left:0; '+
'  width:'+BtnWid+'; height:'+BtnHt+';"'+
' onMouseDown="'+
'  document.getElementById('+quot+'Btn'+i+'Txt'+BtnKey+quot+').style.padding='+quot+(TextMargin+1)+'px'+quot+'; '+
'  document.getElementById('+quot+'Btn'+i+'Img'+BtnKey+quot+').src='+quot+BtnDnImg+quot+';" '+ 
' onMouseUp="'+
'  document.getElementById('+quot+'Btn'+i+'Txt'+BtnKey+quot+').style.padding='+quot+TextMargin+'px'+quot+'; '+
'  document.getElementById('+quot+'Btn'+i+'Img'+BtnKey+quot+').src='+quot+BtnUpImg+quot+';"'+ 
' onMouseOver="document.getElementById('+quot+'Btn'+i+'Txt'+BtnKey+quot+').style.color='+quot+BtnDnColor+quot+';" '+
' onMouseOut="document.getElementById('+quot+'Btn'+i+'Txt'+BtnKey+quot+').style.color='+quot+BtnUpColor+quot+'; '+
'  document.getElementById('+quot+'Btn'+i+'Txt'+BtnKey+quot+').style.padding='+quot+TextMargin+'px'+quot+'; '+
'  document.getElementById('+quot+'Btn'+i+'Img'+BtnKey+quot+').src='+quot+BtnUpImg+quot+';"'+ 
'></a>'+
'</div></td></tr>')}
}
//-->
</script>
</table>