| NOP's Free Shopping CartVersion 4.4.0
	
         
        Have you ever wanted to put up a simple store front, but not had CGI access to do it, or wish to lower your server
        overhead?  Then this free JavaScript shopping cart is exactly what you need.  Every browser supports JavaScript 
        these days, and with the use of NOSCRIPT tags, those very few who have turned it off are alerted to re-enable it during the duration 
        of their shopping experience.  This script also features the ability to have your products on many pages -- you do not
        have to have all of your products on one page, like so many of the other solutions.  This complete, simple
        to use shopping cart is easy to implement on almost any site.  All that is required is pasting in the source
        code on every page that you can purchase products from, and on the final checkout page.
         
        Who uses this shopping cart?  Hundreds of sites on the Internet, just a few of which are:
         
             Crystal Star (English, Dollar, Version 4.x, secure server)
             shop.cefpi.org (English, Dollar, Version 4.2.2, secure server, authorize.net)
             www.sanctuaryoncamelback.com (English, Dollar, Version 4.2.2, secure server, authorize.net)
             www.mor-israel.com (Hebrew, ₪, Version 4.x)
             Street Trend (English, Pound, Version 4.x)
	          Rude Stuff (English, Dollar, Version 4.x)
             koopjes.spikecity.net (Dutch, Pound, Version 4.x)
             Noé - La e-N@vigation (French, Mark, Version 4.x)
	          www.chscomputer.it (Italian, Version 4.x)
             www.SportsMedShop.com (English, Dollar, Version 3.0)
             Green Bird Incense (English, Dollar, Version 4.x)
             Direct 2 U (English, Dollar, Version 4.x)
             www.sinkbox.com (English, Dollar, Version 4.x)
             www.uwsite.nl (Dutch, Dollar, Version 4.x)
             www.saffrongold.f9.co.uk/ (English, Pound, Version 4.x)
            
             Official FreeCart Demo Store (English, Dollar, Version 4.x)
         
 Features at a glance:
     Client-side scripting -- no CGI required
     Secure servers with CGI or PHP supported if available
     Multiple product pages -- no limits
     Product quantity selection
     Complete 'Manage Cart' page
     Product ID, Name/Description, and amounts passed   
     Shipping Costs
     Multiple Additional information fields (ie. color, size, etc) - Enhanced in version 4.4!
     Regional Tax Costs - New version 4.3!
     Configurable for almost every currency type.
     Minimum order, configure a minimum purchase amount before users are allowed to checkout  - New version 4.3!
     19 Languages Supported!
    
        English
        Brazilian (thanks to Jane Araújo for the translation!)
        Chinese [Traditional Chinese in Big5 Encoding] (thanks to C.J. Ho from SunnyFactory for the translation!)
        Czech   (thanks to Jan Egert for the translation!)
        Danish  (thanks to Glenn Jensen for the translation!)
        Dutch   (thanks to Ron A.J. Hartendorp of Computer Network Services, and pra@xidis.com for the translation!)
        Finnish (thanks to Mikko Lähteenmäki aka "ifreq" for the translation!)
        French  (thanks to Fred from noe.master.online.fr for the translation!)
        German  (thanks again to Ron A.J. Hartendorp of Computer Network Services and Angela Stascheit for the translation!)
        Hebrew  (thanks to Mr. Eliezer Tavor / MOR / Web-Master for the translation!)
        Hungarian (thanks to Robert Horvath for the translation!)
        Italian (thanks to Colomela Francesco for the translation!)
        Malay   (thanks to bennyong from www.hostonfire.com for the translation!)
        Norwegian (thanks to Thomas A. Amundsen of graphic.no for the translation!)
        Polish  (thanks to Archmag for the translation!)
        Romanian (thanks to Florin B for the translation!)
        Slovak   (thanks to Jaro Nemcok for the translation!)
        Spanish (thanks to Capitán Nemo Comunicaciones for the translation!)
        Swedish (thanks to Artur Stensson for the translation!)
     3rd Party Payment Processor Support
       
           Authorize.net
           WorldPay
           LinkPoint
        Ready to use the script?Most of us learn by example, so I recommend downloading the fully working sample site, and reading the posts in the Support Forums.
For those looking for a more complete description, there are a few easy steps to follow to run the shopping cart:
 
	 Download the cart here:
	
     Uncompress the shopping cart with a zip file decompressor.  If you do not have one, head over to www.winzip.com to get one. 
     Configure the script options, if you wish. To configure the options, open up the file nopcart.js in your favorite text editor.  I recommend notepad under Windows, or kwrite under Linux. The following options are configurable:
    Options For Everyone:
 
 
      Display Notice:Controls whether the user is provided with a popup letting them know their product is added to the cart.  
    
      Display Shipping Column:Controls whether the managecart and checkout pages display individual shipping cost columns for each product.  Set this to 'true' if each product you sell has it's own shipping cost associated with it.
     
      Display Shipping Row: Controls whether the managecart and checkout pages display a row at the bottom of the table for shipping cost totals.
     
      Display Tax Row: Controls whether the managecart and checkout pages display tax cost total row at the bottom of the table.
     
      Tax Rate: Your area's current tax rate, ie: if your tax rate was 7.5%, you would set Tax Rate = 0.075. You can set this to 0.0 if you do not wish tax to be calculated.
     
      Tax By Region: Turning this option on makes your shopping cart prompt users for information to determine if they should be charged tax.  For example, if your store is in Arizona, USA you only need to charge tax to Arizona residents, so you can set this option to allow you to collect tax only from Arizona residents.
      Tax Prompts: The messages that users are prompted with are configurable.
      MinimumOrder: number, the minium dollar amount that must be purchased before a user is allowed to checkout.  Set to 0.00 to disable.
      MinimumOrderPrompt: string, Message to prompt users with when they have not met the minimum order amount.
      Monetary Symbol: The symbol which represents dollars/euro, in your locale. 
     PaymentProcessor:  The two digit processor code. Support payment processor codes are:
      Options For Programmers: (Most people won't use these) Authorize.net (an)
       Worldpay      (wp)
       LinkPoint     (lp)
      
 
     You will see these options near the top of the file.  Each option is either true/false, a string, or a number.  For true/false fields, you must enter either
    true or false, replacing the existing option.  For string options, enter in any text you wish between the single quotes.  This can include HTML tags, or escape characters.  For number fields, simply 
    enter the number you wish. OutputItem<...>: The name of the pair value passed at checkout time.  Change these only if you are connecting to a CGI   
       script and need other field names, or are using a secure service that requires specific field names.                               
      AppendItemNumToOutput: true/false, if set to true, the number of each ordered item will be appended to the output string.  For     
       example if OutputItemId is 'ID_' and this is set to true, the output field name will be 'ID_1', 'ID_2' ... for each item.       
      HiddenFieldsToCheckout: true/false, if set to true, hidden fields 
      for the cart items will be passed TO the checkout page, from the  
      ManageCart page.  This is set to true for CGI/PHP/Script based    
      checkout pages, but should be left false if you are using an      
      HTML/Javascript Checkout Page. Hidden fields will ALWAYS be       
      passed FROM the checkout page to the Checkout CGI/PHP/ASP/Script  
	 On each page you wish to sell products from, or display the cart, include the lines: 
 
<SCRIPT SRC="language-en.js"></SCRIPT>
<SCRIPT SRC="nopcart.js">
  //=====================================================================||
  //               NOP Design JavaScript Shopping Cart                   ||
  //---------------------------------------------------------------------||
  //       Visit NOP Design at http://www.nopdesign.com/freecart         ||
  //=====================================================================||
</SCRIPT>
You can change the language that NOPCart uses by including different language packs in the first line.  The available language packs are: 
    English:   language-en.js
    Brazilian: language-br.js
    Chinese [Traditional Big5 Encoded]: language-cb5.js
    Czech:     language-cz.js
    Danish:    language-dk.js
    Dutch:     language-nl.js
    Finnish:   language-fi.js
    French:    language-fr.js
    German:    language-ge.js
    Hebrew:    language-il.js
    Hungarian: language-hu.js
    Italian:   language-it.js
    Malay:     language-my.js
    Norwegian: language-no.js
    Polish:    language-pl.js
    Romanian:  language-ro.js
    Slovak:    language-sk.js
    Spanish:   language-sp.js
    Swedish:   language-se.js
 
Don't worry -- none of this text will be visible to users on your site.  The only way you'll see this is if you choose 'view source' on a page.  It's important you include this line, since it instructs the browser to load the shopping cart file. 
 Don't forget to include the proper relative path to the nopcart.js file if your files are not all in the same directory!
 For each product you wish to sell, create a small FORM tag with:
			 Price
			 Name or Short Description
			 Product ID or Part Number
             Shipping Cost
             Additional Information (Up to 4)
		 This form will look something like:
 
    <!--Shopping Cart Product Begin-->
    <P><FORM NAME=order>
    Quantity: 
    <input type=text size=2 maxlength=3 name=QUANTITY onChange='this.value=CKquantity(this.value)' value="1">    
    <input type=hidden name="PRICE" value="19.95">
    <input type=hidden name="NAME" value="My Sample Product">
    <input type=hidden name="ID_NUM" value="Sample ID 001">
    <input type=hidden name="SHIPPING" value="5.95">
    Select a color: 
    <select name=ADDITIONALINFO>
        <option value="Red">  Red
        <option value="Blue"> Blue
        <option value="White">White
    </select>
    Select a size: 
    <select name=ADDITIONALINFO2>
        <option value="Small">  Small
        <option value="Medium"> Medium
        <option value="Large">Large
    </select>
    <input type=button value='  Add to Cart  ' onClick='AddToCart(this.form)'>
    <a href="managecart.html">Check out now</a>
    </FORM>
    <!--Shopping Cart Product End  -->
	Of course you will replace the 'value=' section with the information for your product.  
    If you do not have any additional information to prompt for (ie. Size, Color, Style, etc.), 
    or do not wish to charge for shipping simply leave those fields off the form.
    If you wish to have the cart go directly to a manage cart page when a product is added, just replace the FORM tag like this: 
    <FORM NAME=order ACTION="managecart.html"> -- of course replacing managecart.html with the name of your managecart page.
	
   
   Setup a 'manage cart' page. All you have to do is add the following line into
	your HTML page to have the shopping cart displayed, and the form elements written into the page: 
    
    <!--Shopping Cart ManageCart Begin-->
    The items listed below are currently in your shopping cart:
    <p>
    <FORM ACTION="checkout.html" METHOD="GET" onsubmit="return ValidateCart(this)">	
    <SCRIPT>
        ManageCart();
    </SCRIPT>
    
    <INPUT type=SUBMIT value="   Check Out   ">
    </FORM>	
    <!--Shopping Cart ManageCart End  -->
    
    Make sure to specify the correct location of your checkout page as the FORM ACTION.  For example, if your checkout page
    was on a secure server (www.secure.com), named checkout.cgi, and could accept POST mode, your FORM tag would be: 
    <FORM ACTION="https://www.secure.com/checkout.cgi" METHOD="POST"  onsubmit="return ValidateCart(this)">
    Most user's will not use CGI based checkout pages, but if you do, make sure to set the HiddenFieldsToCheckout option to true.
    Setup a checkout page. If you have a secure server, and CGI access, the form action on this page should point at it. 
    If you are accepting credit card numbers, a secure server really should be used. If you have CGI access, place the file checkout.pl 
    into your cgi-bin directory, and point the FORM ACTION from this checkout page to it. If you don't have CGI, but you can access scripts, place the file checkout.php on your server, and point the FORM ACTION from the checkout page to it.  
    This checkout script (either Perl or PHP)  will write all of your 
    orders to a CSV file which can be viewed by Microsofy Excel, or Sun Star Office -- as well as send both a confirmation email to you and
    your customer(s).   To set the location of this file, and your E-Mail address, simply open the checkout.pl or checkout.php file in a text editor, and read the options at the top. 
    Your checkout page is going to look something like:
     
     
    
    <!--Shopping Cart Checkout Begin-->
    The items listed below are currently in your shopping cart:
    <p>
    <FORM ACTION="/cgi-bin/checkout.pl" METHOD="POST">	
    <SCRIPT>
        CheckoutCart();
    </SCRIPT>
    
    Name:    <input type="text" name="b_first"> <input type="text" name="b_last">
    Email:   <input type="text" name="b_email">
      ... Your other form data here...
    <INPUT type=SUBMIT value="   Submit Order   ">
    </FORM>	
    <!--Shopping Cart Checkout End  -->
    
    If you do not have your own CGI or PHP capability, then use your ISP's 'formmail' or 'mailto' scripts.  Most EVERY ISP has one available for you
    to use.  Your checkout page will look exactly the same, except for the FORM ACTION, and any 'hidden' fields your ISP will tell you about. 
    In most cases, your form action will look something like: <FORM ACTION="/cgi-bin/formmail" METHOD="POST">
    
    At this point,most of you are done!
 
    If you are absolutely sure you have no mail script available, you can use the FORM line 
    <FORM ACTION="mailto:spam@nopdesign.com" ENCTYPE="text/plain"> where the email address
    is your own. This syntax will not work with some browsers/aol.  Do not write me about this not working, or opening up a blank email....
     
    Do you use a payment processor/gateway?  If so -- this section is just for you.  Here are some sample checkout pages for the
       supported payment processors.  Remember to configure your nopcart.js script to use the payment processor you have selected first!!
       Also, check with your processor to make sure you have the most current FORM ACTION line.  This section is provided as a reference,
       and should get you started.  There are more options that the documentation your payment processor provided will explain.  
        
          (Optional) Include a "No JavaScript" warning in your pages.  This will alert users without Javascript that they should
    update their browsers before returning to your store. LinkPoint
    
   <FORM ACTION="https://secure.linkpt.net/lpcentral/servlet/lppay" METHOD="POST">	
      <SCRIPT>
         CheckoutCart();
      </SCRIPT>
   <INPUT type="hidden" name="storename" value="--ENTER YOUR STORE ID HERE--">	
   <INPUT type=submit value="Proceed to payment">
   </FORM>	
   
 WorldPay
    
   <FORM ACTION="https://select.worldpay.com/wcc/purchase" METHOD="POST">	
      <SCRIPT>
         CheckoutCart();
      </SCRIPT>
   <input type=hidden name="instId" value="--ENTER WORLDPAY ID HERE--">
   <input type=hidden name="currency" value="USD">
   <input type=hidden name="testMode" value="0">
   <input type=hidden name="cartId" value="WebPurchase">
   <INPUT type=submit value="Proceed to payment">
   </FORM>	
   
 Authorize.net
    
   <FORM ACTION="https://secure.authorize.net/gateway/transact.dll" METHOD="POST">	
      <SCRIPT>
         CheckoutCart();
      </SCRIPT>
   <INPUT TYPE=HIDDEN NAME="x_Login" VALUE="--ENTER YOUR ID HERE--">
   <INPUT type=submit value="Proceed to payment">
   </FORM>	
    
     
    
    <NOSCRIPT>
    Whoops, we detected that your browser does not have JavaScript, or it is disabled.  Our product catalog
    requires that you have JavaScript enabled to order products.  <a href="http://www.netscape.com">Netscape</a>
    and <a href="http://www.microsoft.com/ie">Microsoft</a> offer free browsers which support JavaScript.
    If you are using a JavaScript compliant browser and still have problems, make sure you have JavaScript enabled in
    your browser's preferences.
    </NOSCRIPT>
    
 Changing the look of the managecart or checkout pageYou can use cascading style sheets to format the mangecart page table with no modifications to the code at all.  These are
the classes embedded into the checkout page, and what they are used for:
nopcart - This is the class for the main table.  You can specify borders, background colors, etc here.
nopheader - This class is used for the descriptive headers of the shopping cart table.
nopentry - This class is used for each product entry in the user's shopping cart.
noptotal - This class is used for the rows displaying the users subtotal, shipping and total costs.
 
 Looking for some samples?Then head on over to our demo store at http://www.shop.nopdesign.com.  
If you wish to download the entire site so you can view all the source or modify it to use for your site, download the file:  samplesite.zip.
 Licensing?This code is Free!  That means commercial or non-commercial use.  About the only thing I ask is that you don't claim that you wrote it. If you
want to put it on a CD and distribute it, that's okay too.  You do not have to display a logo, or a link back to NOP Design, but if you would like to, 
here is an image you can use to link back to www.nopdesign.com, or www.nopdesign.com/freecart.
  
 Support?NOP Design provides limited support with the free shopping cart.  
The best place to get help are the Support Forums.  We do read these, and your questions will get answered as soon as possible.  Typically, it takes one to two weeks to get a detailed response.  Your questions may already be on there as well -- please check before posting a new thread.
That's all there is to it.  Have fun, and happy shopping!
 
 
_Scott
 
 
Looking for more scripts?  Try these sites:ScriptSearch.com | A1 Javascripts | JavaScript Kit | Jan-s Script Portal
 |