...
Warning |
---|
This code is really old. It was written before JSON, REST, and all the other modern means of dynamically displaying prices. Most of your javascript needs can be met these days by the REST APIs. |
Using the UCJavaScript URL you can include some dynamic information about the cart and item inventory on your static website.
...
<script type="text/javascript">
.....
</script>
JSON Cart
For the extreme case where you cannot run a proxy and need to dynamically display an UltraCart shopping cart on a third party site, you may request a REST cart object.
...
https://secure.ultracart.com/cgi-bin/UCJavaScript?merchantid=DEMO&type=json&cartvar=my_cart&callback=function_to_run
Parameter | Comment |
---|---|
merchantId | Your merchant id. |
type | "json". always. Always put "json" |
cartvar | The name of the cart variable. This will be a global variable. |
callback | A function that should be run. The code will return with bootstrap code to call that function. |
...
Example
Code Block | ||||
---|---|---|---|---|
| ||||
<script type='text/javascript'> function display_cart(){ if(my_cart){ var total = my_cart.totalLocalizedFormatted; // make it pretty var itemCount = my_cart.items ? my_cart.items.length : 0; // now do something with these values... } } </script> <script type='text/javascript' src='//secure.ultracart.com/cgi-bin/UCJavaScript?merchantid=DEMO&type=json&cartvar=my_cart&callback=display_cart'></script> |
...
Code Block | ||
---|---|---|
| ||
var my_cart = { "merchantId": "DEMO", "items": [], "cartId": "806F511B57E2D90153D30FF833020A00", "paymentMethod": "Unknown", "creditCardTypes": ["AMEX", "Diners Club", "Discover", "JCB", "MasterCard", "VISA"], "creditCardType": "", "creditCardNumber": "", "creditCardExpirationMonth": 0, "creditCardExpirationYear": 0, "creditCardVerificationNumber": "", "collectCreditCardVerificationNumber": true, "purchaseOrderNumber": "", "billToFirstName": "", "billToLastName": "", "billToTitle": "", "billToCompany": "", "billToAddress1": "", "billToAddress2": "", "billToCity": "", "billToState": "", "billToPostalCode": "", "billToCountry": "United States", "billToDayPhone": "", "billToEveningPhone": "", "email": "", "emailConfirm": "", "shipToFirstName": "", "shipToLastName": "", "shipToTitle": "", "shipToCompany": "", "shipToAddress1": "", "shipToAddress2": "", "shipToCity": "", "shipToState": "", "shipToPostalCode": "", "shipToCountry": "United States", "shipToPhone": "", "shipToEveningPhone": "", "shippingMethod": "", "needShipping": false, "subtotal": 0, "subtotalDiscount": 0, "subtotalWithDiscount": 0, "taxRate": 0, "tax": 0, "taxableSubtotal": 0, "taxableSubtotalDiscount": 0, "taxableSubtotalWithDiscount": 0, "shippingHandling": 0.00, "shippingHandlingDiscount": 0, "shippingHandlingWithDiscount": 0.00, "giftCharge": 0, "giftWrapCost": 0.00, "gift": false, "surcharge": 0, "total": 0, "buysafeBondAvailable": false, "buysafeBondFree": false, "buysafeBondWanted": true, "taxExempt": false, "shipToResidential": true, "mailingListOptIn": true, "specialInstructions": "", "screenBrandingThemeCode": "CSTM", "advertisingSource": "", "coupons": [], "hasPayPal": false, "payPalCompatible": false, "hasGoogleCheckout": false, "googleCheckoutCompatible": false, "loggedIn": false, "insureShipAvailable": false, "insureShipSeparate": false, "insureShipWanted": false, "taxCounty": "", "liftGate": false, "storeCreditCard": false, "hasAmazon": false, "needPayment": true, "currencyCode": "USD", "subtotalLocalized": 0.00, "subtotalDiscountLocalized": 0.00, "subtotalWithDiscountLocalized": 0.00, "taxLocalized": 0.00, "taxableSubtotalLocalized": 0.00, "taxableSubtotalDiscountLocalized": 0.00, "taxableSubtotalWithDiscountLocalized": 0.00, "shippingHandlingLocalized": 0.00, "shippingHandlingDiscountLocalized": 0.00, "shippingHandlingWithDiscountLocalized": 0.00, "giftChargeLocalized": 0.00, "giftWrapCostLocalized": 0.00, "surchargeLocalized": 0.00, "totalLocalized": 0.00, "subtotalLocalizedFormatted": "$0.00", "subtotalDiscountLocalizedFormatted": "$0.00", "subtotalWithDiscountLocalizedFormatted": "$0.00", "taxLocalizedFormatted": "$0.00", "taxableSubtotalLocalizedFormatted": "$0.00", "taxableSubtotalDiscountLocalizedFormatted": "$0.00", "taxableSubtotalWithDiscountLocalizedFormatted": "$0.00", "shippingHandlingLocalizedFormatted": "$0.00", "shippingHandlingDiscountLocalizedFormatted": "$0.00", "shippingHandlingWithDiscountLocalizedFormatted": "$0.00", "giftChargeLocalizedFormatted": "$0.00", "giftWrapCostLocalizedFormatted": "$0.00", "surchargeLocalizedFormatted": "$0.00", "totalLocalizedFormatted": "$0.00", "baseCurrencyCode": "USD" }; if (display_cart) { display_cart(); } |
...
JavaScript Links
Show cart total item count
...
Replace the DEMO merchant ID with your own .
Show cart total amount
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<script type="text/javascript" src="https://secure.ultracart.com/cgi-bin/UCJavaScript?merchantid=DEMO&type=total"></script> |
Replace the DEMO merchant ID with your own.merchant ID. IF you are using a storefront, make sure that the host address represents your storefront host (replace the "secure.ultracart.com" with the storefront host, such as "demo.ultracartstore.com" for the DEMO account.)
Show cart total amount
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<script type="text/javascript" src="https://secure.ultracart.com/cgi-bin/UCJavaScript?merchantid=DEMO&type=total"></script> |
Replace the DEMO merchant ID with your own merchant ID. IF you are using a storefront, make sure that the host address represents your storefront host (replace the "secure.ultracart.com" with the storefront host, such as "demo.ultracartstore.com" for the DEMO account.)
Tip |
---|
For the count and total links above, add document.write('<span class="ucJsCount ucJsEmpty"><!-- No Cart Found -->No Items</span>'); For the count, the span will have a class of ucJsCount. |
...
Tip |
---|
If you have a custom SSL certificate, you should replace secure.ultracart.com in any of the above links with your secure host name. |
...
...
Example Shopping Cart summary
Below is a simple example of the snippet of code that displays the customers current shopping cart details on your store web pages:
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<form method="post" action="http://secure.ultracart.com/cgi-bin/UCEditor"> <input type="hidden" name="merchantId" value="DEMO" /> <table class="uc-cart-summary" border="1"> <tr class="uc-cart-summary-details"> <td class="uc-cart-item-count-label"> <script type="text/javascript" src="https://secure.ultracart.com/cgi-bin/UCJavaScript?merchantid=DEMO&type=count"></script> | cart total: <script type="text/javascript" src="https://secure.ultracart.com/cgi-bin/UCJavaScript?merchantid=DEMO&type=total"></script> <input type="submit" name="submit" value="checkout" /> </td> </tr> </table> </form> |
Example Shopping Cart summary with Cart image
Here is sample code using a custom cart image, replacing the form code with simple hyperlink:
Code Block | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
| Items: <script type="text/javascript" src="https://secure.ultracart.com/cgi-bin/UCJavaScript?merchantid=DEMO&type=count"></script> | Total: <script type="text/javascript" src="https://secure.ultracart.com/cgi-bin/UCJavaScript?merchantid=DEMO&type=total"></script> | <a href="http://secure.ultracart.com/cgi-bin/UCEditor?merchantId=DEMO"><img src="http://secure.ultracart.com/cgi-bin/UCGraphic?merchantId=DEMO&ThemeCode=Z&Filename=cart" name="Shopping Cart" width="25" height="23"></a> | |
Replace the DEMO merchant ID with your own.
You can combine the cart summary with a buy form that has the "sendtourl" redirect parameter to create a order process where the customer adds items to the shopping cart but stays on your page until they are ready to checkout out. See the following page for details:
...