NemoPS » shopping cart

Creating a “Clear cart” button in PrestaShop

Nemo — Wed, 13 Jul 2016 13:08:49 +0000

In this tutorial, we will see how to add a button to empty the PrestaShop Cart in one click.

Adding the button to the cart page

The first thing we need is, of course, a button to play with. The ideal place where to add it is shopping-cart.tpl, specifically right after the order summary table. Therefore, open up the file, located in the theme folder, and read the end of the table, around line 454 of the default template:

					{/foreach}
				
			{/if}

Right after the table, let’s add a simple button:

		
			Empty Cart

Then, we need it to do something. We could use a submit, inside a form, but modern standards require speed, and nothing beats ajax in this.
Right after the button, let’s add a script tag:

We want to target the click event of our new button, and fire an ajax request to the cart controller:

$(document).ready(function() {
	$('#removeAll').click(function(e) {
		e.preventDefault()
		$.ajax({
			type: 'POST',
			headers: { "cache-control": "no-cache" },
			url: baseUri + '?rand=' + new Date().getTime(),
			async: true,
			cache: false,
			dataType : "json",
			data: 'controller=cart&deleteAll=1&token=' + static_token + '&ajax=true',
			success: function(data){
				$('.opc-main-block, .step-num, #HOOK_SHOPPING_CART_EXTRA').fadeOut('fast');
				$('#order-detail-content').fadeOut('fast', function() {
					$('#emptyCartWarning').fadeIn('slow');	
				});
				ajaxCart.refresh();
			}
		})
	});
});

Explanation: The url we call is simply the base one, plus a random value with the date, to avoid the request being cached. In terms of data, we need to pass in the controller (cart), and action (deleteAll, which doesn’t exist yet, but we will create in a second), the security token, and then ajax=true.
On success, we fade out the page content, making sure any stuff from the One Page Checkout is hidden as well, and we also refresh the cart block.

The next step is to create something to handle the new deleteAll command.

Editing the CartController

As always, instead of modifying the core file, make sure you use an override for this method. The function we are interested in is postProcess:

    public function postProcess()
    {
        // Update the cart ONLY if $this->cookies are available, in order to avoid ghost carts created by bots
        if ($this->context->cookie->exists() && !$this->errors && !($this->context->customer->isLogged() && !$this->isTokenValid())) {
            if (Tools::getIsset('add') || Tools::getIsset('update')) {
                $this->processChangeProductInCart();
            } elseif (Tools::getIsset('delete')) {
                $this->processDeleteProductInCart();
            } elseif (Tools::getIsset('changeAddressDelivery')) {
                $this->processChangeProductAddressDelivery();
            } elseif (Tools::getIsset('allowSeperatedPackage')) {
                $this->processAllowSeperatedPackage();
            } elseif (Tools::getIsset('duplicate')) {
                $this->processDuplicateProduct();
            }
            // Make redirection
            if (!$this->errors && !$this->ajax) {
                $queryString = Tools::safeOutput(Tools::getValue('query', null));
                if ($queryString && !Configuration::get('PS_CART_REDIRECT')) {
                    Tools::redirect('index.php?controller=search&search='.$queryString);
                }

                // Redirect to previous page
                if (isset($_SERVER['HTTP_REFERER'])) {
                    preg_match('!http(s?)://(.*)/(.*)!', $_SERVER['HTTP_REFERER'], $regs);
                    if (isset($regs[3]) && !Configuration::get('PS_CART_REDIRECT')) {
                        $url = preg_replace('/(\?)+content_only=1/', '', $_SERVER['HTTP_REFERER']);
                        Tools::redirect($url);
                    }
                }

                Tools::redirect('index.php?controller=order&'.(isset($this->id_product) ? 'ipa='.$this->id_product : ''));
            }
        } elseif (!$this->isTokenValid()) {
            Tools::redirect('index.php');
        }
    }

See all those elseifs? We need another condition to target our deleteAll command. Therefore, at the end of the stack, add another:

...
} elseif (Tools::getIsset('duplicate')) {
    $this->processDuplicateProduct();
} elseif (Tools::getIsset('deleteAll')) {

}
// Make redirection
if (!$this->errors && !$this->ajax) {
...

Inside it, we do not need fancy stuff, only:

elseif (Tools::getIsset('deleteAll')) {
                
    $this->context->cart->delete();
    $this->context->cookie->id_cart = 0;
    die(1);


}

This will clear the cart for good, and reset the id for the current user. You can also avoid resetting it, if you prefer.
Save and test the button now. Make sure you clear the class_index.php file inside cache/, if you used an override.
We are done!

The post Creating a “Clear cart” button in PrestaShop appeared first on NemoPS.

Automatically remove Out of Stock products from the Prestashop Cart

Nemo — Wed, 22 Apr 2015 12:38:23 +0000

In this video tutorial we will see how to automatically remove out of stock products from the Prestashop cart, and display a message about it as well.

Watch the screencast

Subscribe Post Scriptum's Youtube Channel

Steps Breakdown

File: modules/blockcart/blockcart.php

Around line 64, change:

		$nbTotalProducts = 0;
		foreach ($products as $pk => $product)
		{
			$nbTotalProducts += (int)$product['cart_quantity'];
		}

		$nbTotalProducts = 0;
		$removed = array();
		foreach ($products as $pk => $product)
		{
			if($product['quantity_available'] <= 0 && !Product::isAvailableWhenOutOfStock($product['out_of_stock']))
			{
				$this->context->cart->deleteProduct($product['id_product'],$product['id_product_attribute'], $product['id_customization'], $product['id_address_delivery']);
				$removed[] = $product['name'];
				unset($product[$pk]);
				continue;
			}
			$nbTotalProducts += (int)$product['cart_quantity'];
		}

Around line 133, add the following to the Smarty assign:

			'removed_products' => $removed,
			'cart_qties' => (int)$this->context->cart->nbProducts(),

File: themes/default-bootstrap/modules/blockcart/blockcart.tpl
Add the following at the very beginning

The post Automatically remove Out of Stock products from the Prestashop Cart appeared first on NemoPS.

Smart Shopping Cart Summary for Prestashop

Nemo — Wed, 03 Jul 2013 07:58:10 +0000

In this tutorial, we will see how to create a smart shopping cart summary for Prestashop, and allow customers to know if any of the products they are buying went of stock (much like amazon)

Download Project Files

The out of stock problem in Prestashop

If you have a running Prestashop Store and work with stock management and small stocks of products, you may have encountered the case when a person adds a product to the cart, but leaves the site and eventually comes back and buy the next day. In the meantime, the product went out of stock but there was no notice of this in the cart summary, and the customer proceeded with the checkout. Big trouble for you, at this point!

Prestashop does not have any ‘Smart Shopping Cart’ features, thus there is no way for the customer to be informed when a product in his basket is not available anymore. In this short tutorial, we will add an availability status to the cart summary table with 3 statuses: available, on back-order, and out of stock. Then, based on these data we will eventually display an alert box so that even the most distracted person would notice the issue.

The cart summary Page

First, we need to add the relevant column to the cart summary page. To keep the tutorial simple I will replace the reference column that seems to be useless for most people. If you need it and need all the other columns as well, I will add a small notice on how to modify the table. Also, notice that your code might be different, depending on the theme you use. I will go for the default one, as always.

Open up shopping-cart.tpl, that you can find in the theme’s folder. Look for the following code, at about line 77:

				{l s='Ref.'}

Change it into

				{l s='Avail.'}

If you want to add a new column: add the code above instead of replacing the reference column. Now, some cells have a column span, which will in this case break your design. Based on the number of columns you have, it will behave differently. For the default theme, if you look a couple of lines below, you’ll see

If you add a column, simply find all occurrences of that colspan=”5″ in this file, and change it to 6. Again, take note of the number and add 1 if yours is different. Also, depending on the design it might break somewhere else, so, if it does, just look for colspans and adjust them accordingly.

The product lines template

Now we need to tell Prestashop to actually display the product availability instead of the reference (or again, consider adding the cell instead of replacing it if you want to). Place the images that are part of the project files inside the /img folder of your theme, then locate the following at about line 34 of shopping-cart-product-line.tpl


	
		{if $product.reference}{$product.reference|escape:'htmlall':'UTF-8'}{else}--{/if}

Change it to (or add)

	
		{if $product.quantity_available > 0}
			
		{else if $product.quantity_available <= 0 && $product.allow_oosp}
			
		{else if $product.quantity_available <= 0 && !$product.allow_oosp}
			
		{/if}

Explanation: We are using the if statement to check if the current product is available. We have 3 options here: if the current product’s quantity is positive, it is of course available. If it has 0 or less as quantity, but the allow out of stock preorder option is active for this product or it has a general ‘use default behavior’ set, and it is set to accept out of stock orders, it will add the preorder image. Else, the unavailable one will be shown.

The floating feedback box

At this point, you might even decide to stop, but to bring the feedback further, we will explicitly tell the customer to remove the unavailable product prom the cart. To do this, we need to write a couple of simple lines of javascript. Open again shopping-cart.tpl. Locate the following javascript block at the beginning of the file

At the end (before closing the cdata tag), add the following

	var unavailable_products = new Array;

This array will store all of the unavailable products, whose names will be shown to the customer. Back to our shopping-cart-product-line.tpl file, change our previous if switch as follows

	
		{if $product.quantity_available > 0}
			
		{else if $product.quantity_available <= 0 && $product.allow_oosp}
			
		{else if $product.quantity_available <= 0 && !$product.allow_oosp}
			
				
		{/if}

So that the product name is added to the list, and, eventually, if the product has attributes, the attributes names are added too.

Finally, we need to display the box. Add the following at the very end of shopping-cart.tpl.

Explanation:: Sca-ree! Lots of stuff going on, but it is actually simpler than it seems: first, we check that there are unavailable products. No sense to show the floating box if all are available! Then, we create translatable strings to be used in the box itself.

Next, we create the floating box object with some arbitrary styling (you can use css for this; I added inline style to be quicker). Then, we append: the text to inform customers those products are unavailable; all unavailable products in the list (using $.each()); a small text to inform on how to close the floating box.

Lastly, we append the box to the body right away. Save & refresh, if you have unavailable products, the box will pop out!

The post Smart Shopping Cart Summary for Prestashop appeared first on NemoPS.