Күндүн дизайн тренди

Күндүн дизайн тренди вебсайтыңызга орнотуу

Күндүн дизайн тренди күн сайын жаңы материал жарыялайт. Сүрөттүн дареги өзгөрбөйт, бирок анын артындагы сүрөт өзгөрөт, ошондуктан кодду бир жолу кошсоңуз, конокторуңуз бүгүнкү материалды автоматтык түрдө көрөт.

Кантип иштейт

Күн сайын бир туруктуу даректе жаңы сүрөт жарыяланат. Сиздин барак ошол даректи жүктөйт, ошондуктан ар дайым учурдагы материал көрсөтүлөт, ал эми чыкылдаганда конокторуңуз толук окуя айтылган Күндүн дизайн тренди сайтына өтөт.

Скрипт колдонгуңуз келеби? Бир контейнер жана бир скрипт кошуңуз: виджет data-dotd-variant (image, cta же card) аркылуу тандаган стилиңизди тартат, эгер ал тил жеткиликтүү болсо, скрипт дарегинин тилинде көрсөтөт. Эгер скрипт иштете албасаңыз, ошол эле варианттын HTML версиясын колдонуңуз.

Вариант A: сүрөт гана

Бүгүнкү сүрөт, Күндүн дизайн тренди сайтына шилтемеленген. Эң жеңил вариант.

Түз алдын ала көрүү

<a href="https://designtrendoftheday.com/ky/" target="_blank" rel="noopener">
  <img src="https://competition.adesignaward.com/design-trend-of-the-day/today.png" alt="Дизайндын келечегин калыптандырган пайда болгон үлгүлөрдү визуализациялаган Күндүн дизайн тренди" loading="lazy" style="max-width:100%;height:auto">
</a>

<div data-dotd="designtrendoftheday.com" data-dotd-variant="image"></div>
<script async src="https://designtrendoftheday.com/feature.js?lang=ky"></script>

Вариант B: сүрөт жана чакыруу баскычы

Бүгүнкү сүрөт, астында аракетке чакыруу баскычы менен.

Түз алдын ала көрүү

<a href="https://designtrendoftheday.com/ky/" 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-trend-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="designtrendoftheday.com" data-dotd-variant="cta"></div>
<script async src="https://designtrendoftheday.com/feature.js?lang=ky"></script>

Вариант C: Bootstrap карточкасы

Сүрөт, материалдын аталышы, кыскача абзац жана аракетке чакыруу баскычы бар Bootstrap карточкасы. Барагыңызда Bootstrap керек.

Түз алдын ала көрүү

<div class="card" style="max-width:24rem">
  <a href="https://designtrendoftheday.com/ky/" target="_blank" rel="noopener"><img src="https://competition.adesignaward.com/design-trend-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://designtrendoftheday.com/ky/" class="btn btn-danger" target="_blank" rel="noopener">Күндүн дизайн трендин ачыңыз</a>
  </div>
</div>

<div data-dotd="designtrendoftheday.com" data-dotd-variant="card"></div>
<script async src="https://designtrendoftheday.com/feature.js?lang=ky"></script>

3-вариант: JSON

Иштеп чыгуучулар, тиркемелер жана автоматташтыруу үчүн. JSON аталышты, сүрөттөмөнү, сүрөт дарегин, шилтемелерди жана күндү камтыйт. Кайчылаш-домендик сурамдарга уруксат берилген.

fetch("https://designtrendoftheday.com/feature.json?lang=ky")
  .then(function (r) { return r.json(); })
  .then(function (d) {
    // d.name, d.feature, d.paragraph, d.image, d.url, d.date ...
  });

Жооптун мисалы

{
    "domain": "designtrendoftheday.com",
    "name": "Күндүн дизайн тренди",
    "feature": "Күндүн дизайн тренди",
    "paragraph": "A' Design Award ар күнү Күндүн дизайн тренди катары оригиналдуу дизайн трендин изилдейт, продукциялардын, долбоорлордун жана тажрыйбалардын дизайнына таасир эткен жаңы стилдерди, өзгөрүп жаткан эстетиканы жана жаңы чыгармачыл багыттарды көрсөтөт.",
    "description": "Күндүн дизайн тренди ар күнү оригиналдуу дизайн трендин изилдейт, продукциялардын, долбоорлордун жана тажрыйбалардын дизайнына таасир эткен жаңы стилдерди, өзгөрүп жаткан эстетиканы, жаңы чыгармачыл багыттарды жана инновациялык мамилелерди көрсөтөт — бул абройлуу A' Design Award and Competition тарабынан таанылган.",
    "call_to_action": "Күндүн дизайн трендин ачыңыз",
    "date": "2026-11-08",
    "language": "ky",
    "image": "https://competition.adesignaward.com/design-trend-of-the-day/today.png",
    "image_alt": "Дизайндын келечегин калыптандырган пайда болгон үлгүлөрдү визуализациялаган Күндүн дизайн тренди",
    "url": "https://designtrendoftheday.com/ky/",
    "feature_url": "https://competition.adesignaward.com/design-trend-of-the-day.html",
    "registry_url": "https://competition.adesignaward.com/design-trends-of-the-days.php",
    "embed_url": "https://designtrendoftheday.com/ky/ozcholuk/"
}

Билүү пайдалуу

Сүрөттүн тегерегиндеги шилтемени сактаңыз, ошондо конокторуңуз толук материалды ача алышат.
Ар дайым жогоруда көрсөтүлгөн сүрөт дарегин колдонуңуз жана көчүрмөсүн сактабаңыз, ошондо барагыңыз актуалдуу болот.
Сүрөт адаптивдүү: ал эч качан контейнеринен кеңири болбойт.
Жардам же өзгөчө формат керекпи? Биз менен байланышыңыз.

Жарнама

Сыйлыкка татыктуу дизайндарды ачыңыз