Dokumentacija widgeta
Kompletan vodič za ugrađivanje i prilagođavanje Currency.Wiki widgeta za konverziju valuta na vašu web stranicu.
Sadržaj
1 Početak
Dodavanje widgeta za konverziju valuta na vašu web stranicu je jednostavno. Slijedite ove korake:
- Idite na stranicu Kreatora widgeta i prilagodite izgled widgeta
- Odaberite željeni stil widgeta, valute i temu
- Kopirajte generisani kod za ugrađivanje (skript ili iframe)
- Zalijepite kod u HTML vaše web stranice gdje želite da se widget pojavi
Savjet: Koristite brze početne predloške u Kreatoru widgeta za brzi početak sa unaprijed konfiguriranim widgetom.
2 Metode ugrađivanja
Skript ugrađivanje (preporučeno)
Metoda skript ugrađivanja direktno ubacuje widget na vašu stranicu. Padajući meniji valuta će se prikazivati ispred okolnog sadržaja radi lakšeg izbora.
<div id="currency-wiki-widget"></div>
<script src="https://widget.currency.wiki/v3/script.js?style=compact&theme=light&from=USD&to=EUR"></script>
- Padajući meniji izvan kontejnera widgeta
- Najbolje za interaktivni izbor valuta
- Besprijekorna integracija sa vašom stranicom
Iframe ugrađivanje
Metoda iframe ugrađivanja kreira izolovani kontejner za widget. Ova metoda je sigurna i radi u okruženjima sa strogim sigurnosnim politikama sadržaja.
<iframe src="https://widget.currency.wiki/v3/embed?style=compact&theme=light&from=USD&to=EUR"
width="300" height="180" frameborder="0"></iframe>
- Potpuno izolovano od stilova vaše stranice
- Radi sa strogim sigurnosnim politikama sadržaja
- Jednostavna i sigurna implementacija
Napomena: Koristite skript ugrađivanje za punu interaktivnost (padajući meniji iznad sadržaja). Koristite iframe ugrađivanje kada vam je potrebna izolacija ili imate CSP ograničenja.
3 Stilovi widgeta
Birajte između 11 različitih stilova widgeta kako biste uskladili dizajn vaše web stranice. Svaki stil je optimiziran za različite slučajeve upotrebe i veličine prikaza.
mini
250x140px
Kompaktni konverter u jednom redu. Idealan za zaglavlja ili uske prostore.
square
250x250px
Widget omjera 1:1 sa dugmetom za zamjenu. Odlično za bočne trake.
compact
300x180px
Konverter male površine sa svim osnovnim funkcijama.
inline
480x56px
Horizontalni raspored. Idealan za ugrađivanje unutar sadržaja ili navigacije.
tall
200x280px
Vertikalni raspored bočne trake sa klasičnim oznakama.
mini-chart
250x260px
Kompaktni konverter sa mini grafom koji prikazuje historiju kursa.
multi-expandable
300x320px
Konverter za više valuta. Korisnici mogu dodavati/uklanjati valute.
multi-fixed
300x300px
Fiksna lista deviznih kurseva. Najbolje za prikaz specifičnih kurseva.
rates-compact
250x320px
Sažeta lista deviznih kurseva sa vremenom posljednjeg ažuriranja.
rates-viewer
300x500px
Puni prikaz grafikona sa detaljnim informacijama o kursu.
rates-viewer-compact
300x400px
Kompaktna verzija prikaza kurseva sa grafikonima.
4 URL parametri
Prilagodite svoj widget pomoću URL parametara. Ovi parametri rade sa obje metode ugrađivanja: skript i iframe.
| Parametar | Podrazumijevano | Opis |
|---|---|---|
| style | compact | Stil widgeta (mini, square, compact, inline, tall, mini-chart, multi-expandable, multi-fixed, rates-compact, rates-viewer, rates-viewer-compact) |
| theme | light | Boja teme (svijetla, tamna ili automatski) |
| from | USD | Kod izvorne valute (npr. USD, EUR, GBP) |
| to | EUR | Kod ciljne valute (npr. EUR, USD, JPY) |
| amount | 1000 | Podrazumijevani iznos za konverziju |
| accent | #2563eb | Boja naglaska u hex formatu (bez #) |
| lang | en | Kod jezika widgeta (npr. en, es, fr, de) |
| flags | 1 | Prikaži zastave država (1=prikaži, 0=sakrij) |
| display | iso | Format prikaza valute (iso=USD, symbol=$) |
| lock | 0 | Zaključaj valute (1=zaključano, 0=otključano) |
| currencies | EUR,GBP,JPY | Zarezom odvojena lista valuta za widgete sa više valuta |
| dropdown | all | Valute u padajućem meniju (all, top10, top20 ili zarezom odvojena lista) |
| branding | 1 | Prikaži brendiranje (1=prikaži, 0=sakrij) |
| brandinglink | 1 | Brendiranje kao link (1=link, 0=samo tekst) |
| format | auto | Format broja (auto, us, eu, french, indian) |
| decimals | 2 | Broj decimalnih mjesta (0-6) |
| chart | 0 | Omogući grafikon (1=omogućeno, 0=onemogućeno) |
| chartperiod | 7d | Period grafikona (7d, 14d, 30d, 90d) |
Primjeri
Kompaktni konverter sa tamnom temom:
?style=compact&theme=dark&from=USD&to=EUR
Devizni kursevi za više valuta:
?style=multi-fixed&from=USD¤cies=EUR,GBP,JPY,CAD
Mini konverter sa 30-dnevnim grafom:
?style=mini-chart&from=EUR&to=USD&chartperiod=30d
Prikaz simbola valuta umjesto kodova:
?style=compact&display=symbol&from=USD&to=EUR
Zaključane valute sa prilagođenim iznosom:
?style=compact&from=GBP&to=USD&lock=1&amount=100
5 Opcije prilagođavanja
Opcije teme
- light - Svijetla pozadina sa tamnim tekstom
- dark - Tamna pozadina sa svijetlim tekstom
- auto - Automatski se prilagođava postavkama sistema korisnika
Format prikaza valute
- iso - Prikazuje ISO kodove kao USD, EUR, GBP
- symbol - Prikazuje simbole valuta kao $, €, £
Formati brojeva
- auto - Automatski detektuje postavke pretraživača posjetioca
- us - US format: 1,234.56
- eu - Evropski format: 1.234,56
- french - Francuski format: 1 234,56
- indian - Indijski format: 1,23,456.78
Opcije valuta u padajućem meniju
- all - Sve podržane valute (170+)
- top10 - Top 10 najpopularnijih valuta
- top20 - Top 20 valuta po obimu trgovanja
- USD,EUR,GBP,... - Prilagođena lista specifičnih valuta
Savjet: Koristite Kreator widgeta za vizuelno podešavanje svih ovih opcija i automatsko generisanje koda za ugrađivanje.
6 Rješavanje problema
Widget se ne prikazuje
Provjerite da li je kod za ugrađivanje ispravno postavljen u vašem HTML-u. Za skript ugrađivanje, provjerite da li kontejner div postoji sa ispravnim ID-om. Provjerite konzolu pretraživača za JavaScript greške.
Padajući meni ne radi
Ako koristite iframe ugrađivanje, padajući meniji će se skrolovati unutar područja widgeta. Za punu funkcionalnost padajućih menija sa preklapanjem, koristite skript ugrađivanje.
Sukob stilova
Ako CSS vaše stranice utiče na izgled widgeta, pokušajte koristiti iframe ugrađivanje koje izoluje stilove widgeta od vaše stranice.
Problemi sa politikom sigurnosti sadržaja
Ako imate strogu CSP, možda ćete morati dodati currency.wiki u dozvoljene direktive script-src i frame-src. Primjer: script-src 'self' currency.wiki; frame-src 'self' currency.wiki;
Trebate pomoć?
Ne možete pronaći ono što tražite? Naš tim za podršku je tu da pomogne.
