# CMS: İlerleme Çubuğu Ekleme ve Ayarlama

Source: https://support.wix.com/tr/article/cms-ilerleme-cubugu-ekleme-ve-ayarlama (updated 2026-11-13)
Related: Wix developer documentation, https://dev.wix.com/docs/llms.txt; Help Center index, https://support.wix.com/en/llms.txt

Hedefe ulaşma yolunda kaydedilen ilerlemeyi görselleştirmek için sitenize bir ilerleme çubuğu ekleyin. İlerleme değerini yansıtmak için Velo kodlamasını veya bir CMS koleksiyonu alanını kullanabilirsiniz. Hedef değer olarak hiç değişmeyen statik bir değer belirleyebilir ya da Velo'yu kullanarak veya bir koleksiyon alanı bağlayarak dinamik bir değer tanımlayabilirsiniz.

![İlerleme çubuğu örneğinin ekran görüntüsü.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/dfff8cbb-ddcb-4376-8cae-3fedb2dd4458/2019/07/31/21a78e45-8390-4033-808f-6edfb86a28e6/714defe4-64e1-44b1-9826-27b96b4ee179.png)

İlerleme çubuklarının kullanımına örnekler:

* Yapılacaklar listesinde kaç görevin 'bitti' olarak işaretlendiğini gösterin.
* Kayıt sürecinde tamamlanan adımların yüzdesini gösterin.
* Bağış toplama hedefi için toplanan para miktarını gösterin.
* Belirli sayıda oy gerektiren bir kampanyayı imzalayan kişi sayısını gösterin.

> **Not:** Wix Harmony Editor'da metin, görüntü ve düğme ögelerini koleksiyonunuza, galerileri ise "Medya Galerisi" alanlarına bağlayabilirsiniz. İlerleme çubukları gibi diğer ögeleri bağlayamazsınız. [Wix Harmony'de daha fazla öge türünü bağlamak için oy verin](https://support.wix.com/tr/article/wix-harmony-editor-feature-request-connecting-additional-element-types-to-your-collection-2).

> **İpucu:** CMS'ye bağlanmadan ilerleme çubuğunun değerini güncellemek için Velo'yu kullanabilirsiniz. Nasıl yapılacağını öğrenmek için [İlerleme çubuğu API'si ile çalışma bölümüne](https://dev.wix.com/docs/velo/api-reference/$w/progress-bar/introduction) bakın.

> **Başlamadan önce:** Sitenize [CMS ekleyin](https://support.wix.com/tr/article/cms-formerly-content-manager-getting-started) ve ilerleme değeri için 'Sayı' alan türü içeren [bir koleksiyon oluşturun](https://support.wix.com/tr/article/cms-formerly-content-manager-creating-a-collection). Hedef değer için dinamik bir değer kullanmak istiyorsanız, hedefi temsil eden bir 'Sayı' alanı ekleyin.

### Bir ilerleme çubuğu eklemek ve onu ayarlamak için:

**Wix Editör:**

1. [Editörünüze gidin](https://manage.wix.com/account/site-selector/?actionUrl=https%3A%2F%2Fwww.wix.com%2Feditor%2F%7BmetaSiteId%7D%3FeditorSessionId%3D%7Besi%7D%26).
2. Editörünüzde [Velo'yu etkinleştirdiğinizden](https://support.wix.com/tr/article/enabling-velo) emin olun:  
   1. Üst çubuktaki **Geliştirici Modu** sekmesine tıklayın.  
   2. **Geliştirici Modunu Aç**'a tıklayın.
3. Sol çubuktaki **Öge Ekle** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/65d5031a-8d20-483c-b08f-0a758e1cf2fd/68a0236f-77f4-43c6-931f-8298ae691a9e/2022/11/17/01f24c8b-2ea3-4d06-a26d-9975a43d617e/a79e245b-4870-4444-ba82-248eca4eb9a7.png) tıklayın.
4. **İnteraktif**'e tıklayın.
5. **Göstergeler** altındaki **İlerleme Çubuğu**'na tıklayın.
6. Kullanmak istediğiniz İlerleme Çubuğu tasarımını sayfaya sürükleyin.
7. İlerleme çubuğunda **Ayarlar**'a tıklayın.
8. Ziyaretçilere ve ekran okuyuculara çubuğun neyi temsil ettiğini açıklayan bir **Etiket** (ör. "Hedef gerçekleşme oranı") girin.
9. Hedef değeri dinamik değer olarak mı yoksa statik değer olarak mı ayarlayacağınızı belirleyin:

**Dinamik hedef değer**

1. İlerleme çubuğunda **CMS'ye Bağla** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2023/06/16/2d484f5d-e1bf-4d48-9e42-82216e8b88de/08e74518-edad-42f8-b007-c974ba767eb6.png) tıklayın.
2. **Veri kümesi seçin** açılır menüsüne tıklayarak koleksiyonunuza bağlı mevcut bir veri kümesini seçin. Alternatif olarak, **Veri Kümesi Ekle** simgesine tıklayın, ardından bağlamak istediğiniz koleksiyonu seçin, veri kümesine bir ad verin ve **Oluştur**'a tıklayın.
3. **İlerleme değeri buraya bağlanır** açılır menüsüne tıklayın ve hedefe ulaşma yolunda kaydedilen ilerlemeyi göstermek için kullanmak istediğiniz alanı seçin.
4. **Hedef değer buraya bağlanır** açılır menüsüne tıklayın ve hedef değeri almak istediğiniz koleksiyon alanını seçin.  
![Hedef değerin bir sayı alanına bağlı olduğu İlerleme Çubuğunu Bağlayın panelinin ekran görüntüsü.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2024/05/14/7e13393f-87f9-4f5a-9a74-5500aa0c4515/762be055-5b35-433a-8e2b-8389c679db09.png)
5. **Düzen** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2023/11/06/db711bae-6039-429b-821e-08e3dcd4bd24/e037c257-27f6-4ece-9493-85f24db7a1c6.png) tıklayarak çubuğun düzenini özelleştirin:  
   * **Alan başlığı girintisi:** İlerleme çubuğu ayarlarında girdiğiniz **Etiket** metninin girintisini değiştirmek için kaydırıcıyı sürükleyin.  
   * **Çubuk ile başlık arasındaki boşluk:** Alan başlığı ile çubuk arasındaki mesafeyi ayarlamak için kaydırıcıyı sürükleyin.  
   * **Yön:** Metin yönünü seçin: **Soldan Sağa** veya **Sağdan Sola**  
   * **Hizalama: Sol**, **Orta** veya **Sağ** metin hizalamasını seçin  
   * **Gelişmiş:** Etiketin metin yönünü ve çubuğun ilerleme yönünü düzenlemek için **Gelişmiş**'e tıklayın.
6. **Tasarım** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2023/11/06/09441655-7021-453d-9255-abde3194f475/2ccaa454-88e1-4b18-861f-2dc0a1953908.png) tıklayın ve hazır tasarımlar arasından seçim yapın.

**Statik hedef değer**

1. İlgili alana bir **Hedef Değer** girin.
2. İlerleme çubuğunda **CMS'ye Bağla** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2023/06/16/2d484f5d-e1bf-4d48-9e42-82216e8b88de/08e74518-edad-42f8-b007-c974ba767eb6.png) tıklayın.
3. **Bir veri kümesi seçin** açılır menüsüne tıklayın ve koleksiyonunuza bağlı veri kümesini seçin. Alternatif olarak, **Veri Kümesi Ekle**'ye tıklayın, bağlanmak istediğiniz koleksiyonu seçin, veri kümesine bir ad verin ve **Oluştur**'a tıklayın
4. **İlerleme değeri buraya bağlanır** açılır menüsüne tıklayın ve hedefe ulaşma yolunda kaydedilen ilerlemeyi göstermek için kullanmak istediğiniz alanı seçin.  
![Statik bir hedef değerin ve bağlı ilerleme değerinin gösterildiği İlerleme Çubuğunu Bağlayın panelinin ekran görüntüsü.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2025/05/02/586fed4d-6a26-480a-8486-4b6240fff882/31433830-5cf4-403e-a07d-dedc6a50733e.png)
5. **Düzen** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2023/11/06/db711bae-6039-429b-821e-08e3dcd4bd24/e037c257-27f6-4ece-9493-85f24db7a1c6.png) tıklayarak çubuğun düzenini özelleştirin:  
   * **Alan başlığı girintisi:** İlerleme çubuğu ayarlarında girdiğiniz **Etiket** metninin girintisini değiştirmek için kaydırıcıyı sürükleyin.  
   * **Çubuk ile başlık arasındaki boşluk:** Alan başlığı ile çubuk arasındaki mesafeyi ayarlamak için kaydırıcıyı sürükleyin.  
   * **Yön:** Metin yönünü seçin: **Soldan Sağa** veya **Sağdan Sola**  
   * **Hizalama: Sol**, **Orta** veya **Sağ** metin hizalamasını seçin  
   * **Gelişmiş:** Etiketin metin yönünü ve çubuğun ilerleme yönünü düzenlemek için **Gelişmiş**'e tıklayın.
6. **Tasarım** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2023/11/06/09441655-7021-453d-9255-abde3194f475/2ccaa454-88e1-4b18-861f-2dc0a1953908.png) tıklayın ve hazır tasarımlar arasından seçim yapın.

**Studio Editor:**

1. [Editörünüze gidin](https://manage.wix.com/account/site-selector/?actionUrl=https%3A%2F%2Fwww.wix.com%2Feditor%2F%7BmetaSiteId%7D%3FeditorSessionId%3D%7Besi%7D%26).
2. Sol çubuktaki **Öge Ekle** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/65d5031a-8d20-483c-b08f-0a758e1cf2fd/68a0236f-77f4-43c6-931f-8298ae691a9e/2022/11/17/01f24c8b-2ea3-4d06-a26d-9975a43d617e/a79e245b-4870-4444-ba82-248eca4eb9a7.png) tıklayın.
3. **Giriş (Input)** seçeneğine tıklayın.
4. **Gösterim** altından **İlerleme Çubuğu**'na tıklayın.
5. Kullanmak istediğiniz İlerleme Çubuğu tasarımını sayfaya sürükleyin.
6. İlerleme çubuğunda **Ayarlar**'a tıklayın.
7. Ziyaretçilere ve ekran okuyuculara çubuğun neyi temsil ettiğini açıklayan bir **Etiket** (ör. "Hedef gerçekleşme oranı") girin.
8. Hedef değeri dinamik değer olarak mı yoksa statik değer olarak mı ayarlayacağınızı belirleyin:

**Dinamik hedef değer**

1. İlerleme çubuğunda **CMS'ye Bağla** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2023/06/16/2d484f5d-e1bf-4d48-9e42-82216e8b88de/08e74518-edad-42f8-b007-c974ba767eb6.png) tıklayın.
2. **Veri kümesi seçin** açılır menüsüne tıklayarak koleksiyonunuza bağlı mevcut bir veri kümesini seçin. Alternatif olarak, **Veri Kümesi Ekle** simgesine tıklayın, ardından bağlamak istediğiniz koleksiyonu seçin, veri kümesine bir ad verin ve **Oluştur**'a tıklayın.
3. **İlerleme değeri buraya bağlanır** açılır menüsüne tıklayın ve hedefe ulaşma yolunda kaydedilen ilerlemeyi göstermek için kullanmak istediğiniz alanı seçin.
4. **Hedef değer buraya bağlanır** açılır menüsüne tıklayın ve hedef değeri almak istediğiniz koleksiyon alanını seçin.  
![Hedef değerin bir sayı alanına bağlı olduğu Studio Editor Bağlayın İlerleme Çubuğuna Bağla panelinin ekran görüntüsü.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2025/05/02/60cf685a-6b3d-4ce7-bd71-04e72f326e66/ffbeeb79-1f0e-4e76-b087-7d300f09bd68.png)
5. **Düzen** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2023/11/06/db711bae-6039-429b-821e-08e3dcd4bd24/e037c257-27f6-4ece-9493-85f24db7a1c6.png) tıklayarak çubuğun düzenini özelleştirin:  
   * **Alan başlığı girintisi:** İlerleme çubuğu ayarlarında girdiğiniz **Etiket** metninin girintisini değiştirmek için kaydırıcıyı sürükleyin.  
   * **Çubuk ile başlık arasındaki boşluk:** Alan başlığı ile çubuk arasındaki mesafeyi ayarlamak için kaydırıcıyı sürükleyin.  
   * **Yön:** Metin yönünü seçin: **Soldan Sağa** veya **Sağdan Sola**  
   * **Hizalama: Sol**, **Orta** veya **Sağ** metin hizalamasını seçin  
   * **Gelişmiş:** Etiketin metin yönünü ve çubuğun ilerleme yönünü düzenlemek için **Gelişmiş**'e tıklayın.
6. İlerleme çubuğunun tasarımını düzenlemek için Denetçi panelindeki **Tasarım** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2025/05/02/ba09e92a-e346-424d-b8cc-ec5e29f3394b/1884d4c9-9fed-4736-be32-4446a7001d91.png) tıklayın.

**Statik hedef değer**

1. İlerleme Çubuğu ögesinde **Hedef Değeri Ayarla**'ya tıklayın ve **Hedef Değer** alanına ilgili değeri girin.
2. İlerleme çubuğunda **CMS'ye Bağla** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2023/06/16/2d484f5d-e1bf-4d48-9e42-82216e8b88de/08e74518-edad-42f8-b007-c974ba767eb6.png) tıklayın.
3. **Bir veri kümesi seçin** açılır menüsüne tıklayın ve koleksiyonunuza bağlı veri kümesini seçin. Alternatif olarak, **Yeni Veri Kümesi Oluştur**'a tıklayın, bağlanmak istediğiniz koleksiyonu seçin, veri kümesine bir ad verin ve **Oluştur**'a tıklayın.
4. **İlerleme değeri buraya bağlanır** açılır menüsüne tıklayın ve hedefe ulaşma yolunda kaydedilen ilerlemeyi göstermek için kullanmak istediğiniz alanı seçin.  
![Statik bir hedef değerin bulunduğu Studio Editor'u Bağlayın İlerleme Çubuğu'nu bağlayın panelinin ekran görüntüsü.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2024/05/14/736cedd2-3761-47ad-a83d-081d1644db94/51ce0c64-0d38-404c-a581-192c9d0195ef.png)
5. **Düzen** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2023/11/06/db711bae-6039-429b-821e-08e3dcd4bd24/e037c257-27f6-4ece-9493-85f24db7a1c6.png) tıklayarak çubuğun düzenini özelleştirin:  
   * **Alan başlığı girintisi:** İlerleme çubuğu ayarlarında girdiğiniz **Etiket** metninin girintisini değiştirmek için kaydırıcıyı sürükleyin.  
   * **Çubuk ile başlık arasındaki boşluk:** Alan başlığı ile çubuk arasındaki mesafeyi ayarlamak için kaydırıcıyı sürükleyin.  
   * **Yön:** Metin yönünü seçin: **Soldan Sağa** veya **Sağdan Sola**  
   * **Hizalama: Sol**, **Orta** veya **Sağ** metin hizalamasını seçin  
   * **Gelişmiş:** Etiketin metin yönünü ve çubuğun ilerleme yönünü düzenlemek için **Gelişmiş**'e tıklayın.
6. İlerleme çubuğunun tasarımını düzenlemek için Denetçi panelindeki **Tasarım** simgesine ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6b40156-9694-4cfe-9209-54815ef9d6dc/2025/05/02/ba09e92a-e346-424d-b8cc-ec5e29f3394b/1884d4c9-9fed-4736-be32-4446a7001d91.png) tıklayın.
