Integrează widgetul Oney 6x60 într-o singură pagină
Această pagină oferă sellerilor și echipelor tehnice un ghid clar de integrare pentru widgetul Oney 6x60: pașii de implementare, metodele disponibile, un exemplu static, un test cu preț dinamic și acces direct la documentația PDF.
Ce găsești pe această pagină
- scriptul necesar pentru încărcarea widgetului;
- pașii minimi pentru integrare într-o pagină de produs;
- referință pentru metodele
init,getCalculatorșigetOfferLogos; - un exemplu complet de cod gata de copiat;
- un demo cu preț static și test de actualizare dinamică;
- link direct și afișare inline pentru documentația PDF.
Overview
Această pagină este concepută ca punct unic de referință pentru selleri și integratori. Mai întâi prezintă integrarea de bază și exemplul static, apoi permite testarea comportamentului pentru un preț actualizat dinamic.
Încarci fișierul JS al widgetului în pagina unde vrei să apară widgetul și calculatorul.
Inițializezi rata minimă, calculatorul inline și logourile pentru un preț fix.
Reinițializezi widgetul atunci când prețul produsului se schimbă în pagină.
Quick start
Fluxul minim recomandat pentru integrarea widgetului într-o pagină de produs.
<script src="https://oneywidget.vlcstaging.com/oney6x60xwidget.js"></script>
<div id="oney-widget"></div> <div id="oney-calculator"></div> <div id="oney-logos"></div>
document.addEventListener("DOMContentLoaded", function () {
const price = 4000;
OneyInstallment.init("#oney-widget", price, {
currency: "Lei",
thousands: ".",
decimals: ","
});
OneyInstallment.getCalculator("#oney-calculator", price, {
currency: "Lei",
thousands: ".",
decimals: ","
});
OneyInstallment.getOfferLogos("#oney-logos");
});
Referință API folosită în acest demo
Mai jos sunt metodele folosite în această pagină de integrare. Ele acoperă afișarea widgetului principal, a calculatorului inline și a logourilor.
| Metodă | Scop | Semnătură | Exemplu |
|---|---|---|---|
OneyInstallment.init |
Afișează widgetul pentru un preț dat. | init(selector, amount, options) |
OneyInstallment.init("#oney-widget", 4000, options) |
OneyInstallment.getCalculator |
Încarcă simulatorul / calculatorul inline în containerul indicat. | getCalculator(selector, amount, options) |
OneyInstallment.getCalculator("#oney-calculator", 4000, options) |
OneyInstallment.getOfferLogos |
Afișează logourile Oney și ale partenerului. | getOfferLogos(selector) |
OneyInstallment.getOfferLogos("#oney-logos") |
Opțiuni de formatare
| Opțiune | Tip | Exemplu | Rol |
|---|---|---|---|
currency |
string | "Lei" |
Textul monedei afișate. |
thousands |
string | "." |
Separatorul pentru mii. |
decimals |
string | "," |
Separatorul pentru zecimale. |
Recomandări de integrare
- Inițializează widgeturile după
DOMContentLoaded. - Pentru prețuri dinamice, golește containerul înainte de reinițializare.
- Păstrează aceleași opțiuni de format numeric pentru toate componentele.
- Validează prețul înainte de apel; în acest demo, minimul acceptat este
300Lei.
Exemplu complet gata de copiat
Acesta este exemplul minim pentru integrarea într-o pagină de produs.
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Widget Rate Oney</title>
<script src="https://oneywidget.vlcstaging.com/oney6x60xwidget.js"></script>
</head>
<body>
<div id="oney-widget"></div>
<div id="oney-calculator"></div>
<div id="oney-logos"></div>
<script>
document.addEventListener("DOMContentLoaded", function () {
const price = 4000;
const options = {
currency: "Lei",
thousands: ".",
decimals: ","
};
OneyInstallment.init("#oney-widget", price, options);
OneyInstallment.getCalculator("#oney-calculator", price, options);
OneyInstallment.getOfferLogos("#oney-logos");
});
</script>
</body>
</html>
Demo live de implementare
Mai jos poți vedea mai întâi varianta standard pentru un preț fix, apoi poți testa actualizarea widgetului pentru un preț introdus manual.
1. Preț de referință
Acest preț este folosit pentru exemplul static de mai jos.
2. Widget pentru prețul static
3. Calculator inline pentru prețul static
4. Logouri Oney & Partener
5. Testare preț dinamic
După apăsarea butonului, widgetul și calculatorul de mai jos se reîncarcă pentru noua valoare introdusă.
6. Widget pentru prețul dinamic
7. Calculator inline pentru prețul dinamic
Documentație PDF
Pentru detalii suplimentare, poți consulta documentația completă în format PDF, disponibilă mai jos și într-un tab separat.