A nap tervezője
A napi A nap tervezője beágyazása a weboldalára
A nap tervezője minden nap új kiemelt tartalmat tesz közzé. A kép címe soha nem változik, de a mögötte lévő kép igen – így a kódot csak egyszer kell beillesztenie, és látogatói automatikusan mindig az aznapi tartalmat látják.
Hogyan működik
Minden nap egy új kép jelenik meg egyetlen állandó címen. Az Ön oldala ezt a címet tölti be, így mindig az aktuális tartalom jelenik meg, a kattintás pedig a A nap tervezője oldalra viszi a látogatókat, ahol a teljes történetet elolvashatják.
Szkriptet szeretne? Adjon hozzá egy tárolóelemet és egy szkriptet: a widget a data-dotd-variant attribútummal kiválasztott stílust rajzolja meg (image, cta vagy card), a szkript címében megadott nyelven, ha az elérhető. Ha nem tud szkriptet futtatni, használja ugyanazon változat HTML-verzióját.
A változat: csak kép
A napi kép, a A nap tervezője oldalra hivatkozva. A legkönnyebb megoldás.
Élő előnézet
<a href="https://designeroftheday.com/hu/" target="_blank" rel="noopener">
<img src="https://competition.adesignaward.com/designer-of-the-day/today.png" alt="A nap tervezőjének portréja, amely a mai ünnepelt kreatív vízionáriust mutatja be" 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=hu"></script>B változat: kép és cselekvésre ösztönzés
A napi kép, alatta cselekvésre ösztönző elemmel.
Élő előnézet
<a href="https://designeroftheday.com/hu/" 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="A nap tervezőjének portréja, amely a mai ünnepelt kreatív vízionáriust mutatja be" 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">Fedezze fel a nap tervezőjét</span>
</a><div data-dotd="designeroftheday.com" data-dotd-variant="cta"></div>
<script async src="https://designeroftheday.com/feature.js?lang=hu"></script>C változat: Bootstrap kártya
Egy Bootstrap kártya a képpel, a tartalom címével, egy rövid bekezdéssel és egy cselekvésre ösztönző gombbal. Az oldalához szükség van a Bootstrap keretrendszerre.
Élő előnézet
<div class="card" style="max-width:24rem">
<a href="https://designeroftheday.com/hu/" target="_blank" rel="noopener"><img src="https://competition.adesignaward.com/designer-of-the-day/today.png" class="card-img-top" alt="A nap tervezőjének portréja, amely a mai ünnepelt kreatív vízionáriust mutatja be" loading="lazy"></a>
<div class="card-body">
<h5 class="card-title">A nap tervezője</h5>
<p class="card-text">Az A' Design Award minden nap bemutat egy rendkívül tehetséges tervezőt vagy egy világszínvonalú építészt a nap tervezőjeként, megismertetve a kiemelkedő kreatív munkák mögött álló embereket, tervezési filozófiájukat, jelentős projektjeiket és eredményeiket.</p>
<a href="https://designeroftheday.com/hu/" class="btn btn-danger" target="_blank" rel="noopener">Fedezze fel a nap tervezőjét</a>
</div>
</div><div data-dotd="designeroftheday.com" data-dotd-variant="card"></div>
<script async src="https://designeroftheday.com/feature.js?lang=hu"></script>3. lehetőség: JSON
Fejlesztőknek, alkalmazásokhoz és automatizáláshoz. A JSON tartalmazza a nevet, a leírást, a kép címét, a hivatkozásokat és a dátumot. A cross-origin kérések engedélyezettek.
fetch("https://designeroftheday.com/feature.json?lang=hu")
.then(function (r) { return r.json(); })
.then(function (d) {
// d.name, d.feature, d.paragraph, d.image, d.url, d.date ...
});Példa válasz
{
"domain": "designeroftheday.com",
"name": "A nap tervezője",
"feature": "A nap tervezője",
"paragraph": "Az A' Design Award minden nap bemutat egy rendkívül tehetséges tervezőt vagy egy világszínvonalú építészt a nap tervezőjeként, megismertetve a kiemelkedő kreatív munkák mögött álló embereket, tervezési filozófiájukat, jelentős projektjeiket és eredményeiket.",
"description": "A nap tervezője minden nap bemutat egy rendkívül tehetséges tervezőt vagy világszínvonalú építészt, megismertetve a kiemelkedő kreatív munkák mögött álló nagyszerű embereket, szakmai hátterüket, tervezési filozófiájukat, jelentős projektjeiket és a rendkívül rangos A' Design Award and Competition által elismert eredményeiket.",
"call_to_action": "Fedezze fel a nap tervezőjét",
"date": "2026-11-08",
"language": "hu",
"image": "https://competition.adesignaward.com/designer-of-the-day/today.png",
"image_alt": "A nap tervezőjének portréja, amely a mai ünnepelt kreatív vízionáriust mutatja be",
"url": "https://designeroftheday.com/hu/",
"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/hu/beagyazas/"
}Jó tudni
- Hagyja meg a hivatkozást a kép körül, hogy látogatói felfedezhessék a teljes tartalmat.
- Mindig a fent látható képcímet használja, és ne mentsen el másolatot, így oldala mindig naprakész marad.
- A kép reszponzív: soha nem lesz szélesebb a tárolóeleménél.
- Segítségre van szüksége, vagy egyedi formátumot szeretne? Kérjük, lépjen kapcsolatba velünk.