Table of Contents | ||
---|---|---|
|
Introduction
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.
Syntax:
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> |
UCJavascript Sample Content
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
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<script type="text/javascript" src="https://secure.ultracart.com/cgi-bin/UCJavaScript?merchantid=DEMO&type=count"></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. |
...
Replace the DEMO merchant ID with your own.
Show Inventory
...
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<script type="text/javascript" src="https://secure.ultracart.com/cgi-bin/UCJavaScript?merchantid=DEMO&type=inventory&itemid=ITEMID"></script> |
...
Info | ||
---|---|---|
| ||
Please note that when you are viewing pages that have the "show inventory" script in them and you're viewing the page from the same browser in which you are logged into the UltraCart back-end, you'll see the inventory displayed with the Distribution Center code. The DC code that you will see in front of the inventory count will not appear to regular customers browsing the page. |
...
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:
...