Widget Dokümantasyonu
Currency.Wiki döviz çevirici widget'ını web sitenize yerleştirme ve özelleştirme için eksiksiz rehber.
İçindekiler
1 Başlarken
Web sitenize bir döviz çevirici widget'ı eklemek çok kolay. Bu basit adımları izleyin:
- Widget Oluşturucu sayfasına gidin ve widget görünümünüzü özelleştirin
- Tercih ettiğiniz widget stilini, para birimlerini ve temayı seçin
- Oluşturulan yerleştirme kodunu (Script veya Iframe) kopyalayın
- Kodu, widget'ın görünmesini istediğiniz yere web sitenizin HTML'sine yapıştırın
İpucu: Widget Oluşturucu'daki Hızlı Başlangıç Şablonlarını kullanarak önceden yapılandırılmış bir widget ile hızlıca başlayabilirsiniz.
2 Yerleştirme Yöntemleri
Script Yerleştirme (Önerilen)
Script yerleştirme yöntemi, widget'ı doğrudan sayfanıza ekler. Para birimi açılır menüleri, kolay seçim için çevredeki içeriğin önünde görüntülenir.
<div id="currency-wiki-widget"></div>
<script src="https://widget.currency.wiki/v3/script.js?style=compact&theme=light&from=USD&to=EUR"></script>
- Açılır menüler widget konteynerinin dışında görüntülenir
- Etkileşimli para birimi seçimi için en iyisi
- Sayfanızla sorunsuz bütünleşir
Iframe Yerleştirme
Iframe yerleştirme yöntemi, widget için yalıtılmış bir konteyner oluşturur. Bu yöntem güvenlidir ve katı içerik politikalarına sahip ortamlarda çalışır.
<iframe src="https://widget.currency.wiki/v3/embed?style=compact&theme=light&from=USD&to=EUR"
width="300" height="180" frameborder="0"></iframe>
- Sayfa stillerinizden tamamen yalıtılmıştır
- Katı İçerik Güvenliği Politikaları ile çalışır
- Basit ve güvenli uygulama
Not: Tam etkileşim için Script yerleştirme kullanın (açılır menüler içeriğin üzerinde görüntülenir). Yalıtım veya CSP kısıtlamaları gerektiğinde Iframe yerleştirme kullanın.
3 Widget Stilleri
Web sitenizin tasarımına uyacak 11 farklı widget stilinden birini seçin. Her stil, farklı kullanım senaryoları ve ekran boyutları için optimize edilmiştir.
mini
250x140px
Başlıklar veya dar alanlar için mükemmel, tek satırlık kompakt çevirici.
square
250x250px
Değişim butonlu 1:1 oranlı widget. Kenar çubukları için idealdir.
compact
300x180px
Tüm temel özelliklere sahip küçük boyutlu çevirici.
inline
480x56px
Yatay düzen. İçerik veya menü içine gömmek için idealdir.
tall
200x280px
Klasik etiketli dikey kenar çubuğu düzeni.
mini-chart
250x260px
Kurs geçmişini gösteren çizgi grafikli kompakt çevirici.
multi-expandable
300x320px
Çoklu para birimi çevirici. Kullanıcılar para birimi ekleyip çıkarabilir.
multi-fixed
300x300px
Sabit döviz kuru listesi. Belirli kurları göstermek için en iyisi.
rates-compact
250x320px
Son güncelleme zamanı ile yoğun döviz kuru listesi.
rates-viewer
300x500px
Detaylı kur bilgileriyle tam grafik görünümü.
rates-viewer-compact
300x400px
Grafikli oran görüntüleyicinin kompakt versiyonu.
4 URL Parametreleri
Widget'ınızı URL parametreleriyle özelleştirin. Bu parametreler hem Script hem de Iframe yerleştirme yöntemleriyle çalışır.
| Parametre | Varsayılan | Açıklama |
|---|---|---|
| style | compact | Widget stili (mini, square, compact, inline, tall, mini-chart, multi-expandable, multi-fixed, rates-compact, rates-viewer, rates-viewer-compact) |
| theme | light | Renk teması (light, dark veya auto) |
| from | USD | Kaynak para birimi kodu (ör. USD, EUR, GBP) |
| to | EUR | Hedef para birimi kodu (ör. EUR, USD, JPY) |
| amount | 1000 | Dönüştürme için varsayılan tutar |
| accent | #2563eb | Vurgu rengi (hex formatında, # olmadan) |
| lang | en | Widget dil kodu (ör. en, es, fr, de) |
| flags | 1 | Ülke bayraklarını göster (1=göster, 0=gizle) |
| display | iso | Para birimi görüntüleme biçimi (iso=USD, symbol=$) |
| lock | 0 | Para birimlerini kilitle (1=kilitli, 0=kilitsiz) |
| currencies | EUR,GBP,JPY | Çoklu para birimi widget'ları için virgülle ayrılmış para birimi listesi |
| dropdown | all | Açılır menüdeki para birimleri (all, top10, top20 veya virgülle ayrılmış liste) |
| branding | 1 | Marka göster (1=göster, 0=gizle) |
| brandinglink | 1 | Markayı tıklanabilir yap (1=bağlantı, 0=sadece metin) |
| format | auto | Sayı biçimi (auto, us, eu, french, indian) |
| decimals | 2 | Ondalık basamak sayısı (0-6) |
| chart | 0 | Grafiği etkinleştir (1=etkin, 0=devre dışı) |
| chartperiod | 7d | Grafik dönemi (7d, 14d, 30d, 90d) |
Örnekler
Koyu tema kompakt çevirici:
?style=compact&theme=dark&from=USD&to=EUR
Çoklu para birimi döviz kurları:
?style=multi-fixed&from=USD¤cies=EUR,GBP,JPY,CAD
30 günlük grafikli mini çevirici:
?style=mini-chart&from=EUR&to=USD&chartperiod=30d
Para birimi kodları yerine sembolleri göster:
?style=compact&display=symbol&from=USD&to=EUR
Özel tutarlı kilitli para birimleri:
?style=compact&from=GBP&to=USD&lock=1&amount=100
5 Özelleştirme Seçenekleri
Tema Seçenekleri
- light - Açık arka plan, koyu metin
- dark - Koyu arka plan, açık metin
- auto - Kullanıcının sistem tercihine otomatik olarak uyum sağlar
Para Birimi Görüntüleme Biçimi
- iso - USD, EUR, GBP gibi ISO kodlarını gösterir
- symbol - $, €, £ gibi para birimi sembollerini gösterir
Sayı Biçimleri
- auto - Ziyaretçinin tarayıcı ayarlarını otomatik olarak algılar
- us - ABD biçimi: 1,234.56
- eu - Avrupa biçimi: 1.234,56
- french - Fransız biçimi: 1 234,56
- indian - Hint biçimi: 1,23,456.78
Açılır Para Birimi Seçenekleri
- all - Desteklenen tüm 170+ para birimi
- top10 - En popüler 10 para birimi
- top20 - İşlem hacmine göre en iyi 20 para birimi
- USD,EUR,GBP,... - Belirli para birimlerinden oluşan özel liste
İpucu: Tüm bu seçenekleri görsel olarak yapılandırmak ve yerleştirme kodunu otomatik olarak oluşturmak için Widget Oluşturucu'yu kullanın.
6 Sorun Giderme
Widget Görünmüyor
Yerleştirme kodunun HTML'nizde doğru şekilde yerleştirildiğinden emin olun. Script yerleştirme için, doğru ID'ye sahip konteyner div'in mevcut olduğundan emin olun. Tarayıcı konsolunuzda JavaScript hatalarını kontrol edin.
Açılır Menü Çalışmıyor
Iframe yerleştirme kullanıyorsanız, açılır menüler widget alanı içinde kaydırılır. Tam açılır menü işlevselliği için script yerleştirme yöntemini kullanın.
Stil Çakışmaları
Web sitenizin CSS'si widget görünümünü etkiliyorsa, widget stillerini sayfanızdan yalıtmak için iframe yerleştirme yöntemini deneyin.
İçerik Güvenliği Politikası Sorunları
Katı bir CSP'niz varsa, script-src ve frame-src yönergelerinize currency.wiki'yi eklemeniz gerekebilir. Örnek: script-src 'self' currency.wiki; frame-src 'self' currency.wiki;
Yardıma mı ihtiyacınız var?
Aradığınızı bulamadınız mı? Destek ekibimiz size yardımcı olmaktan mutluluk duyar.
