Changing a 1.4 theme to support gift products

Introduction

Themes built during the PrestaShop 1.4 most often cannot properly display gift products in their shopping cart summary. This can result in this kind of display:

The total does not match the sum of totals in the summary: 188.10 + 376.20 does not equal 752.40.

In order to properly display gift products, you have to edit two templates:

• shopping-cart-product-line.tpl: displays the product rows.

• shopping-cart.tpl: calls the first template for each product.

Changing shopping-cart.tpl

You have to find the product loop. That line should start as such:

{foreach $products as $product}

The loop code ends with{/foreach}, after which you should add the following lines.

{foreach $gift_products as $product}
    {assign var='productId' value=$product.id_product}
    {assign var='productAttributeId' value=$product.id_product_attribute}
    {assign var='quantityDisplayed' value=0}
    {assign var='cannotModify' value=1}
    {* Display the gift product line *}
    {include file="./shopping-cart-product-line.tpl" productLast=$product@last productFirst=$product@first}
{/foreach}

The page should now display this:

Changing shopping-cart-product-line.tpl

Right now, it is possible to delete a gift product, and it is not even marked as free. We must change the template which display the product rows, in order to improve its display.

Hiding the "Delete" button

To hide the "Delete" button, you must first find the template code which displays it. In our case, it is this one:

<div>
  <a rel="nofollow" id="{$product.id_product}_{$product.id_product_attribute}_0_{$product.id_address_delivery|intval}" href="{$link->getPageLink('cart', true, NULL, "delete&amp;id_product={$product.id_product|intval}&amp;ipa={$product.id_product_attribute|intval}&amp;id_address_delivery={$product.id_address_delivery|intval}&amp;token={$token_cart}")}">{l s='Delete'}</a>
</div>

This block of code must be embedded in a conditional test depending on the presence of $product.gift. In PS 1.4's default theme, you can edit the existing conditional test to add a condition on $product.gift.

{if (!isset($customizedDatas.$productId.$productAttributeId) OR $quantityDisplayed) > 0 && empty($product.gift)}
  <div>
    <a rel="nofollow" id="{$product.id_product}_{$product.id_product_attribute}_0_{$product.id_address_delivery|intval}" href="{$link->getPageLink('cart', true, NULL, "delete&amp;id_product={$product.id_product|intval}&amp;ipa={$product.id_product_attribute|intval}&amp;id_address_delivery={$product.id_address_delivery|intval}&amp;token={$token_cart}")}">{l s='Delete'}</a>
  </div>
{/if}

Changing the id attributes

In order to prevent conflicts with JavaScript code which edit id}}s on the fly by suffixing them (for instance, with {{_gift

Il faut pour éviter les problème avec les script JS modifier les ids en les suffixant (par exemple par "_gift"), you have to replace this code:

{$product.id_address_delivery|intval}

...with this one:

{$product.id_address_delivery|intval}{if !empty($product.gift)}_gift{/if}

Adding a "Gift" logo

You can add a logo in the gift product's row, in order to help customers understand why there is such a line in their cart summary.

To that end, find the product's title (<td class="cart_description">) and add the following lines:

{if !empty($product.gift)}
  <br />
  <span>
    {l s='Gift!'}
  </span>
{/if}

You also must add the following line in the global.css file:

table#cart_summary .gift-icon {
  color: white;
  background: #0088CC;
  line-height: 20px;
  padding: 2px 5px;
  border-radius: 5px;
}

Of course, you should adapt all these code blocks to your theme's needs: colors, placement, etc.

Result