# Changing a 1.4 theme to support gift products

## Introduction <a href="#changinga1.4themetosupportgiftproducts-introduction" id="changinga1.4themetosupportgiftproducts-introduction"></a>

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:

![](/files/-MEb-h4euQohzUb5ahm7)

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 <a href="#changinga1.4themetosupportgiftproducts-changingshopping-cart.tpl" id="changinga1.4themetosupportgiftproducts-changingshopping-cart.tpl"></a>

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:\
&#x20;![](/files/-MEb-h4fnVxl-vR1kNnN)

## Changing shopping-cart-product-line.tpl <a href="#changinga1.4themetosupportgiftproducts-changingshopping-cart-product-line.tpl" id="changinga1.4themetosupportgiftproducts-changingshopping-cart-product-line.tpl"></a>

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 <a href="#changinga1.4themetosupportgiftproducts-hidingthe-delete-button" id="changinga1.4themetosupportgiftproducts-hidingthe-delete-button"></a>

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 <a href="#changinga1.4themetosupportgiftproducts-changingtheidattributes" id="changinga1.4themetosupportgiftproducts-changingtheidattributes"></a>

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 <a href="#changinga1.4themetosupportgiftproducts-addinga-gift-logo" id="changinga1.4themetosupportgiftproducts-addinga-gift-logo"></a>

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 <a href="#changinga1.4themetosupportgiftproducts-result" id="changinga1.4themetosupportgiftproducts-result"></a>

![](/files/-MEb-h4d_apiSd2UKPt9)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.prestashop-project.org/1-5-documentation/english-documentation/designer-guide/designer-tutorials/changing-a-1.4-theme-to-support-gift-products.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
