FonPageBuilder Bileşen Yönetimi Son Güncelleme: 04-07-2026

Bileşen / Modül Nedir?

FonPageBuilder ile WiseCP sayfaları için sürükle & bırak yöntemiyle kolayca sayfa yerleşim düzenleri oluşturabilirsiniz. Sayfalarınızdaki içeriği WiseCP modülleri ve FonPageBuilder bileşenleri (widget) ile zenginleştirebilirsiniz. 30'dan fazla modül ve bileşen ile sayfalarınızı kolayca oluştururabilirsiniz.

• Modül: WiseCP sisteminde yer alan her türlü ürün grubu ile ilgili sistem ögelerini sayfanıza eklemenize yarayan sistem modülleridir.
  1. Domain Arama Modülü: Sayfanıza domain arama kutusu ekler.
  2. Hosting Paketleri Modülü: Sayfanıza hosting paketlerinizi eklemenizi sağlar.
  3. Server Paketleri Modülü Sayfanıza server paketlerinizi eklemenizi sağlar
  4. SMS Paketleri Modülü Sayfanıza sms paketlerinizi eklemenizi sağlar
  5. Özel Ürün Paketleri Modülü Sayfanıza Özel Ürün Gruplarındaki ürünlerinizi eklemenizi sağlar
  6. Yazılımlar Modülü Sayfanıza yazılımlarınızı eklemenizi sağlar
  7. Referanslar Modülü Sayfanıza referanslarınızı eklemenizi sağlar
  8. Blog Modülü Sayfanıza blog makalelerinizi eklemenizi sağlar
  9. Haberler Modülü Sayfanıza haber/duyurularınızı eklemenizi sağlar
  10. Sidebar Modülü WiseCP > Site > Sayfalar menüsü altındaki sayfalarınız için sidebar menüsü eklemenizi sağlar
• Bileşen: Çeşitli şekilde içerikler eklemenizi sağlayan, birden fazla stile sahip olabilen ve dinamik içerikler oluşturmanızı sağlayan kod parçacıklarıdır. Örneğin Müşteri Görüşleri, Resim, Video, Akordiyon v.b.
• Bileşen Düzenleme Araçları: Fare işaretçinizle eklemiş olduğunuz bir bileşenin üzerine geldiğinizde bileşenle ilgili eylemleri gerçekleştireceğiniz Bileşen Düzenleme Araçları adlı bir araç çubuğu görüntülenecektir. (Bkz. Aşağıdaki Görsel - 1 )

  

Bileşen / Modül Listesi

Sayfanıza satır ve sütunlar ekledikten sonra her bir sütunun üzerine gelindiğinde Sütun Düzenleme Araçları görüntülenecektir. Sütun Düzenleme araçlarından Bileşen Ekle ögesine tıkladığınızda sütun içerisine ekleyebileceğiniz modül ve bileşenlerin listelendiği Bileşen Kontrol Paneli penceresi açılacaktır:

1. Bileşen Filtreleme: Bileşen Kontrol Panelinin üstünde bulunan bu şerit aracılığı ile mevcut bileşen ve modülleri türlerine göre filtreleyebilirsiniz.
   • Tümü: Tüm bileşen ve modülleri listeler.
   • Modül: Domain, Hosting, Server, SMS, Referans, Yazılım v.b. WiseCP ile ilgili sistem modüllerini listeler.
   • İçerik: Metin/HTML Kutusu v.b. İçerik kategorisindeki bileşenleri listeler.
   • Medya: Video, Resim vb. Medya kategorisindeki bileşenleri listeler.
   • Diğer: Modül, Medya ve İçerik kategorisi dışında kalan bileşenleri listeler.
   • Kayıtlı Bileşenlerim: Daha sonradan kullanmak üzere önceden oluşturup kaydettiğiniz bileşenleri listeler.
2. Bileşen Arama: Mevcut bileşenler içerisinde arama yaparak filtrelemenizi sağlar.
3. Bileşen Listesi: Listeleme sonuçlarının gösterileceği bölüm. Tüm bileşen ve modüller burada listelenir ve üzerlerine tıklayarak kolayca sütunlarınıza ekleyebilirsiniz.
4. Sayfaya Eklenmiş Bileşen/Modüller

Bileşen / Modül Ekleme

Sayfanızdaki bir sütunun üzerine gelindiğinde Sütun Düzenleme Araçları görüntülenecektir. Sütun Düzenleme araçlarından Bileşen Ekle ögesine tıkladığınızda sütun içerisine ekleyebileceğiniz modül ve bileşenlerin listelendiği Bileşen Kontrol Paneli penceresi açılacaktır. Bu pencereden sayfanıza eklemek istediğiniz bileşen/modülün üzerine tıklayarak ilgili sütuna ekleyebilirsiniz.

Bileşen / Modül Düzenleme

Sayfanızda mevcut olan ve düzenlemek istediğiniz bileşenin üzerine gelindiğinde Bileşen Düzenleme Araçları görüntülenecektir. Bileşen Düzenleme araçlarından Bileşeni Düzenle ögesine tıkladığınızda seçili bileşenin içeriğini ve stilini düzenleyebileceğiniz Bileşen Düzenleme Penceresi açılacaktır.

Bu pencerede seçtiğiniz bileşenin desteklediği özelliklere bağlı olarak her bileşen için farklı form alanları göreceksiniz. Bununla birlikte bu pencerede yer alan ve tüm bileşenlerde ortak bazı alanlarla ilgili tanımlar aşağıda verilmiştir.

Bileşen Düzenleme Penceresi Ögeleri

• Genel Ayarlar: Bileşenle ilgili genel ayarların bulunduğu bölüm.
  1. Bileşen Adı: Sitenizdeki her bir dil için bileşeninize bir isim verin. Bu isim bileşene göre değişmekle birlikte genelde sadece Yönetici bilgilendirmesi içindir. Yönetim Paneli FonPageBuilder sayfa düzenleme ekranınızdaki satır ve sütunlarda bileşen bu isimle gösterilecektir. Böylece yerleşim düzeninizdeki bileşeni doğru ve kolayca teşhis edebilir ve seçebilirsiniz.
  2. Bileşene göre Genel Ayarlar altında daha fazla alan olabilir. Bileşene özgü ayarlar için lütfen ilgili bileşen/modülün dokümantasyon sayfasına gözatın.
• Bileşen Seçenekleri: Bileşenin sahip olduğu özel yapıladırma seçenekleri burada gösterilir ve istediğiniz şekilde değiştirebilirsiniz. Bileşene özgü ayarlar için lütfen ilgili bileşen/modülün dokümantasyon sayfasına gözatın.
• Bileşen Stil Ayarları: Bileşene ait stil ayarlarını içeren bölümdür.
  1. Sınıf: Bileşen için özel CSS sınıfı/sınıfları tanımlamak isterseniz burayı kullanabilrsiniz. Daha sonra CSS stil dosyanızdan ilgili sınıf ile ilgili biçimlendirmeleri buraya başvurarak gerçekleştirebilirsiniz. Örneğin:light-grey-rounded-box
  2. Dahili Stil : Bileşen için css biçimlendirmesini harici tema css dosyalarınız yerine doğrudan bu alana yazacağınız css kodu ile gerçekleştirebilirsiniz. Eklediğiniz css biçimlendirmesini sadece bu bileşen için aktif olmasını ve aynı css sınıfına sahip olan sayfadaki diğer ögeleri etkilememesini istiyorsanız stil kodunuz içerisinde @widgetId ibaresinden sonra stil kodunuzu ekleyebilirsiniz. @widgetId önyüzde, sistem tarafından otomatik oluşturulurulan id ile değiştirilir.

     												
     @widgetId .light-grey-rounded-box{
     	background-color: #f8f9fa;
     	border: 1px solid #e9ecef;
     	border-radius: 5px;
     }
     												
     											

  3. Bileşene göre Bileşen Stil Ayarları altında daha fazla alan olabilir. Bileşene özgü ayarlar için lütfen ilgili bileşen/modülün dokümantasyon sayfasına gözatın.
• Sayfayı Kaydet Düğmesi: Bileşende gerçekleştirdiğiniz değişiklikler ve sayfada gerçekleştirdiğiniz tüm değişiklikler veritabanına kaydedilir ve aktif Bileşen Düzenleme Penceresi kapatılır.
• Kaydet & Düzenle Düğmesi: Bileşende gerçekleştirdiğiniz değişiklikler bileşen kodu içerisine kaydedilir ve aktif Bileşen Düzenleme Penceresi kapatılır. Sayfanızda yaptığınız değişikler henüz kaydedilmemiştir. Sayfanızı kaydetmek için mutlaka sayfanın sağ kenarında bulunan MENU çubuğu altından Kaydet düğmesine tıklamanız gerekir.

Bileşen / Modül Taşıma

Sayfanızda mevcut olan ve taşımak istediğiniz bileşenin üzerine gelindiğinde Bileşen Düzenleme Araçları görüntülenecektir. Bileşen Düzenleme araçlarından Bileşeni Sırala ögesine tıkladığınızda sayfanızdaki her hangi bir satır/sütun içerisine bileşeni sürükleyip bırakarak taşıyabilirsiniz.

Bileşen / Modül Çoğaltma (Klonlama)

Sayfanızda mevcut olan ve çoğaltmak istediğiniz bileşenin üzerine gelindiğinde Bileşen Düzenleme Araçları görüntülenecektir. Bileşen Düzenleme araçlarından Bileşeni Çoğalt ögesine tıkladığınızda aktif seçili bileşen içeriği ve ayarlarıyla birlikte kopyalanacaktır.

Bileşen / Modül Kaydetme

Oluşturduğunuz bir bileşeni/modülü ve içeriğini (ayarlar, stiller, veriler vb.) aynı sayfada veya daha sonra oluşturacağınız sayfalarda tekrar kullanmak isterseniz, istediğiniz bileşeni/modülü veritabanına kaydedebilir ve daha sonradan istediğiniz sayfaya ekleyebilirsiniz.

1. Bileşeni / Modülü Kaydetmek:

   Kaydetmek istediğiniz bileşenin üzerine gelindiğinde Bileşen Düzenleme Araçları görüntülenecektir. Bileşen Düzenleme araçlarından Bileşeni Kaydet ögesine tıklayın. Çıkan uyarı penceresinde bileşen/modül için istediğiniz bir isim verin ve Tamam düğmesine tıklayın. Seçili (aktif) bileşen içeriği ve ayarlarıyla birlikte veritabanına kaydedilecek ve Bileşen Kontrol Panelindeki Bileşen listesinin en sonuna eklenecektir.

2. Kayıtlı Bileşenler:

   • Bileşeni Tekrar Kullanmak İçin: Daha önceden kaydettiğiniz bir bileşeni/modülü yeni oluşturduğunuz sayfaya eklemek için normal bileşen/modül ekleme adımlarını takip edin. Kayıtlı bileşenleriniz Bileşen Kontrol Panelinde bileşen listesinin en sonunda verdiğiniz isimlerle listelenir. İsterseniz Bileşen Kontrol panelindeki Kayıtlı Bileşenlerim filtereleme menü ögesine tıklayarak kaydettiğiniz bileşenleri listeleyebilir ve istediğiniz bileşeni sayfanıza ekleyebilirsiniz.
   • Kayıtlı Bileşeni Silmek İçin: Daha önceden kaydettiğiniz bir bileşeni/modülü silmek için Bileşen Kontrol Panelindeyken fare ile kayıtlı bileşeninizin üzerine geldiğinizde, bileşen kutusunun sağ/sol üst köşesinde düğmesi görüntülenir. Bu düğmeye tıklayarak kayıtlı bileşeninizi silebilirsiniz.

Bileşen / Modül Silme

Sayfanızda mevcut olan ve silmek istediğiniz bileşenin üzerine gelindiğinde Bileşen Düzenleme Araçları görüntülenecektir. Bileşen Düzenleme araçlarından Bileşeni Sil ögesine tıkladığınızda aktif seçili bileşen içeriği ve ayarlarıyla birlikte silinecektir.