---
title: Bileşene sepete ekle butonu ekleyerek aksiyon bağlama
description: Ürün kartı bileşenine sepete ekle butonu ekleyerek aksiyon bağlama.
---
## Buton ekleme
Ürün kartı bileşenine çift tıklayarak detayına girin. Fiyat bağladığınız yazı element'ini seçerek **Elementler** kısmından bir **Buton** element'i ekleyin. Buton element'i içinde oluşan yazı element'ini seçerek sağ kısımdaki **İçerik** alanına `Sepete ekle` yazın.
Buton element'ini seçerek `cursor` stilini güncelleyin.
## Aksiyon ekleme
Sağ kısımın üstünde bulunan sekme kısmından **Aksiyonlar** bölümüne geçerek bir aksiyon ekleyin. Açılan modaldan aksiyonunuzun adını ve olay tipini seçtikten sonra **Kaydet**'e basın. Artık bu elemente bağlı bir `onclick` olayınız bulunmaktadır.
Olaylar hakkında daha detaylı bilgi için [Olaylar](https://builders.ikas.com/tr/docs/ikas-studio/content-and-design/elements/events) sayfasını inceleyebilirsiniz.
## Aksiyonu Blueprint modunda yapılandırma
Oluşan aksiyonunuzun üzerine tıklayarak Blueprint moduna geçiş yapın. Açılan ekranda boş bir alana sağ tıklayarak `product` araması yapın ve ekleyin. Bu `product`, daha önceden veri olarak eklediğiniz üründür.
Eklenen `product` node'unun çıkış noktasından dışarıya doğru sürükleyerek `product` altındaki `getSelectedVariant` fonksiyonuna erişin. Ardından `getSelectedVariant` node'unun çıkış noktasından yeni bir node çıkararak `addVariantToCart` fonksiyonunu ekleyin.
Boş bir alana tekrar sağ tıklayarak `product` araması yapın ve yeni bir `product` node'u daha ekleyin. Bu node'u `addVariantToCart` node'undaki ilgili giriş noktasına bağlayın. Aynı node içerisinde `quantity` değerini `1` olarak ayarlayın.
Son olarak **Start** node'unun çıkışından başlayarak tüm node'ları sırasıyla birbirine bağlayın.
## Sonuç
Sepete ekle butonuna gerekli aksiyonu bağlamış oldunuz ve tasarım moduna geri dönebilirsiniz.