FonPageBuilder Kampanyalar Bileşeni Son Güncelleme: 04-07-2026
Kampanyalar Bileşeni Nedir?
FonPageBuilder Kampanya Kutusu bileşeni ile sayfalarınızda dikkat çekici kampanyalarınızı manual olarak gösterebilir ve isterseniz karusel slaytları oluşturabilirsiniz.
Kampanya Kutusu Bileşenini sayfanıza ekledikten sonra Bileşen Düzenleme Araçlarındaki Bileşeni Düzenle ögesine tıkladığınızda açılan Bileşen Düzenleme Penceresindeki ögelerin detaylarına aşağıda erişebilirsiniz.
Genel Ayarlar
- 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.
Bileşen Seçenekleri
- Stil: Kampanya Kutusu bileşeninin sayfanızda hangi stilde gösterilmesini istediğinizi seçin.
STİL ÖNİZLEMELERİ
Kampanya Kutusu Bileşeni gösterim stili demolarını görüntülemek için Kampanya Kutusu Stilleri sayfasını ziyaret edebilirsiniz.
- Simge Göster: Kampanya kutusu içerisinde simge göstermek istiyorsanız bu seçeneği "Evet" olarak seçin.
- İndirim Oranını Göster: Kampanya kutusu içerisinde gireceğiniz eski ve yeni fiyat arasındaki indirim miktarını yüzde olarak göstermek istiyorsanız bu seçeneği "Evet" olarak seçin.
- Sütun Sayısı: Kampanya kutularının yatay düzlemde kaç sütunda gösterileceğini (bir satırda kaç kampanya) responsive olarak her bir ekran çözünürlüğü için belirtebilirsiniz.
- Karusel Kullan: Kampanyalarınız için karusel slaydı oluşturmak isterseniz bu seçeneği aktifleştirin.
- Yönlendirme Kontrolleri: Kampanyalar karusel slaydında "Önceki" ve "Sonraki" ok işaretlerinin gösterilip gösterilmeyeceğini seçin. Bu alan, "Karusel Kullan" seçeneği etkinleştirilmişse gösterilir. Bkz. Görsel - 1 Nolu Ögeler:

- Sayfalandırma: Kampanyalar karusel slaydının altında kaç adet slayt olduğunu gösteren "Dairesel Sayfalandırma" ögesinin gösterilip gösterilmeyeceğini seçin. Bu alan, "Karusel Kullan" seçeneği etkinleştirilmişse gösterilir. Bkz. Görsel - 2 Nolu Öge:

- Otomatik Oynatma: Kampanyalar karusel slaydının otomatik olarak başlatılıp başlatılmayacağını seçin. Bu alan, "Karusel Kullan" seçeneği etkinleştirilmişse gösterilir.
- Üzerine Geldiğinde Duraklat: Kampanyalar karusel slaydının fare ile üzerine gelindiğinde slaydı duraklatmak istiyorsanız etkinleştirin. Bu alan, "Karusel Kullan" seçeneği etkinleştirilmişse gösterilir.
- Döngü: Kampanyalar karusel slaydının sürekli tekrar edecek şekilde kesintisiz kaymasını istiyorsanız etkinleştirin. Bu alan, "Karusel Kullan" seçeneği etkinleştirilmişse gösterilir.
İçerik Ayarları
Kampanya Kutusu İçerik Ayarları bölümündeki Kampanyalar - Ögeler başlığının karşısındaki Ekle düğmesine tıklayarak birden fazla Kampanya Ögesi ekleyebilirsiniz. İlk ögenin bir kopyası alınarak çoğaltılır. Eklediğiniz her bir ögenin başlığının karşısındaki simgeler aracılığıyla ögeyi; düzenleyebilir, sıralayabilir ve silebililirsiniz.
Kampanya Öge Düzenleme Penceresi:
- Ürün/Hizmet Adı: Sitenizdeki aktif her bir dil için Kampanya kutusunda gösterilmesini istediğiniz ürün/hizmet adını girin. Örn: Hosting Paketleri
- Etiket: Kampanya kutusunda göstermek istediğiniz kısa ve öne çıkarıcı etiket metnini girin. Örn: Sınırllı Süreli Teklif veya Cazip Fırsatlar v.b.
- Tutar: Kampanya kutusunda göstermek istediğiniz kampanya tutarlarını burada belirtebilirsiniz.
- Eski Fiyat: Ürün/Hizmet için eski fiyatı, para birimi olmadan girin. Bu fiyat site önyüzünde üzeri çizili olarak gösterilecektir. Örn:
₺99 - Yeni Fiyat: Ürün/Hizmet için yeni (kampanyalı) fiyatı, para birimi olmadan girin.
- Para Birimi: Fiyatlar için kullanılacak para birimini seçin.
- Eski Fiyat: Ürün/Hizmet için eski fiyatı, para birimi olmadan girin. Bu fiyat site önyüzünde üzeri çizili olarak gösterilecektir. Örn:
- Simge: Kampanya Kutusunda gösterilmesini istediğiniz FontAwesome simgesini seçin.
- Link: Kampanya kutusuna tıklanıldığında kullanıcıları belirli bir web sayfasına yönlendirmek istiyorsanız bu alana url adresini girin.
- Link Hedefi: Kampanya kutusuna tıklanıldığında "Link" alanında girilen adresin aynı tarayıcı penceresinde mi yeni tarayıcı penceresinde mi açılacağını seçin.
- _self : Aynı Tarayıcı Penceresi
- _blank : Yeni Tarayıcı Penceresi
Bileşen Stil Ayarları
- 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 - 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
@widgetIdibaresinden sonra stil kodunuzu ekleyebilirsiniz. @widgetId önyüzde, sistem tarafından otomatik oluşturulurulan id ile değiştirilir. Kampanya Bileşeni içerisinde biçimlendirebileceğiniz css sınıflarını, site önyüzünüzde bileşenin bulunduğu sayfadayken Tarayıcınızda F12 - Geliştirici araçlarından Code Inspection ile.fon-campaign-widgetcss sınıfı altından inceleyebilirsiniz.@widgetId .light-grey-rounded-box{ background-color: #f8f9fa; border: 1px solid #e9ecef; border-radius: 5px; }
Bileşen Penceresi Kayıt Düğmeleri
- Sayfayı Kaydet: 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: 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.




