Дизайн-ідея дня
Вбудуйте Дизайн-ідея дня на свій вебсайт
Дизайн-ідея дня публікує нову добірку щодня. Адреса зображення не змінюється, але картинка за нею оновлюється, тож ви додаєте код один раз — і ваші відвідувачі автоматично бачать сьогоднішню добірку.
Як це працює
Щодня за однією незмінною адресою публікується нове зображення. Ваша сторінка завантажує цю адресу, тож завжди показує поточну добірку, а натискання переносить відвідувачів на Дизайн-ідея дня, де розміщено повну історію.
Віддаєте перевагу скрипту? Додайте один контейнер і один скрипт: віджет відобразить стиль, обраний за допомогою data-dotd-variant (image, cta або card), мовою адреси скрипта, якщо ця мова доступна. Якщо скрипти недоступні, скористайтеся HTML-версією того самого варіанта.
Варіант A: лише зображення
Сьогоднішнє зображення з посиланням на Дизайн-ідея дня. Найлегший варіант.
Попередній перегляд
<a href="https://designideaoftheday.com/uk/" target="_blank" rel="noopener">
<img src="https://competition.adesignaward.com/design-idea-of-the-day/today.png" alt="Дизайн-ідея дня — інноваційна концепція, що розширює межі творчості" loading="lazy" style="max-width:100%;height:auto">
</a><div data-dotd="designideaoftheday.com" data-dotd-variant="image"></div>
<script async src="https://designideaoftheday.com/feature.js?lang=uk"></script>Варіант B: зображення та заклик до дії
Сьогоднішнє зображення із закликом до дії під ним.
Попередній перегляд
<a href="https://designideaoftheday.com/uk/" 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-idea-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="designideaoftheday.com" data-dotd-variant="cta"></div>
<script async src="https://designideaoftheday.com/feature.js?lang=uk"></script>Варіант C: картка Bootstrap
Картка Bootstrap із зображенням, назвою добірки, коротким абзацом та кнопкою заклику до дії. На вашій сторінці має бути підключений Bootstrap.
Попередній перегляд
<div class="card" style="max-width:24rem">
<a href="https://designideaoftheday.com/uk/" target="_blank" rel="noopener"><img src="https://competition.adesignaward.com/design-idea-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://designideaoftheday.com/uk/" class="btn btn-danger" target="_blank" rel="noopener">Відкрийте Дизайн-ідею дня</a>
</div>
</div><div data-dotd="designideaoftheday.com" data-dotd-variant="card"></div>
<script async src="https://designideaoftheday.com/feature.js?lang=uk"></script>Варіант 3: JSON
Для розробників, застосунків та автоматизації. JSON містить назву, опис, адресу зображення, посилання та дату. Міждоменні запити дозволені.
fetch("https://designideaoftheday.com/feature.json?lang=uk")
.then(function (r) { return r.json(); })
.then(function (d) {
// d.name, d.feature, d.paragraph, d.image, d.url, d.date ...
});Приклад відповіді
{
"domain": "designideaoftheday.com",
"name": "Дизайн-ідея дня",
"feature": "Дизайн-ідея дня",
"paragraph": "A' Design Award щодня представляє надзвичайно інноваційну дизайн-ідею або високо креативну концепцію як Дизайн-ідею дня, досліджуючи оригінальне мислення, практичні рішення та надихаючі підходи до досконалості у дизайні.",
"description": "Дизайн-ідея дня щодня представляє надзвичайно інноваційну дизайн-ідею та високо креативну концепцію, досліджуючи оригінальне мислення, практичні рішення та надихаючі підходи до глобальної досконалості у дизайні, відібрані високопрестижним конкурсом A' Design Award and Competition.",
"call_to_action": "Відкрийте Дизайн-ідею дня",
"date": "2026-11-08",
"language": "uk",
"image": "https://competition.adesignaward.com/design-idea-of-the-day/today.png",
"image_alt": "Дизайн-ідея дня — інноваційна концепція, що розширює межі творчості",
"url": "https://designideaoftheday.com/uk/",
"feature_url": "https://competition.adesignaward.com/design-idea-of-the-day.html",
"registry_url": "https://competition.adesignaward.com/design-ideas-of-the-days.php",
"embed_url": "https://designideaoftheday.com/uk/vbudovuvannia/"
}Корисно знати
- Зберігайте посилання навколо зображення, щоб відвідувачі могли переглянути повну добірку.
- Завжди використовуйте адресу зображення, вказану вище, і не зберігайте копію — так ваша сторінка завжди буде актуальною.
- Зображення адаптивне: воно ніколи не стає ширшим за свій контейнер.
- Потрібна допомога або індивідуальний формат? Будь ласка, зв'яжіться з нами.