---
title: Sepet ürün listesi item tasarımını güncelleme
description: Sepetteki ürün listesi içerisindeki item'ların tasarımını güncelleme.
---

<Video src="/media/ikas-studio/basic-examples/header/updating-cart-product-list-item-styles.mp4" autoPlay muted loop controls />

## Item düzenini güncelleme

Liste element'ine çift tıklayarak detayına girin ve ilk element'i seçin. Ardından aşağıdaki stil özelliklerini güncelleyin:

- `display`
- `grid-template-columns`
- `align-items`
- `gap`

## Elementleri ekleme

İçerisine bir **Görsel** element'i ve bir **Çerçeve** element'i ekleyin. Çerçeve element'ine sağ tıklayarak **Stili Temizle** işlemini uygulayın. Ardından çerçeve element'inin içerisine 3 adet **Yazı** element'i ekleyin.

## Görsel verisi bağlama

Görsel element'ini seçerek sağ kısımdaki **İçerik** alanına tıklayın. **Veri Bağla** seçeneğinden `orderLineItemsItem` > `variant` > `getMainImage` verisini seçin. Ardından `width` stilini güncelleyin.

## Çerçeve stilini güncelleme

Çerçeve element'ini seçerek sağ kısımdan `flex-direction` stilini güncelleyin.

## Yazı elementlerine veri bağlama

Birinci yazı element'ini seçerek sağ kısımdaki **İçerik** alanına tıklayın. **Veri Bağla** seçeneğinden `orderLineItemsItem` > `variant` > `name` verisini seçin.

İkinci yazı element'ini seçerek aynı şekilde **İçerik** alanından `orderLineItemsItem` > `getFormattedPriceWithQuantity` verisini seçin.

Üçüncü yazı element'ini seçerek **İçerik** alanına `Adet:` yazın. Ardından sağ üst köşedeki veri ikonuna basarak `orderLineItemsItem` > `quantity` verisini seçin. Son olarak `color` stilini güncelleyin.