Many people have asked us if you can setup Squirrelcart so that a product can be added to the cart right from the category detail page. The category detail page is seen when you click on a category in the left "Product Catalog" nav. By default, the add to cart button only appears after you click "more detail" or the thumbnail image for the product. Here is how to accomplish this:
In v1.4.0, the show_product.php template file looks like this:
PHP Code:
<td width="<?=$TD_Width?>" height="190">
<form action="<?=$Form_Action?>" method="get">
<a href="<?=$Detail_Link?>"><img border="0" src="<?=$Thumbnail_Image?>"></a>
<span style="position:relative; right: 20; top: 10; vertical-align:top"><?=$New?></span>
<br>
<div style="font-size: 8pt">
<?=$Name?>
<?=$Admin_Link?>
</div>
<a style="font-size: 7pt" href="<?=$Detail_Link?>">more detail...</a>
<div class="product_price" style="width: 100%">
<?=$Base_Price?>
</div>
</form>
</td>
You will need to add the code for adding to the cart into the show_product.php template. The code can be found in the show_product_detail.php template file. Make sure you are familiar with how to properly modify template files. Do not modify the files in "squirrelcart/themes/squirrelcart". Copy the show_product.php file to your custom theme folder, and modify it there.
1. You will need to add this hidden form field directly below the form tag in show_product.php:
PHP Code:
<input type="hidden" name="microtime" value="<?=$Microtime?>">
2. You will also need to add the actual "add to cart" button. The code for that is:
PHP Code:
<?=$Add_to_Cart?>
You will need to decide where you would like to put the button, and then place that code accordingly.
3. Now, you will need to add a quantity field. There are 2 options here. You can add it exactly as it normally would appear, so customers can enter a quantity and click "add to cart", OR, you can hide the field, and have it default to 1. The customer can then change the quantity in the checkout if they need to. To allow customers to enter a quantity, add this code to the template:
PHP Code:
<b>Quantity: </b><input type="text" name="quantity" size="3" value="1">
Again, you will need to decide where you want this to be placed.
If you want it to be hidden, and default to 1, then add this instead:
PHP Code:
<input type="hidden" name="quantity" value="1">
Here is an example show_product.php, after the above changes have been made:
PHP Code:
<td width="<?=$TD_Width?>" height="190">
<form action="<?=$Form_Action?>" method="get">
<input type="hidden" name="microtime" value="<?=$Microtime?>">
<input type="hidden" name="quantity" value="1">
<a href="<?=$Detail_Link?>"><img border="0" src="<?=$Thumbnail_Image?>"></a>
<span style="position:relative; right: 20; top: 10; vertical-align:top"><?=$New?></span>
<br>
<div style="font-size: 8pt">
<?=$Name?>
<?=$Admin_Link?>
</div>
<?=$Add_to_Cart?><br>
<a style="font-size: 7pt" href="<?=$Detail_Link?>">more detail...</a>
<div class="product_price" style="width: 100%">
<?=$Base_Price?>
</div>
</form>
</td>
Thanks,
Jamie
Reply With Quote
'Buy Now' Button On Category Page
'Buy Now' Button On Category Page
