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