أداة مجانية لأصحاب المواقع

أداة جدول أسعار الصرف لموقعك الإلكتروني

صمّم جدول أسعار صرف متعدد العملات لموقعك أو مدونتك. اختر العملة الأساسية، وحدد العملات المراد عرضها، وفعّل الحاسبة التفاعلية المدمجة، ثم انسخ كود التضمين.

1. اللغة والعملة الأساسية والمبلغ

2. العملات المقابلة وخيارات العرض

3. المظهر والألوان

كود التضمين لموقعك

انسخ هذا الكود والصقه في المكان الذي تريد ظهور جدول العملات فيه داخل موقعك.

أداة جدول أسعار الصرف: دليل التضمين والاستخدام

اعرض جدولًا حيًا وقابلًا للتخصيص لأسعار صرف العملات على موقعك الإلكتروني. تتابع أداة جدول أسعار الصرف أكثر من 150 عملة عالمية والمعادن الثمينة والبيتكوين مقابل أي عملة أساسية تختارها، مع أعلام الدول ومؤشرات الارتفاع والانخفاض وحاسبة مدمجة اختيارية.

1. البدء السريع: تضمين الأداة في موقعك

تضمين جدول أسعار الصرف سهل ومباشر. أضف كود السكربت وعنصر HTML المخصص داخل وسم <body> في المكان الذي ترغب بظهور الجدول فيه:

<!-- تحميل محرك الأداة -->
<script src="https://www.forexinvestors.com/widgets/exchange-rates/widget.js"></script>

<!-- عنصر جدول أسعار الصرف -->
<currency-widget 
  lang="ar" 
  base="USD" 
  cross="AUD,CAD,CHF,EUR,GBP,INR,JPY" 
  display="code" 
  calc="off" 
  amount="1" 
  theme="default" 
  border-radius="5">
</currency-widget>

نصيحة للأداء: يكفي استيراد ملف السكربت widget.js مرة واحدة فقط في الصفحة، حتى عند تضمين عدة جداول بعملات أساسية مختلفة في نفس الصفحة.

2. خصائص التخصيص والإعدادات

يمكنك ضبط العملة الأساسية وقائمة العملات المقابلة ووضع الحاسبة والمظهر اللوني عبر تعديل الخصائص على عنصر <currency-widget>:

الخاصية النوع القيمة الافتراضية الوصف
lang نص (String) en تحدد لغة الواجهة لأسماء العملات المترجمة وتنسيق التاريخ (en، ar، fr، es، ru).
base نص (String) USD رمز العملة الأساسية المرجعية المعروضة في رأس الجدول (معيار ISO 4217 بالإضافة إلى BTC، XAU، XAG، XPT؛ مثل USD، EUR، GBP، SAR).
cross نص (String) USD,EUR,GBP,AUD,CHF,CAD,INR قائمة مفصولة بفواصل لرموز العملات المقابلة المراد عرضها في صفوف الجدول (مثل EUR,GBP,JPY,CAD,AUD,CHF). يتم استبعاد العملة المطابقة لـ base تلقائيًا.
display نص (String) code طريقة عرض اسم العملة في كل صف: code لعرض رمز العملة (مثل EUR) أو name لعرض الاسم الكامل المترجم للعملة.
calc نص (String) off تفعيل أو تعطيل الحاسبة التفاعلية المدمجة (on أو off). عند تفعيلها on تتحول خانات الأسعار إلى حقول إدخال قابلة للتعديل.
amount رقم (Number) 1 المبلغ الافتراضي للعملة الأساسية الذي تُضرب فيه جميع أسعار الصرف المعروضة (أي رقم موجب، مثل 1، 10، 100).
theme نص (String) default اختيار نمط الألوان: default، blue، green، yellow، red، ocean، purple، teal، dark، rose، أو custom.
border-radius رقم (Number) 5 درجة استدارة الحواف بالبكسل لإطار الأداة (عدد صحيح من 0 إلى 20 في أداة الإعداد، مثل 0، 5، 12).

خصائص ألوان المظهر المخصص (Custom Theme)

عند ضبط theme="custom"، يمكنك تخصيص ألوان الأداة باستخدام أكواد الألوان السداسية المكونة من 6 خانات (بدون علامة #):

الخاصية القيمة الافتراضية الوصف
bg-color F6F6F6 لون خلفية حاوية الأداة والصفوف الفردية في الجدول.
border-color BCBCBC لون الإطار الخارجي للأداة وحقول إدخال الحاسبة.
text-color 222222 لون النص الأساسي لأسماء العملات والأسعار والتاريخ.
input-bg-color FFFFFF لون خلفية الصفوف الزوجية في الجدول وحقول إدخال الحاسبة.
bg-color-button 535353 لون خلفية أزرار الشريط السفلي (FI و+).
button-border-color 2E2E2E لون إطار أزرار الشريط السفلي.
button-hover-color 8A8A8A لون خلفية شريط رأس الجدول (<th>) ولون التمييز عند تمرير المؤشر فوق الصفوف والأزرار.

3. مميزات الأداة للمستخدم النهائي

يستفيد زوار موقعك عند تصفح جدول أسعار الصرف من المزايا المدمجة التالية:

  • جدول عملات متعدد قابل للتخصيص: متابعة أسعار الصرف الحية لأي مجموعة من أكثر من 150 عملة عالمية والمعادن الثمينة (XAU، XAG، XPT) والبيتكوين (BTC) مقابل العملة الأساسية المختارة.
  • مؤشرات لونية للارتفاع والانخفاض: تلوّن الصفوف تلقائيًا اتجاه السعر مقارنة باليوم السابق؛ باللون الأخضر عند الارتفاع وباللون الأحمر عند الانخفاض.
  • حاسبة تفاعلية متعددة الصفوف (calc="on"): عند تفعيلها، يمكن للزائر كتابة أي مبلغ في خانة العملة الأساسية أو في أي صف عملة فرعية لإعادة حساب جميع العملات الأخرى في الجدول فورًا.
  • عرض الرموز أو الأسماء الكاملة مع الأعلام: اختر رموز ISO المختصرة (EUR، GBP) للأعمدة الجانبية الضيقة أو الأسماء الكاملة المترجمة للعملات مع أعلام الدول وتلميحات الأسماء.
  • عزل التنسيقات عبر Shadow DOM وتباين تلقائي: تعمل الأداة داخل بيئة Shadow DOM معزولة لضمان عدم تعارض تنسيقات جداول موقعك مع الأداة، مع حساب تلقائي لتباين نصوص الرأس والأزرار.
  • توقيت آخر تحديث للأسعار: تعرض الأداة تاريخ ووقت آخر مزامنة لأسعار السوق في الشريط السفلي إلى جانب روابط سريعة لمصدر البيانات (FI) وصفحة إعداد الأداة (+).

4. تعليمات التضمين في أنظمة إدارة المحتوى (CMS)

ووردبريس (WordPress / Gutenberg & Elementor)

  1. أضف مكوّن HTML مخصص (Custom HTML) في المقال أو الصفحة أو الشريط الجانبي.
  2. الصق كود السكربت وعنصر <currency-widget> الناتج أعلاه.
  3. احفظ الصفحة أو انشرها.

Webflow وWix وShopify

  1. أدرج عنصر تضمين كود مخصص (Embed / Custom Code) في تخطيط الصفحة.
  2. الصق كود تضمين الأداة.
  3. تأكد من أن عرض الحاوية الأب لا يقل عن 240px إلى 340px (استخدم display="code" في الأعمدة الضيقة).

5. الأسئلة الشائعة (FAQ)

كم مرة يتم تحديث أسعار الصرف في الجدول؟

يتم تحديث أسعار الصرف كل 5 دقائق من مصادر بيانات سوق العملات الحية. يوضح الطابع الزمني أسفل الجدول وقت آخر تحديث.

ماذا تعني الألوان الخضراء والحمراء في أسعار الصرف؟

يشير اللون الأخضر إلى ارتفاع سعر الصرف مقارنة بالسعر اليومي السابق، بينما يشير اللون الأحمر إلى انخفاضه. وعند تفعيل calc="on" تتلون خلفية حقول الإدخال بدرجات هادئة من الأخضر والأحمر للحفاظ على وضوح القراءة.

هل يمكنني وضع أكثر من جدول أسعار صرف في نفس الصفحة؟

نعم. يمكنك إضافة عدة عناصر <currency-widget> بعملات أساسية أو قوائم عملات أو قوالب ألوان مختلفة، مع تضمين وسم <script> مرة واحدة فقط في الصفحة.

ما الفرق بين <currency-widget> و<currency-converter>؟

عنصر <currency-widget> (المحمّل من /widgets/exchange-rates/widget.js) يعرض جدول أسعار صرف متعدد الصفوف لعملة أساسية، بينما يعرض <currency-converter> أداة تحويل بين عملتين بقوائم منسدلة.

هل تتطلب الأداة مفتاح API أو خاصية data-endpoint؟

لا يلزم أي مفتاح API، ولا تحتاج إلى إضافة خاصية data-endpoint؛ حيث تستنتج الأداة رابط البيانات تلقائيًا من مسار ملف widget.js.

الأدوات