Build a Gold Jewelry Price Calculator with JavaScript
Build a gold jewelry price calculator from live per-gram karat prices, with exact decimal math, caching, margins, and clear valuation limits.
Baca →Tambahkan widget harga emas live gratis dan bisa dikonfigurasi ke WordPress dengan satu iframe. Berfungsi di Gutenberg dan Elementor, tanpa API key, tanpa plugin.
Jika Anda mengelola blog finansial, situs dealer, atau halaman portofolio di WordPress, Anda bisa menambahkan harga emas live tanpa plugin, tanpa API key, dan tanpa PHP sama sekali. Configurator widget harga emas membuat satu iframe untuk Anda. Tempelkan ke blok Custom HTML atau widget HTML Elementor dan langsung berfungsi.
Buka goldprice.dev/widgets/gold-price. Tidak perlu signup dan tidak perlu API key. Pilih mata uang, unit (troy ounce atau gram), karat, tema, dan bahasa, lalu halaman tersebut membangun iframe yang sesuai untuk Anda. Salin potongan kode itu dan gunakan di salah satu metode instalasi di bawah.
Jika Anda melewatkan configurator dan hanya ingin nilai default, inilah iframe yang dihasilkan untuk USD, troy ounce, 24 karat, tema auto, dan bahasa Inggris:
<iframe src="https://goldprice.dev/embed/xau?currency=USD&unit=oz&karat=24&theme=auto&locale=en" title="Live gold price" width="360" height="190" loading="lazy" style="border:0;width:100%;max-width:360px" referrerpolicy="strict-origin-when-cross-origin"></iframe>
Widget ini memperbarui dirinya sendiri setiap 60 detik. Widget ini di-hosting oleh goldprice.dev, sehingga tidak ada API key yang pernah sampai ke source halaman Anda.
WordPress self-hosted biasanya menyimpan ini dengan benar untuk seorang administrator. Jika Anda login sebagai editor atau contributor tanpa kapabilitas unfiltered_html, WordPress akan menghapus tag <iframe> saat disimpan dan blok tersebut menjadi kosong. Lihat dokumentasi blok Custom HTML milik WordPress sendiri untuk bagaimana kapabilitas itu diberikan. Perbaikannya adalah meminta seorang administrator menempelkan blok tersebut, atau memberikan role unfiltered_html.
Blok Custom HTML yang sama berfungsi di luar isi post. Di Appearance → Widgets, tambahkan widget Custom HTML ke sidebar atau area footer mana pun dan tempelkan potongan iframe Anda. Pada block theme, tambahkan blok Custom HTML ke template part, seperti sidebar atau template halaman, melalui Site Editor. Bagaimanapun caranya, widget ini tampil di mana pun blok tersebut ditempatkan, dan memperbarui dirinya sendiri.
Widget HTML milik Elementor merender markup mentah secara langsung, termasuk iframe, tanpa menghapus apa pun. Lihat panduan widget HTML milik Elementor untuk lebih lanjut soal posisinya dibandingkan opsi embed lain.
Configurator mengatur ini sebagai query parameter pada src iframe. Nilai yang tidak dikenali cukup jatuh kembali ke default, sehingga typo tidak akan merusak embed.
| Parameter | Nilai | Default | Fungsinya |
|---|---|---|---|
currency | 31 opsi: USD, EUR, GBP, JPY, AUD, CAD, CHF, CNY, INR, IDR, dan 21 lainnya | USD | Mata uang kuotasi untuk harga yang ditampilkan |
unit | oz, gram | oz | Harga per troy ounce atau per gram |
karat | 24, 22, 21, 20, 18, 16, 14, 10 | 24 | Kemurnian yang digunakan saat unit=gram |
theme | auto, light, dark | auto | Terang, gelap, atau mengikuti pengaturan sistem pengunjung |
locale | en, ar, es, id, ja, ko, zh | en | Bahasa dan format angka pada kartu |
Anda jarang perlu membangun URL ini secara manual. Atur opsinya di configurator dan salin iframe yang dihasilkannya.
Ruang kosong di tempat iframe seharusnya berada, WordPress self-hosted. Hampir selalu masalah kapabilitas unfiltered_html di atas: block editor diam-diam menghapus tag saat disimpan. Tambahkan ulang bloknya sebagai administrator, atau periksa konten post yang tersimpan di code view editor untuk melihat iframe yang terpotong.
Tidak ada yang tampil di WordPress.com. Paket gratis dan tier bawah WordPress.com tidak mengizinkan embed iframe kustom di blok Custom HTML; Anda memerlukan paket dengan fitur hosting yang diaktifkan. Lihat halaman dukungan blok Custom HTML milik WordPress.com untuk paket mana saja yang memenuhi syarat.
Widget termuat tetapi terlihat terpotong. Kartunya memerlukan lebar minimal 320px dan tinggi minimal 190px. Jika sidebar atau kolom konten tema Anda lebih sempit dari itu, tempatkan widget di area full-width alih-alih mengecilkannya.
Iframe ini mencakup mata uang, unit, karat, tema, dan bahasa, tetapi tetap saja kartu dengan layout tetap. Jika Anda ingin harga tertanam di dalam komponen Anda sendiri alih-alih iframe, desain yang tidak dijangkau oleh opsi tema, atau data historis untuk chart buatan Anda sendiri, gunakan API mentah sebagai gantinya dan bangun tampilannya sendiri. Konverter harga emas adalah contoh kerja dari seperti apa itu untuk konversi mata uang dan unit.
Iframe resmi ini gratis untuk ditanamkan di situs personal maupun komersial selama tetap tidak dimodifikasi dan atribusi yang terlihat tetap utuh. White-labeling atau menyajikannya sebagai feed milik Anda sendiri memerlukan perjanjian Enterprise terpisah. Data API mentah yang digunakan dalam produk Anda sendiri mengikuti lisensi komersial normal mulai dari paket Pro. Ketentuan lengkap ada di Terms of Service dan panduan atribusi.
panduan terkait
Build a gold jewelry price calculator from live per-gram karat prices, with exact decimal math, caching, margins, and clear valuation limits.
Baca →Build a reproducible local-currency gold backtest from settled XAU/USD bars and dated FX observations, without inserting future rates into historical rows.
Baca →The real-time gold streaming questions that come up on Reddit, answered: whether a gold WebSocket exists, how the goldprice.dev XAU and XAG tick stream works end to end, and which other APIs actually offer one (most metals APIs just poll).
Baca →goldprice.dev
Harga emas real-time, OHLC historis, dan agregasi multi-sumber — tersedia via REST dan SSE.