Widget-dokumentasjon
Fullstendig guide til innbygging og tilpasning av Currency.Wiki valutakalkulator-widget på ditt nettsted.
Innholdsfortegnelse
1 Komme i gang
Det er enkelt å legge til en valutakalkulator-widget på ditt nettsted. Følg disse enkle trinnene:
- Gå til Widget Builder-siden og tilpass utseendet på widgeten
- Velg ønsket widget-stil, valutaer og tema
- Kopier den genererte innbyggingskoden (Script eller Iframe)
- Lim inn koden i HTML-en på ditt nettsted der du vil at widgeten skal vises
Tips: Bruk Hurtigstart-maler i Widget Builder for å komme raskt i gang med en forhåndskonfigurert widget.
2 Innbyggingsmetoder
Script-innbygging (anbefalt)
Script-innbyggingsmetoden setter inn widgeten direkte på siden din. Valutanedtrekksmenyer vises foran omkringliggende innhold for enkel valg.
<div id="currency-wiki-widget"></div>
<script src="https://widget.currency.wiki/v3/script.js?style=compact&theme=light&from=USD&to=EUR"></script>
- Nedtrekk vises utenfor widget-beholderen
- Best for interaktiv valutavalg
- Sømløs integrasjon med din side
Iframe-innbygging
Iframe-innbyggingsmetoden lager en isolert beholder for widgeten. Denne metoden er sikker og fungerer i miljøer med strenge innholdspolicyer.
<iframe src="https://widget.currency.wiki/v3/embed?style=compact&theme=light&from=USD&to=EUR"
width="300" height="180" frameborder="0"></iframe>
- Fullstendig isolert fra sidens stilark
- Fungerer med strenge Content Security Policies
- Enkel og sikker implementering
Merk: Bruk Script-innbygging for full interaktivitet (nedtrekk vises over innhold). Bruk Iframe-innbygging hvis du trenger isolasjon eller har CSP-begrensninger.
3 Widget-stiler
Velg mellom 11 ulike widget-stiler for å matche designet på ditt nettsted. Hver stil er optimalisert for ulike bruksområder og visningsstørrelser.
mini
250x140px
Kompakt énlinjes kalkulator. Perfekt for topptekster eller trange områder.
square
250x250px
1:1-forhold med bytteknapp. Flott for sidepaneler.
compact
300x180px
Liten kalkulator med alle nødvendige funksjoner.
inline
480x56px
Horisontal layout. Ideell for innbygging i innhold eller navigasjon.
tall
200x280px
Vertikal sidepanel-layout med klassiske etiketter.
mini-chart
250x260px
Kompakt kalkulator med minidiagram for kursutvikling.
multi-expandable
300x320px
Flervalutakalkulator. Brukere kan legge til/fjerne valutaer.
multi-fixed
300x300px
Fast liste med valutakurser. Best for å vise spesifikke kurser.
rates-compact
250x320px
Kondensert kursliste med siste oppdateringstid.
rates-viewer
300x500px
Fullt diagramvisning med detaljert kursinformasjon.
rates-viewer-compact
300x400px
Kompakt versjon av kursvisning med diagrammer.
4 URL-parametere
Tilpass widgeten din med URL-parametere. Disse fungerer med både Script- og Iframe-innbygging.
| Parameter | Standard | Beskrivelse |
|---|---|---|
| style | compact | Widget-stil (mini, square, compact, inline, tall, mini-chart, multi-expandable, multi-fixed, rates-compact, rates-viewer, rates-viewer-compact) |
| theme | light | Fargetema (light, dark eller auto) |
| from | USD | Kildevalutakode (f.eks. USD, EUR, GBP) |
| to | EUR | Målvalutakode (f.eks. EUR, USD, JPY) |
| amount | 1000 | Standardbeløp for konvertering |
| accent | #2563eb | Aksentfarge i hex-format (uten #) |
| lang | en | Widget-språkkode (f.eks. en, es, fr, de) |
| flags | 1 | Vis flagg (1=vis, 0=skjul) |
| display | iso | Valutavisningsformat (iso=USD, symbol=$) |
| lock | 0 | Lås valutaer (1=låst, 0=ulåst) |
| currencies | EUR,GBP,JPY | Kommaseparert liste med valutaer for flervaluta-widgeter |
| dropdown | all | Valutaer i nedtrekk (all, top10, top20 eller kommaseparert liste) |
| branding | 1 | Vis profilering (1=vis, 0=skjul) |
| brandinglink | 1 | Gjør profilering klikkbar (1=lenke, 0=kun tekst) |
| format | auto | Tallformat (auto, us, eu, french, indian) |
| decimals | 2 | Antall desimaler (0-6) |
| chart | 0 | Aktiver diagram (1=aktivert, 0=deaktivert) |
| chartperiod | 7d | Diagramperiode (7d, 14d, 30d, 90d) |
Eksempler
Mørkt tema, kompakt kalkulator:
?style=compact&theme=dark&from=USD&to=EUR
Flervalutakurser:
?style=multi-fixed&from=USD¤cies=EUR,GBP,JPY,CAD
Minikalkulator med 30-dagers diagram:
?style=mini-chart&from=EUR&to=USD&chartperiod=30d
Vis valutasymboler i stedet for koder:
?style=compact&display=symbol&from=USD&to=EUR
Låste valutaer med egendefinert beløp:
?style=compact&from=GBP&to=USD&lock=1&amount=100
5 Tilpasningsmuligheter
Temaalternativer
- light - Lys bakgrunn med mørk tekst
- dark - Mørk bakgrunn med lys tekst
- auto - Tilpasser seg automatisk brukerens systeminnstilling
Valutavisningsformat
- iso - Viser ISO-koder som USD, EUR, GBP
- symbol - Viser valutasymboler som $, €, £
Tallformater
- auto - Oppdager automatisk besøkendes nettleserinnstillinger
- us - US-format: 1,234.56
- eu - Europeisk format: 1.234,56
- french - Fransk format: 1 234,56
- indian - Indisk format: 1,23,456.78
Valutaalternativer i nedtrekk
- all - Alle 170+ støttede valutaer
- top10 - Topp 10 mest populære valutaer
- top20 - Topp 20 valutaer etter handelsvolum
- USD,EUR,GBP,... - Egendefinert liste over spesifikke valutaer
Tips: Bruk Widget Builder for å visuelt konfigurere alle disse alternativene og generere innbyggingskoden automatisk.
6 Feilsøking
Widget vises ikke
Sørg for at innbyggingskoden er plassert riktig i HTML-en. For script-innbygging, sjekk at container-diven eksisterer med riktig ID. Sjekk nettleserkonsollen for JavaScript-feil.
Nedtrekk fungerer ikke
Ved bruk av iframe-innbygging vil nedtrekk rulle inne i widgetområdet. For full nedtrekksfunksjonalitet med overlegg, bruk script-innbyggingsmetoden i stedet.
Stilkonflikter
Hvis nettstedets CSS påvirker widgetens utseende, prøv iframe-innbyggingsmetoden som isolerer widgetens stil fra siden.
Content Security Policy-problemer
Hvis du har en streng CSP, må du kanskje legge til currency.wiki i dine tillatte script-src og frame-src direktiver. Eksempel: script-src 'self' currency.wiki; frame-src 'self' currency.wiki;
Trenger du hjelp?
Finner du ikke det du leter etter? Vårt supportteam er her for å hjelpe.
