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