BigCommerce – Detecting if a specific product was added to the cart or not
On this post, we would find out how to detect if a specific product was added to the cart or not. Follow the steps below to detect (and perform action) if the product is on cart or not:
- Create a new category, let’s take “special” as the category name for this tutorial.
- Go to the product’s edit page (which you want to look for) on the admin panel and assign it to the “special” category and save.
- Find the page template on which you want to detect if the product is on the cart or not under Design or using the webdav.
- Use the following jQuery code on the page template and see the magic happen
Enjoy!
P.S. The following code assumes that you’ve used
- “special” as the category name
- the code below may require adjustments based on your template, this code actually works with category pages having product links under the following selector expression:
div.ProductList li div.ProductDetails a
- block 2 assumes that your cart page’s “Cart Items” block’s links can be accessed by the following selector expression:
div.ProductName a
<script type=”text/javascript”>
// First we would try to detect if the cart item is the intro product or not, if it is deluxe, we don’t need to load all the other stuff
var product_link = “”;
$.get( “%%GLOBAL_ShopPath%%/special/”, function( data ) {
// Retrieving the product’s link to its details page
var p_htmlPage = $(data);
var p_found = $(‘.ProductList li’, p_htmlPage);
$(p_found).each(function(i, el) {
product_link = $(this).find(“div.ProductDetails a”).attr(“href”);
});
// USE THIS CODE ON CART PAGE OR CHECKOUT PAGE ONLY AND DON’T USE BLOCK 2
/*
$(“.ProductName a”).each(function(i, el){
if ($(this).attr(‘href’) == product_link) {
// Product found on cart 🙂
console.log(“Found.Item number: ” + i);
}
})
*/
// END OF CART / CHECKOUT PAGE CODE
});
// BLOCK 2
// USE THIS ON ANY PAGE EXCLUDING CART / CHECKOUT PAGE (NOT NECESSARY)
var cart_htmlPage, cart_items_found;
var cart_product_link = “”;
$.ajax({
url: “%%GLOBAL_ShopPath%%/cart.php”,
success: function(result) {
//Getting all the products from the cart
cart_htmlPage = $(result);
cart_items_found = $(‘.ProductName a’, cart_htmlPage);
$(cart_items_found).each(function(i, el) {
//Retrieving the product’s details page URL
cart_product_link = “%%GLOBAL_ShopPath%%/” + $(this).attr(“href”);
// Now comparing with the product’s URL found from category page
if (product_link == cart_product_link) {
// OK, we got it, so do what you want to do here 🙂
console.log(“Found. Item number: ” + i);
}
});
},
async: false
});
// END OF BLOCK 2
</script>
BigCommerce – Empty cart using jQuery from any page
Hi all,
At first, sorry for being missing for a long time as I was too busy with lots of stuff. Anyways, I will cut it short as you must be here for some help rather than hearing to my stupid stories.
Today, I will share the code that can remove all the selected items on cart, i.e. empty your cart. Interestingly, you can use this code in any of your template pages based on your need. It does synchronous calls, so it will remove items from the cart one by one and then exit the function. Just put the following code snippet and you would see the magic happen 🙂
Enjoy!
P.S. The cart remove links should have class=”CartRemoveLink” so that it can work, if you have it a different class assigned as per your template, you should replace the class name with “CartRemoveLink” accordingly. I have highlighted “CartRemoveLink” in the following code in red.
<script type=”text/javascript”>
var cart_htmlPage, cart_found, removeLink;
$.ajax({
url: “%%GLOBAL_ShopPath%%/cart.php”,
success: function(result) {
//Removing all the products from the cart
cart_htmlPage = $(result);
cart_items_found = $(‘a.CartRemoveLink‘, cart_htmlPage);
$(cart_items_found).each(function(i, el) {
//Retrieving the remove URL and hitting it to remove from cart
removeLink = “%%GLOBAL_ShopPath%%/” + $(this).attr(“href”);
$.ajax({
url: removeLink,
success: function(result) {
if ($(cart_items_found).length == (i+1)) {
//document.location = “/index.php”;
console.log(“Done”);
}
},
async: false
});
});
},
async: false
});
</script>
Example applied in the URL (http://store-kp2i15b.mybigcommerce.com/) [TEMPORARILY AVAILABLE ONLY FOR THE NEXT 14 DAYS]
Attaching the TopMenu.html Panel from the BigCommerce store
%%GLOBAL_OptimizerLinkScript%%
<div class=“TopMenu”>
<div class=“inner”>
<ul style=“display:%%GLOBAL_HidePurchasingOptions%%”>
<li %%GLOBAL_ShowStorePhoneNumber%%>
<span class=“phoneIcon”>%%GLOBAL_StorePhoneNumber%%</span>
</li>
<li style=“%%GLOBAL_LiveChatCodeEnabled%%” class=“HeaderLiveChat”>
%%GLOBAL_LiveChatCode%%
</li>
<li style=“display:%%GLOBAL_HideAccountOptions%%” class=“First”>
<a href=“%%GLOBAL_ShopPath%%/account.php”>%%LNG_YourAccount%%</a>
</li>
%%SNIPPET_TopMenuGiftCertificates%%
<li style=“display:%%GLOBAL_HideAccountOptions%%”>
%%GLOBAL_LoginOrLogoutText%%
</li>
<li>
%%GLOBAL_AllPricesAreInCurrency%%
%%Panel.SideCurrencySelector%%
</li>
<li class=“last CartLink” style=“display:%%GLOBAL_HideCartOptions%%”>
<i class=“icon icon-cart” title=“View Cart”> </i><a href=“%%GLOBAL_ShopPathNormal%%/cart.php”title=“%%LNG_ViewCart%%”><span>%%GLOBAL_CartItems%%</span></a> | <a href=“#” title=“Empty cart” id=“EmptyCart”><span>Empty cart</span></a>
</li>
</ul>
</div>
</div>
<script type=“text/javascript”>
$(document).ready(function() {
$(“#EmptyCart”).click(function(e){
e.preventDefault();
var cart_htmlPage, cart_found, removeLink;
$.ajax({
url: “%%GLOBAL_ShopPath%%/cart.php”,
success: function(result) {
//Removing all the products from the cart
cart_htmlPage = $(result);
cart_items_found = $(“a.CartRemoveLink”, cart_htmlPage);
$(cart_items_found).each(function(i, el) {
//Retrieving the remove URL and hitting it to remove from cart
removeLink = “%%GLOBAL_ShopPath%%/” + $(this).attr(“href”);
$.ajax({
url: removeLink,
success: function(result) {
if ($(cart_items_found).length == (i+1)) {
console.log(“Done”);
document.location = “%%GLOBAL_ShopPath%%”;
}
},
async: false
});
});
},
async: false
});
return false;
});
});
</script>
Date Picker Addon for Interspire Shopping Cart
Hi everyone.
Today, I would like to share some screen shots from another addon I recently created for Tim Slatter for his cake-selling websites which lets him manage the delivery/event dates for a product through a calendar. It offers to have the number of days you want to have a padding for (i.e. minimum days required to process an order) as well as define the days on which delivery/event is not available for order/scheduling. Here are some snapshots from the addon in action:
The default number of padding days used in the snapshots is 3 days. So if the current date is 18th of May 2011, then note in the store front, you cannot place an order/event with the product selected before 20th of May 2011. Also, the red marked out items in figure 2 are the days when you cannot select this product to add to your order (i.e. defined as holidays by the store admin).
To see the addon in action, you can also take a look at Tim Slatter’s Brilliant Bakers site.
If you have any questions about it, please drop me a note and I will reply you back as soon as possible.
Regards,
Aftab
Download: You’ve got to get the permission from Tim Slatter from Brilliant Bakers to get the file.
Only download if you know what you are doing and I do not guarantee in any form for any matter whatsoever. This version would not work with the latest updates made at UPS with their API, so you might want to adopt the code for adjustments with the updates.
All the best!
UPS Shipping Management – Shipping Tracking Number & Labels
Many of my clients did not want to use the Ship Works or any other 3rd party system/software for generation of tracking numbers and priting labels from UPS, so I created this as an add-on for Interspire Shopping Cart. Being an addon, it gives you 2 main advantages:
1. Interspire Shopping Cart updates does not affect it and will always work (unless UPS make any changes)
2. Use within the Admin panel of Interspire Shopping Cart
After a long wait, this Addon module is finished with the 2 options from UPS Shipping
1. Generate tracking numbers for orders to be shipped using UPS
2. Print UPS shipping labels through regular printer (thermal printer is still under development)
UPDATE (sept 14, 2011):
1. Thermal printouts are now supported.
2. You can apply for approval of live environment automatically through this add-on.
Here are some snapshots from this add-on in action in a live site:
Download: Only download if you know what you are doing and I do not guarantee in any form for any matter whatsoever. This version would not work with the latest updates made at UPS with their API, so you might want to adopt the code for adjustments with the updates.
All the best! Link: http://www.chirohorit.com/addons_for_isc/upssm-production.rar
Have any questions? Post it here…
Dear Visitor,
If you have any questions related to any issues regarding programming with PHP, Open Source/Paid CMSes and frameworks and/or Interspire Shopping Cart, BigCommerce and Interspire Website Publisher, please post it as a comment in this post. I would reply to it as soon as I can.
If you would like to read a post about any Interspire / BigCommerce customization, tips and tweaks, please comment.
Thanks again lot for reading my blogs.
Aftab
Update (14-Apr-2018): I am back, so post questions if you have any.
Fastest way to learn a PHP Framework
Hey people.
If you are good with PHP and want to learn any PHP framework in a short time, all you would require is learning through debugging. The basics of debugging using the PHP language lies on simple 3 functions. They are:
BigCommerce/Interspire Shopping Cart – Add a Slider/Rotator of images
If you are looking for a image slider/rotator or a flash banner to appear on every page in Interspire Shopping Cart / BigCommerce, simply follow the steps below to do it.
- Log into your Interspire Shopping Cart / BigCommerce admin panel.
- From the dashboard, go to Store Design.
Dashboard >> Store Design
Interspire Shopping Cart Quick Search Plugin Tweaks
Greetings,
Just wanted to share my code tweaks to Interspire’s Quick Search plug-in for your Shopping Cart software. Currently, when you enable quick search, it displays an Ajax search result pop-up (actually a pop-down) just below the search text box. This is indeed a great feature but noticed that the search results returned here cannot be right clicked and opened in a new tab without being on that page. That is, if you right click on that, it opens up the target URL on both the current and the new tab/window. Here is a work-around for those who want to have only the left click do that, and let the right click be a right click. 🙂
Interspire Shopping Cart – Enabling Multiple Languages
I have came across a multiple number of requests in different websites requesting Interspire to make their Shopping Cart product multilingual. Here is a good news and that is you can do it yourself easily. On this example, lets assume we want to provide French support to your site.
Web Fonts: Frustration of designers/developers
Last day, I was working for one of my clients who was continuously complaining about the font of the web page. I got the snap from his computer and found that it was Helvetica showing up instead of Arial (which was the first assigned font) for the web page. I did some study on the net and came up with a solution point which fixed the complains from the client. 🙂
Aftab's Blog 
