Дизайн-идея дня
Встройте Дизайн-идея дня на свой сайт
Дизайн-идея дня публикует новый материал каждый день. Адрес изображения не меняется, но картинка за ним обновляется, поэтому вы добавляете код один раз, а ваши посетители автоматически видят сегодняшний материал.
Как это работает
Каждый день новое изображение публикуется по одному и тому же адресу. Ваша страница загружает этот адрес, поэтому на ней всегда отображается текущий материал, а по клику посетители переходят на Дизайн-идея дня, где представлена полная история.
Предпочитаете скрипт? Добавьте один контейнер и один скрипт: виджет отрисует стиль, указанный в data-dotd-variant (image, cta или card), на языке адреса скрипта, если этот язык доступен. Если вы не можете использовать скрипты, воспользуйтесь HTML-версией того же варианта.
Вариант A: только изображение
Сегодняшнее изображение со ссылкой на Дизайн-идея дня. Самый лёгкий вариант.
Предпросмотр в реальном времени
<a href="https://designideaoftheday.com/ru/" 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=ru"></script>
Вариант B: изображение и призыв к действию
Сегодняшнее изображение с призывом к действию под ним.
Предпросмотр в реальном времени
<a href="https://designideaoftheday.com/ru/" 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=ru"></script>
Вариант C: карточка Bootstrap
Карточка Bootstrap с изображением, заголовком материала, коротким описанием и кнопкой призыва к действию. На вашей странице должен быть подключён Bootstrap.
Предпросмотр в реальном времени
<div class="card" style="max-width:24rem">
<a href="https://designideaoftheday.com/ru/" 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/ru/" 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=ru"></script>
Вариант 3: JSON
Для разработчиков, приложений и автоматизации. JSON содержит название, описание, адрес изображения, ссылки и дату. Кросс-доменные запросы разрешены.
fetch("https://designideaoftheday.com/feature.json?lang=ru")
.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": "ru",
"image": "https://competition.adesignaward.com/design-idea-of-the-day/today.png",
"image_alt": "Дизайн-идея дня — инновационная концепция, раздвигающая границы творчества",
"url": "https://designideaoftheday.com/ru/",
"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/ru/vstraivaniye/"
}
Полезно знать
- Сохраняйте ссылку вокруг изображения, чтобы ваши посетители могли перейти к полному материалу.
- Всегда используйте адрес изображения, указанный выше, и не сохраняйте копию, чтобы ваша страница оставалась актуальной.
- Изображение адаптивное: оно никогда не становится шире своего контейнера.
- Нужна помощь или особый формат? Пожалуйста, свяжитесь с нами.