osCommerce v2.3.3 Tutorials | osCommerce eBook Store | osCommerce Tutorials | osCommerce Home

osCommerce v2.3.3 What's In My Cart Shopping Cart Sub-page Customization (Part 4)

Let’s continue with Part 3 of osCommerce Shopping Cart Sub-page customization.

The next step is giving some padding to the table cells (e.g. 8 pixels) so that the contents will not be sticking to the wall. Also adjust the width of the table columns.

18. Navigate back to line 69 – 70. Adjust the padding of table and columns width as shown:

<table border="1" width="100%" cellspacing="0" cellpadding="8">
<tr><th width="50%">Products</th> <th width="30%">Quantity</th> <th>Total</th></tr>

19. Refresh browser again to see the results. It looks much better.

osc shopping cart page customization

The right side of the table is too close to the margin. This is better to provide some spacing.

20. Navigate to line 38 again.

21. Apply a style attribute to the div layer.

<div class="contentTextShoppingCart" style="padding-right:10px;">

The Header “What’s In My Cart” also need some spacing on the left.

22. Navigate to line 27.

<h1><?php echo HEADING_TITLE; ?></h1>

23. Also apply a style attribute the <H1> tag.

<h1 style="padding-left:10px;"><?php echo HEADING_TITLE; ?></h1>

24. Refresh browser to see the changes.

osc shopping cart page customization

The Shopping Cart contents now looks much better than before.

However the Update button and the “remove” link still looking not very satisfactory. Let’s see if you can do something to make it looks better.

We will do that in next part. Please read on....