---
title: "Paywall ürün listesi"
description: "Uygulama içi satın almaları optimize etmek için Adapty'de paywall ürün bloklarını nasıl yapılandıracağınızı keşfedin."
---

Ürün listesi, tekliflerinizi düzenli ve çekici bir şekilde sergileyen paywall'ınızın temel öğesidir. Bu liste, kullanıcıları satın almaya yönlendirmek için kritik öneme sahiptir.

**Content** sekmesi, paywall'da gösterilecek ürünleri içerir. Bunlar, paywall'ı oluştururken eklediğiniz ürünlerle aynıdır.

Ürün listesini düzenleyebilirsiniz. Bu, paywall'ın **General** sekmesindeki ürün listesini etkiler.

Ürün listesini inceledikten sonra:

1. **Selected product** alanında varsayılan olarak hangi ürünün önceden seçili olacağını belirleyin.
2. Bir ürünün seçili veya seçili olmayan durumda nasıl görüneceğini **Products** bölümünün **Style** sekmesinde tanımlayın.
3. Bloğun genel görünümünü **Layout** sekmesinde yapılandırın ya da düzenleri birleştirmek için [ürün grupları ekleyin](#add-products-group).

:::warning

Bu bölüm, iOS, Android ve React Native SDK'larının 3.0 veya daha yüksek sürümleriyle ve Flutter ile Unity SDK'larının 3.3.0 veya daha yüksek sürümleriyle çalışan yeni Paywall Builder'ı açıklamaktadır. Adapty SDK v2.x veya daha eski sürümlerle uyumlu eski Paywall Builder hakkında bilgi için bkz. [Eski Paywall Builder paywall ürünleri](paywall-layout-and-products-legacy#products).

:::

## Ürün görünümü özelleştirme \{#product-view-customisation\}

Belirli ürünlerin görsel çekiciliğini artırmak, kullanıcı dikkatini önemli ölçüde yeniden dengeleyebilir. Bir ürünü veya özel teklifi öne çıkarmak, kullanıcıların ona odaklanmasını teşvik edebilir. Güçlü özelleştirme seçeneklerine bir göz atalım.

### Ürün rozeti \{#product-badge\}

Ürün rozeti, bir ürüne eklenebilen küçük bir etikettir. Bu rozet, ek promosyon bilgisi sunabilir ve kullanıcının seçimini yönlendirebilir. Rozetin boyutu metne göre otomatik olarak ayarlanır ve konumu paywall düzeniniz için optimize edilir.

  <img src="/assets/shared/img/eedb135-PB_product_badge.webp"
  style={{
    border: 'none', /* border width and color */
    width: '200px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

Ürün rozeti eklemek için:

1. Belirli bir ürünün ayarlarında **Product badge** geçişini açın.

  <img src="/assets/shared/img/2a5779d-PB_product_badge_config.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

2. Rozet görünümünü ve metnini tasarım ihtiyaçlarınıza göre özelleştirin.

### Seçili ürün \{#selected-product\}

**Products as list + purchase button** satın alma akışında, kullanıcıları nazikçe yönlendirmek için bir ürünü **önceden seçili** hale getirebilirsiniz. Bu, kullanıcı tercihini yönlendirmede özellikle etkili olabilir.

Birden fazla [ürün grubu](#add-products-group) eklerseniz, aynı **Selected product** seçeneği tüm gruplara uygulanır.

  <img src="/assets/shared/img/3f37969-PB_preselected_product.webp"
  style={{
    border: 'none', /* border width and color */
    width: '200px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

Bir ürünü önceden seçmek için:

1. **Products** öğesini açın.

  <img src="/assets/shared/img/da4e4c4-PB_preselect_product.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

2. **Content** sekmesinde, **Selected product** açılır listesinden önceden seçmek istediğiniz ürünü seçin.
3. Gerekirse **Style** sekmesinde seçili ürünün görünümünü ve diğer ürünlerin varsayılan görünümünü ayarlayın.

  <img src="/assets/shared/img/ac7411e-PB_setup_selected_default_button.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

### Öne çıkarılan ürün \{#highlighted-product\}

**Products as purchase buttons** satın alma akışında, tercih edilen bir ürünü birincil seçenek haline getirerek anında kullanıcı dikkatini çekmek için **öne çıkarabilirsiniz**.

  <img src="/assets/shared/img/afc2882-PB_highlighted_product.webp"
  style={{
    border: 'none', /* border width and color */
    width: '200px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

Bir ürünü öne çıkarmak için:

1. Sol panelde öne çıkarmak istediğiniz ürünü seçin.

  <img src="/assets/shared/img/a630507-PB_highlight_product.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

2. **Style** alt bölümünde, ürünün daha fazla öne çıkması için tasarımı düzenleyin.

### Ürün teklifleri \{#product-offers\}

Her ürün, **Text** alt bölümündeki teklifler için farklı metinler içerebilir. **Default** sekmesi, teklif olmadan gösterilen metni içerir.

Burası şunları kullanmak için iyi bir yerdir:
- Mağazalardan yerelleştirilmiş veriler için [etiket değişkenleri](paywall-builder-tag-variables)
- Kendi dinamik içeriğiniz için [özel etiketler](custom-tags-in-paywall-builder)

Köşeli ayraçla yazmaya başlayın; Adapty, mağazalardan yerelleştirilmiş veri eklemek için kullanılabilir etiket değişkenlerini önerecektir.

  <img src="/assets/shared/img/0de6871-PB_text.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

## Deneme geçişiyle 2 ürün seti arasında geçiş yapma \{#switch-between-2-product-sets-by-trial-toggle\}

Çok yönlü bir kullanıcı deneyimi oluşturmak için kullanıcıların bir geçiş düğmesiyle iki ürün seti arasında geçiş yapmasına izin verebilirsiniz. Bu, standart ürünler ile denemeler arasında ayrım yapmak için özellikle kullanışlıdır.

Geçiş düğmesi eklemek için:

1. **Products** öğesinde **Products grouping** seçeneğini **Toggle (for free trials and other offers)** olarak değiştirin. Bu, iki alt bölüm ekleyecektir: **Toggle on** ve **Toggle off**.

  <img src="/assets/shared/img/d859a58-PB_turn_on_toggle.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

2. Geçiş açık veya kapalıyken görünümleri oluşturmak için her iki alt bölüme de ürün ekleyin.
3. **Toggle** öğesinde, paywall'da geçişin başlangıçta açık mı yoksa kapalı mı olacağını seçmek için **Default state** ayarını yapın.

  <img src="/assets/shared/img/4127a67-PB_toggle_default_state.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

## Sekmeyle ürün setleri arasında geçiş yapma \{#switch-between-product-sets-by-tab\}

Paywall sekmeleri, ürünlerinizi kategoriler halinde gruplandırmanıza ve kullanıcılarınız için tüm olası seçenekleri öne çıkarmanıza olanak tanır. Özellikle şu durumlarda kullanışlıdır:

- Uygulamanız birden fazla haftalık, aylık veya yıllık plan sunuyorsa
- Plus, Gold veya Premium gibi farklı kademeleriniz varsa

Kullanıcıların kademeler arasındaki farkları görmesine yardımcı olmak için sekmelere özellik listeleri gibi öğeler de ekleyebilirsiniz.

Sekme eklemek için:

1. **Products** öğesinde **Products grouping** seçeneğini **Tabs (for comparing plan groups)** olarak ayarlayın. Bu, ürünlerinizi iki başlangıç sekme grubuna böler.

   
     <img src="/assets/shared/img/paywall-tabs.webp"
     style={{
       border: '1px solid #727272', /* border width and color */
       width: '700px', /* image width */
       display: 'block', /* for alignment */
       margin: '0 auto' /* center alignment */
     }}
   />
   

2. Daha fazla sekmeye ihtiyacınız varsa **Add tab group** düğmesine tıklayın.

   
     <img src="/assets/shared/img/add-tab-group.webp"
     style={{
       border: '1px solid #727272', /* border width and color */
       width: '700px', /* image width */
       display: 'block', /* for alignment */
       margin: '0 auto' /* center alignment */
     }}
   />
   

3. Ürünlerinizi bu sekmeler içinde düzenleyin.

   
     <img src="/assets/shared/img/tabs-divided.webp"
     style={{
       border: '1px solid #727272', /* border width and color */
       width: '700px', /* image width */
       display: 'block', /* for alignment */
       margin: '0 auto' /* center alignment */
     }}
   />
   

4. İlk sekme grubunu açın ve **Tab title** alanına paywall'da görünecek adı girin.

   
     <img src="/assets/shared/img/tab-rename.webp"
     style={{
       border: '1px solid #727272', /* border width and color */
       width: '700px', /* image width */
       display: 'block', /* for alignment */
       margin: '0 auto' /* center alignment */
     }}
   />
   

5. Kolay başvuru için ayrı bir alana dahili sekme adı girin. Bu ad paywall'da görünmez, ancak sekmeyi listelerde tanımlamanıza yardımcı olur.

   
     <img src="/assets/shared/img/tab-internal-rename.webp"
     style={{
       border: '1px solid #727272', /* border width and color */
       width: '700px', /* image width */
       display: 'block', /* for alignment */
       margin: '0 auto' /* center alignment */
     }}
   />
   

6. Her sekme için 4-5. adımları tekrarlayın.

7. Kullanıcı paywall'ı açtığında hangi sekmenin etkin olacağını seçin. **Tab control** bölümüne gidin ve **Selected tab** listesinden varsayılan sekmeyi seçin.

   
     <img src="/assets/shared/img/tab-selected.webp"
     style={{
       border: '1px solid #727272', /* border width and color */
       width: '700px', /* image width */
       display: 'block', /* for alignment */
       margin: '0 auto' /* center alignment */
     }}
   />
   

## Bir düğmenin altında ek ürünler gösterme \{#show-extra-products-under-a-button\}

Paywall'ınızı sade tutmak için bazı ürünleri veya ürün gruplarını bir düğmenin arkasına gizleyebilirsiniz ("Daha fazla plan görüntüle" veya istediğiniz herhangi bir etiket gibi).

Bu sayede kullanıcılar önce en önemli seçeneklerinize odaklanırken, isterlerse diğer planları da keşfedebilirler.

Paywall'ı daha temiz hale getirmenin ve dönüşümleri artırmanın harika bir yoludur.

Nasıl yapılır:

1. **Products** öğesinde **Products grouping** seçeneğini **Button (for more alternative plans)** olarak ayarlayın. Bu, ürünlerinizi iki gruba böler: **Shown** ve **More plans**.

  <img src="/assets/shared/img/view-more-plans.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

2. Ürünlerinizi bu gruplar arasında dağıtın. **Shown**, hemen gösterilmesini istediğiniz ürünler içindir. **More plans**, yalnızca kullanıcılar düğmeye tıkladığında gösterilen, düğmenin arkasına gizlenen ürünler içindir.

   
     <img src="/assets/shared/img/divided-plans.webp"
     style={{
       border: '1px solid #727272', /* border width and color */
       width: '700px', /* image width */
       display: 'block', /* for alignment */
       margin: '0 auto' /* center alignment */
     }}
   />
   

3. İhtiyaçlarınıza uygun şekilde **View more plans** öğesindeki düğmenin metin ve düzenini özelleştirin.

   
     <img src="/assets/shared/img/view-more-plans-button.webp"
     style={{
       border: '1px solid #727272', /* border width and color */
       width: '700px', /* image width */
       display: 'block', /* for alignment */
       margin: '0 auto' /* center alignment */
     }}
   />
   

Bu seçenekler, kullanıcıları satın almaya yönlendiren net ve görsel açıdan çekici bir ürün listesi oluşturmanıza yardımcı olur.

## Alt sayfada ek planlar gösterme \{#show-extra-plans-in-a-bottom-sheet\}

Paywall'ınızı sadeleştirmek için bazı ürünleri gizleyebilir ve yalnızca kullanıcılar bir düğmeye tıkladığında ("Daha Fazla Plan Görüntüle" veya istediğiniz herhangi bir etiket) gösterebilirsiniz.

Bu işlem, gizli ürünleri içeren kayan bir alt sayfa açar.

Bu yapı, kullanıcıların önce ana seçeneklerinize odaklanmasını sağlarken, ilgilenenler için ek planları keşfetme esnekliği de sunar.

Paywall'ı düzenlemek ve dönüşümleri artırmak için etkili bir yöntemdir.

Nasıl yapılır:

1. **Products** öğesinde **Products grouping** seçeneğini **Bottom Sheet (for more alternative plans)** olarak ayarlayın. Bu, ürünlerinizi iki gruba böler: **Shown** ve **More plans**.

  <img src="/assets/shared/img/bottom-sheet.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

2. Ürünlerinizi bu gruplar arasında dağıtın. **Shown**, hemen gösterilmesini istediğiniz ürünler içindir. **More plans**, başlangıçta gizlenen ve yalnızca kullanıcılar düğmeye tıkladığında gösterilen ürünler içindir.

   
     <img src="/assets/shared/img/bottom-sheet-divided-plans.webp"
     style={{
       border: '1px solid #727272', /* border width and color */
       width: '700px', /* image width */
       display: 'block', /* for alignment */
       margin: '0 auto' /* center alignment */
     }}
   />
   

3. Tasarımınıza ve mesajlaşmanıza uygun şekilde **View More Plans** öğesindeki düğmenin metin ve düzenini özelleştirin.

   
     <img src="/assets/shared/img/bottom-sheet-button.webp"
     style={{
       border: '1px solid #727272', /* border width and color */
       width: '700px', /* image width */
       display: 'block', /* for alignment */
       margin: '0 auto' /* center alignment */
     }}
   />
   

4. Alt sayfa, ürünlerin ayrı satın alma düğmeleri mi yoksa her ürünün bir düğme mi olduğuna bakılmaksızın ana paywall'ınızla aynı ürün listesi görüntüleme biçimini otomatik olarak kullanır. Alt sayfa düzenini, metnini, stilini ve varsayılan ürün seçimini özelleştirebilirsiniz.

  <img src="/assets/shared/img/bottom-sheet-layout.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

Bu seçenekler, sade ve kullanıcı dostu bir ürün listesi oluşturmanıza yardımcı olur.

## Ürün grubu ekleme \{#add-products-group\}

Farklı ürünlere hem dikey hem de yatay düzenleri uygulamak veya ürünler arasına metin eklemek istiyorsanız başka bir ürün grubu ekleyebilirsiniz.

:::note
Ürün grubu eklemek [Ürün gruplama](#switch-between-2-product-sets-by-trial-toggle) seçeneğini devre dışı bırakır. Başka bir ürün grubu ekleme ile ürünleri aynı blok içinde gruplama arasında seçim yapın.
:::

Ürün grubu eklemek için:

1. **Footer** üzerindeki **Add element** veya **+** düğmesine tıklayın.
2. **Products** seçeneğini seçin.
3. Ürün ekleyin. Aynı ürün farklı gruplarda bulunamayacağından, önce ürünü başka bir gruptan silmeniz gerekir.

  <img src="/assets/shared/img/product-group.png"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>