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