علامة التصميم لليوم
تضمين علامة التصميم لليوم في موقعك الإلكتروني
ينشر علامة التصميم لليوم محتوى مميزاً جديداً كل يوم. عنوان الصورة لا يتغير، لكن الصورة نفسها تتغير، لذا تضيف الكود مرة واحدة ويرى زوارك المحتوى المميز لهذا اليوم تلقائياً.
كيف يعمل
كل يوم تُنشر صورة جديدة على عنوان ثابت واحد. تقوم صفحتك بتحميل هذا العنوان فتعرض دائماً المحتوى الحالي، وبالنقر عليها ينتقل زوارك إلى علامة التصميم لليوم حيث تُروى القصة كاملة.
تفضّل استخدام سكربت؟ أضف حاوية واحدة وسكربت واحد: يرسم الودجت النمط الذي تختاره عبر data-dotd-variant (image أو cta أو card)، بلغة عنوان السكربت عندما تكون تلك اللغة متاحة. إذا لم تتمكن من تشغيل السكربتات، استخدم نسخة HTML من نفس النمط.
النمط أ: صورة فقط
صورة اليوم، مرتبطة بـ علامة التصميم لليوم. الخيار الأخف.
معاينة حية
<a href="https://designbrandoftheday.com/ar/" target="_blank" rel="noopener">
<img src="https://competition.adesignaward.com/design-brand-of-the-day/today.png" alt="علامة التصميم لليوم تسلّط الضوء على علامة تجارية يقودها التصميم وتتألق بالتميّز" loading="lazy" style="max-width:100%;height:auto">
</a>
<div data-dotd="designbrandoftheday.com" data-dotd-variant="image"></div>
<script async src="https://designbrandoftheday.com/feature.js?lang=ar"></script>
النمط ب: صورة ودعوة لاتخاذ إجراء
صورة اليوم مع دعوة لاتخاذ إجراء أسفلها.
معاينة حية
<a href="https://designbrandoftheday.com/ar/" target="_blank" rel="noopener" style="display:block;max-width:100%;color:inherit;text-decoration:none;text-align:center">
<img src="https://competition.adesignaward.com/design-brand-of-the-day/today.png" alt="علامة التصميم لليوم تسلّط الضوء على علامة تجارية يقودها التصميم وتتألق بالتميّز" loading="lazy" style="display:block;max-width:100%;height:auto;margin:0 auto">
<span style="display:block;margin-top:.5em;font:600 15px/1.3 system-ui,sans-serif">اكتشف علامة التصميم لليوم</span>
</a>
<div data-dotd="designbrandoftheday.com" data-dotd-variant="cta"></div>
<script async src="https://designbrandoftheday.com/feature.js?lang=ar"></script>
النمط ج: بطاقة Bootstrap
بطاقة Bootstrap تتضمن الصورة وعنوان المحتوى المميز وفقرة قصيرة وزر دعوة لاتخاذ إجراء. يحتاج موقعك إلى Bootstrap.
معاينة حية
<div class="card" style="max-width:24rem">
<a href="https://designbrandoftheday.com/ar/" target="_blank" rel="noopener"><img src="https://competition.adesignaward.com/design-brand-of-the-day/today.png" class="card-img-top" alt="علامة التصميم لليوم تسلّط الضوء على علامة تجارية يقودها التصميم وتتألق بالتميّز" loading="lazy"></a>
<div class="card-body">
<h5 class="card-title">علامة التصميم لليوم</h5>
<p class="card-text">تعرض جائزة A' Design Award كل يوم علامة تجارية عالمية المستوى يقودها التصميم باعتبارها علامة التصميم لليوم، مسلّطةً الضوء على هويتها ورؤيتها الإبداعية ومنتجاتها ومشاريعها المؤسسية ونهجها المتفرد في التصميم.</p>
<a href="https://designbrandoftheday.com/ar/" class="btn btn-danger" target="_blank" rel="noopener">اكتشف علامة التصميم لليوم</a>
</div>
</div>
<div data-dotd="designbrandoftheday.com" data-dotd-variant="card"></div>
<script async src="https://designbrandoftheday.com/feature.js?lang=ar"></script>
الخيار 3: JSON
للمطورين والتطبيقات والأتمتة. يحتوي JSON على الاسم والوصف وعنوان الصورة والروابط والتاريخ. الطلبات عبر النطاقات مسموح بها.
fetch("https://designbrandoftheday.com/feature.json?lang=ar")
.then(function (r) { return r.json(); })
.then(function (d) {
// d.name, d.feature, d.paragraph, d.image, d.url, d.date ...
});
مثال على الاستجابة
{
"domain": "designbrandoftheday.com",
"name": "علامة التصميم لليوم",
"feature": "علامة التصميم لليوم",
"paragraph": "تعرض جائزة A' Design Award كل يوم علامة تجارية عالمية المستوى يقودها التصميم باعتبارها علامة التصميم لليوم، مسلّطةً الضوء على هويتها ورؤيتها الإبداعية ومنتجاتها ومشاريعها المؤسسية ونهجها المتفرد في التصميم.",
"description": "يعرض موقع علامة التصميم لليوم كل يوم علامة تجارية عالمية المستوى يقودها التصميم، مسلّطًا الضوء على هويتها ورؤيتها الإبداعية ومنتجاتها ومشاريعها المؤسسية ونهجها المتفرد في التصميم، وفقًا لتقدير جائزة A' Design Award and Competition المرموقة.",
"call_to_action": "اكتشف علامة التصميم لليوم",
"date": "2026-11-08",
"language": "ar",
"image": "https://competition.adesignaward.com/design-brand-of-the-day/today.png",
"image_alt": "علامة التصميم لليوم تسلّط الضوء على علامة تجارية يقودها التصميم وتتألق بالتميّز",
"url": "https://designbrandoftheday.com/ar/",
"feature_url": "https://competition.adesignaward.com/design-brand-of-the-day.html",
"registry_url": "https://competition.adesignaward.com/design-brands-of-the-days.php",
"embed_url": "https://designbrandoftheday.com/ar/tadmeen/"
}
معلومات مفيدة
- أبقِ الرابط حول الصورة ليتمكن زوارك من اكتشاف المحتوى المميز كاملاً.
- استخدم دائماً عنوان الصورة الموضح أعلاه ولا تخزّن نسخة منها، حتى تبقى صفحتك محدّثة.
- الصورة متجاوبة: لن تتجاوز عرض الحاوية أبداً.
- تحتاج مساعدة أو تنسيقاً مخصصاً؟ يرجى التواصل معنا.