انتقل إلى المحتوى
jobs.ly للمطوّرين

أداة الوظائف للمواقع

اعرض وظائف المؤسسة المفتوحة في موقعها بسطرين من الكود. تجلب الأداة الإعلانات الحالية عند عرضها، وتستخدم خط الموقع وألوانه، وتربط كل وظيفة بطريقة التقديم فيها.

أضفها

الصق هذا الكود حيث تريد ظهور الوظائف، وضع عنوان صفحة مؤسستك في jobs.ly مكان your-company. ويجد أصحاب العمل الكود جاهزاً بعنوانهم في «إعدادات المؤسسة».

HTML
<div data-jobsly-company="your-company">
  <a href="https://jobs.ly/en/companies/your-company">Our jobs on jobs.ly</a>
</div>
<script src="https://jobs.ly/embed.js" async></script>

لعميل وكالة توظيف

تعرض الوكالة الوظائف التي تنشرها لعميل واحد بكود خاص بهذا العميل، تجده في صفحته (العملاء ← العميل ← الملف). يحدد الكود العميل بمفتاح لا بعنوان صفحته: فإذا تولّت المؤسسة إدارة صفحتها في jobs.ly لاحقاً، لا تبدأ النافذة بعرض وظائف المؤسسة نفسها، بل تصبح فارغة، فاحذفها من الموقع.

HTML
<div data-jobsly-client="the-client-key">
  <a href="https://jobs.ly/en">Jobs in Libya on jobs.ly</a>
</div>
<script src="https://jobs.ly/embed.js" async></script>

الأكواد التي أُنشئت سابقاً بـdata-jobsly-company تبقى تعمل، وتعرض وظائف تلك المؤسسة.

الرابط داخل المربع هو ما يراه الزوار ومحركات البحث إذا لم يعمل الكود. وبعد ظهور الوظائف يصبح هو السطر الذي تحتها. والأكواد التي لا تحتوي رابطاً تبقى تعمل، ويظهر فيها «jobs.ly» في ذلك السطر.

الخيارات

الخيارالقيمالمعنى
data-jobsly-companyyour-companyعنوان صفحة المؤسسة في jobs.ly (كود المؤسسة لوظائفها).
data-jobsly-clientthe-client-keyبدلاً من data-jobsly-company: عميل وكالة توظيف، بمفتاحه (كود العميل).
data-themeauto (الافتراضي)، jobslyمظهر الموقع نفسه، أو مظهر jobs.ly.
data-accent#204466لون الأزرار (الافتراضي: لون الروابط في الموقع).
data-langar، enاللغة (الافتراضي: لغة الصفحة).
data-limit10عدد الوظائف قبل «عرض الكل».
HTML
<div data-jobsly-company="your-company"
     data-theme="jobsly"
     data-accent="#204466"
     data-lang="en"
     data-limit="5"></div>
<script src="https://jobs.ly/embed.js" async></script>

كيف تعمل

  • لا تُحمَّل إلا عند ظهورها على الشاشة، فلا تبطئ الصفحة.
  • تصميمها محمي من أنماط الموقع، لكنها تحتفظ بخط الموقع ولون نصوصه.
  • تفتح كل وظيفة صفحتها على jobs.ly. يتبع الزائر طريقة التقديم الموضّحة؛ بعض الطلبات تُستكمل خارج jobs.ly.

لا تظهر الوظائف؟

  • تظهر الوظائف المفتوحة فقط: أول وظيفة لمؤسسة جديدة تظهر بعد اعتماد jobs.ly للمؤسسة.
  • إذا كان الموقع يرسل سياسة أمان المحتوى (Content-Security-Policy)، فأضف https://jobs.ly إلى script-src وconnect-src (وإلى frame-src عند استخدام الإطار أدناه). دون ذلك يمنع المتصفح الأداة عن الزوار، وقد تظهر مع ذلك في معاينة محرر الموقع.
  • إضافات تسريع المواقع التي تؤخر الأكواد حتى يمرّر الزائر الصفحة أو يضغط (مثل FlyingPress أو «Delay JavaScript» في WP Rocket) تؤخر الأداة كذلك: استثنِ jobs.ly/embed.js. وبعد أي تعديل امسح ذاكرة الصفحات المؤقتة في الموقع (وفي Cloudflare إن وُجد).

موقعك لا يقبل الأكواد البرمجية؟

بعض منصات إنشاء المواقع لا تسمح بـ<script>. استخدم إطاراً بدلاً منه:

HTML
<iframe src="https://jobs.ly/embed/your-company?lang=en" title="jobs.ly"
        style="width:100%;height:520px;border:0" loading="lazy"></iframe>

ولعميل وكالة، يحمل عنوان الإطار مفتاح العميل:

HTML
<iframe src="https://jobs.ly/embed/client/the-client-key?lang=en" title="jobs.ly"
        style="width:100%;height:520px;border:0" loading="lazy"></iframe>

يخبر الإطار الصفحة التي تحتويه بارتفاع قائمته: حدث message فيه { type: "jobsly:height", height } (بالبكسل)، يُرسل عند التحميل وعند تغيّر الحجم. إذا سمح الموقع بكود قصير، فاجعل الإطار يأخذ هذا الارتفاع حتى لا يظهر شريط تمرير أو فراغ:

HTML
<iframe id="jobsly-jobs" src="https://jobs.ly/embed/your-company?lang=en" title="jobs.ly"
        style="width:100%;height:520px;border:0" loading="lazy"></iframe>
<script>
  addEventListener("message", function (e) {
    if (e.origin !== "https://jobs.ly" || !e.data || e.data.type !== "jobsly:height") return;
    document.getElementById("jobsly-jobs").style.height = e.data.height + "px";
  });
</script>