Place your message here

Your Guide to Professional
Web Site Design and Development

Web Development
HTML Codes
HTML Tips
Javascript Snippets
216 Safe Colors
Symbols
Web Directory
Web Resources
Internet Channels

Web Development: Business, Advertising, Internet Marketing, Promotion and Web Site Design

| Web Development | HTML Codes | HTML Tips | Javascript Snippets | 216 Safe Colors | Symbols | Recommendations |

Use JavaScript to Enable Your Affiliates to Generate a Custom Affiliate Link

By William Bontrager

When I started writing this article, it was going to be a tutorial on how to implement the custom affiliate link generation we have for Master Series affiliates. But when I started writing the tutorial, I realized there was a much easier way.

This presents the easier way.

Simply make a form with textarea or input fields that contain the affiliate links, assuming affiliate code: XXXXX

Give the form a name. It can be any name, so long as it has a name.

Somewhere within the form, put an input field for your affiliates to type in their affiliate code (the name of this input field must be "AffCode") and a button for them to click. When they click the button, the JavaScript will scan your textarea and input fields and replace every XXXXX code with the affiliate code provided.

Here is an example form:

<form name="me">
<p>
Type your affiliate code in the box and click the button:
<input type="text" name="AffCode" size="17">
<input type="button"
   value="Personalize links with my affiliate code"
   onClick="CreateAffiliateLink(this.form)">
</p>
<p>
Image link:<br>
<textarea name="a" cols="46" rows="3" wrap="off">
<a href="http://willmaster.com/master/#XXXXX
<img src="http://willmaster.com/image.jpg">
</a>
</textarea>
</p>
<p>
An ezine text link:<br>
<input type="text" name="b" size="46"
   value="http://willmaster.com/master/#XXXXX">
</p>
</form>

That's the form. The JavaScript is a simple copy and paste:

<script type="text/javascript" language="JavaScript">
<!-- Copyright 2003 Bontrager Connection, LLC
function CreateAffiliateLink(F) {
  var findstring = "XXXXX";
  var ts='var replacewith=document.'+F.name+'.AffCode.value';
  eval(ts);
  if(replacewith.length < 1) { return; }
  var re = new RegExp(findstring,"g")
  for(i=0;i<F.length;i++) {
    var s = new String(F.elements[i].value);
    if(s.length > 0) {
      var newstr=s.replace(re,replacewith);
      F.elements[i].value = newstr;
    }
  }
}
// -->
</script>

Put the JavaScript somewhere above the form, in the BODY or HEAD section, either one.

That's all there's to it.

A working demo page is here.

Some notes:

     1. The form tag must have a name. It can be anything
        you please so long as it has one. Example:
        <form name="anyname">

     2. The form field where affiliates type in their
        affiliate code must be named "AffCode"

     3. The JavaScript will scan as many form fields as
        your form has and replace each XXXXX with the
        affiliate code provided by the affiliate. Then the
        custom link can be copied and pasted into place
        wherever the affiliate wants it.

     4. Once replaced, the XXXXX is gone, so if another
        affiliate code generation is desired the page must
        be reloaded first to get the XXXXX back.

The working demo here has instructions for both JavaScript enabled and JavaScript disabled browsers, so all affiliates can get the code. The first is within a SCRIPT tag and the second is within a NOSCRIPT tag.

Will Bontrager

About the Author:

William Bontrager Programmer/Publisher, "WillMaster Possibilities" ezine mailto:possibilities@willmaster.com

Are you looking for top quality scripts? Visit Willmaster and check out his highly acclaimed Master Series scripts. Some free, some for a fee.

Back