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