Preskoči na glavno vsebino

Dizajn dneva

Vdelaj Dizajn dneva na svojo spletno stran

Dizajn dneva vsak dan objavi novo vsebino. Naslov slike se nikoli ne spremeni, vendar se slika za njim spreminja, zato kodo dodate le enkrat, vaši obiskovalci pa samodejno vidijo današnjo vsebino.

Kako deluje

Vsak dan je na enem stalnem naslovu objavljena nova slika. Vaša stran naloži ta naslov, zato vedno prikazuje trenutno vsebino, s klikom pa vaše obiskovalce popelje na Dizajn dneva, kjer je predstavljena celotna zgodba.

Raje uporabljate skripto? Dodajte en vsebnik in eno skripto: pripomoček izriše slog, ki ga izberete z data-dotd-variant (image, cta ali card), v jeziku naslova skripte, kadar je ta jezik na voljo. Če skript ne morete izvajati, uporabite različico HTML istega sloga.

Različica A: samo slika

Današnja slika s povezavo na Dizajn dneva. Najlažja možnost.

Predogled v živo

<a href="https://designoftheday.org/sl/" target="_blank" rel="noopener">
  <img src="https://competition.adesignaward.com/design-of-the-day/today.png" alt="Predstavljeni Dizajn dneva, ki prikazuje nagrajeno ustvarjalno odličnost" loading="lazy" style="max-width:100%;height:auto">
</a>
<div data-dotd="designoftheday.org" data-dotd-variant="image"></div>
<script async src="https://designoftheday.org/feature.js?lang=sl"></script>

Različica B: slika in poziv k dejanju

Današnja slika s pozivom k dejanju spodaj.

Predogled v živo

<a href="https://designoftheday.org/sl/" 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-of-the-day/today.png" alt="Predstavljeni Dizajn dneva, ki prikazuje nagrajeno ustvarjalno odličnost" 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">Odkrijte Dizajn dneva</span>
</a>
<div data-dotd="designoftheday.org" data-dotd-variant="cta"></div>
<script async src="https://designoftheday.org/feature.js?lang=sl"></script>

Različica C: Bootstrap kartica

Bootstrap kartica s sliko, naslovom vsebine, kratkim odstavkom in gumbom s pozivom k dejanju. Vaša stran potrebuje Bootstrap.

Predogled v živo

<div class="card" style="max-width:24rem">
  <a href="https://designoftheday.org/sl/" target="_blank" rel="noopener"><img src="https://competition.adesignaward.com/design-of-the-day/today.png" class="card-img-top" alt="Predstavljeni Dizajn dneva, ki prikazuje nagrajeno ustvarjalno odličnost" loading="lazy"></a>
  <div class="card-body">
    <h5 class="card-title">Dizajn dneva</h5>
    <p class="card-text">Nagrada A' Design Award vsak dan predstavi izjemno oblikovalsko stvaritev, zelo inovativen izdelek ali izredno kreativen projekt kot Dizajn dneva ter s tem izpostavi odmevne primere ustvarjalnosti in dobrega oblikovanja.</p>
    <a href="https://designoftheday.org/sl/" class="btn btn-danger" target="_blank" rel="noopener">Odkrijte Dizajn dneva</a>
  </div>
</div>
<div data-dotd="designoftheday.org" data-dotd-variant="card"></div>
<script async src="https://designoftheday.org/feature.js?lang=sl"></script>

Možnost 3: JSON

Za razvijalce, aplikacije in avtomatizacijo. JSON vsebuje ime, opis, naslov slike, povezave in datum. Zahteve z drugih domen so dovoljene.

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

Primer odgovora

{
    "domain": "designoftheday.org",
    "name": "Dizajn dneva",
    "feature": "Dizajn dneva",
    "paragraph": "Nagrada A' Design Award vsak dan predstavi izjemno oblikovalsko stvaritev, zelo inovativen izdelek ali izredno kreativen projekt kot Dizajn dneva ter s tem izpostavi odmevne primere ustvarjalnosti in dobrega oblikovanja.",
    "description": "Dizajn dneva vsak dan predstavi izjemno oblikovalsko stvaritev, zelo inovativen izdelek ali izredno kreativen projekt ter izpostavi odmevne primere ustvarjalnosti in dobrega oblikovanja, ki jih je prepoznala izjemno ugledna nagrada A' Design Award and Competition.",
    "call_to_action": "Odkrijte Dizajn dneva",
    "date": "2026-11-08",
    "language": "sl",
    "image": "https://competition.adesignaward.com/design-of-the-day/today.png",
    "image_alt": "Predstavljeni Dizajn dneva, ki prikazuje nagrajeno ustvarjalno odličnost",
    "url": "https://designoftheday.org/sl/",
    "feature_url": "https://competition.adesignaward.com/design-of-the-day.html",
    "registry_url": "https://competition.adesignaward.com/designs-of-the-days.php",
    "embed_url": "https://designoftheday.org/sl/predstavitev/"
}

Dobro je vedeti

  • Ohranite povezavo okrog slike, da lahko vaši obiskovalci odkrijejo celotno vsebino.
  • Vedno uporabite zgoraj prikazani naslov slike in ne shranjujte kopije, da vaša stran ostane aktualna.
  • Slika je odzivna: nikoli ne postane širša od svojega vsebnika.
  • Potrebujete pomoč ali prilagojeno obliko? Kontaktirajte nas.

Oblikovalski citat dneva

Oblikovalski citat dneva

DesignAdage