Dagens designer
Bädda in Dagens designer på din webbplats
Dagens designer publicerar en ny presentation varje dag. Bildadressen ändras aldrig, men bilden bakom den gör det, så du lägger in koden en gång och dina besökare ser dagens presentation automatiskt.
Så fungerar det
Varje dag publiceras en ny bild på en fast adress. Din sida laddar den adressen och visar därför alltid den aktuella presentationen, och ett klick tar dina besökare till Dagens designer där hela berättelsen finns.
Föredrar du ett skript? Lägg till en behållare och ett skript: widgeten ritar den stil du väljer med data-dotd-variant (image, cta eller card), på det språk som skriptadressen anger när det språket är tillgängligt. Om du inte kan köra skript, använd HTML-versionen av samma variant.
Variant A: enbart bild
Dagens bild, länkad till Dagens designer. Det lättaste alternativet.
Förhandsgranskning
<a href="https://designeroftheday.com/sv/" target="_blank" rel="noopener">
<img src="https://competition.adesignaward.com/designer-of-the-day/today.png" alt="Porträtt av Dagens designer som hyllar dagens kreativa visionär" 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=sv"></script>
Variant B: bild och uppmaning
Dagens bild med en uppmaning till handling nedanför.
Förhandsgranskning
<a href="https://designeroftheday.com/sv/" 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="Porträtt av Dagens designer som hyllar dagens kreativa visionär" 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">Upptäck Dagens designer</span>
</a>
<div data-dotd="designeroftheday.com" data-dotd-variant="cta"></div>
<script async src="https://designeroftheday.com/feature.js?lang=sv"></script>
Variant C: Bootstrap-kort
Ett Bootstrap-kort med bilden, presentationens titel, en kort text och en uppmaningsknapp. Din sida behöver Bootstrap.
Förhandsgranskning
<div class="card" style="max-width:24rem">
<a href="https://designeroftheday.com/sv/" target="_blank" rel="noopener"><img src="https://competition.adesignaward.com/designer-of-the-day/today.png" class="card-img-top" alt="Porträtt av Dagens designer som hyllar dagens kreativa visionär" loading="lazy"></a>
<div class="card-body">
<h5 class="card-title">Dagens designer</h5>
<p class="card-text">A' Design Award presenterar varje dag en mycket begåvad designer eller en världsledande arkitekt som Dagens designer, med personerna bakom framstående kreativt arbete, deras designfilosofi, anmärkningsvärda projekt och prestationer.</p>
<a href="https://designeroftheday.com/sv/" class="btn btn-danger" target="_blank" rel="noopener">Upptäck Dagens designer</a>
</div>
</div>
<div data-dotd="designeroftheday.com" data-dotd-variant="card"></div>
<script async src="https://designeroftheday.com/feature.js?lang=sv"></script>
Alternativ 3: JSON
För utvecklare, appar och automatisering. JSON-svaret innehåller namn, beskrivning, bildadress, länkar och datum. Cross-origin-förfrågningar är tillåtna.
fetch("https://designeroftheday.com/feature.json?lang=sv")
.then(function (r) { return r.json(); })
.then(function (d) {
// d.name, d.feature, d.paragraph, d.image, d.url, d.date ...
});
Exempelsvar
{
"domain": "designeroftheday.com",
"name": "Dagens designer",
"feature": "Dagens designer",
"paragraph": "A' Design Award presenterar varje dag en mycket begåvad designer eller en världsledande arkitekt som Dagens designer, med personerna bakom framstående kreativt arbete, deras designfilosofi, anmärkningsvärda projekt och prestationer.",
"description": "Dagens designer presenterar varje dag en mycket begåvad designer eller en världsledande arkitekt, med de storartade personerna bakom framstående kreativt arbete, deras professionella bakgrund, designfilosofi, anmärkningsvärda projekt och prestationer erkända av den högt ansedda A' Design Award and Competition.",
"call_to_action": "Upptäck Dagens designer",
"date": "2026-11-08",
"language": "sv",
"image": "https://competition.adesignaward.com/designer-of-the-day/today.png",
"image_alt": "Porträtt av Dagens designer som hyllar dagens kreativa visionär",
"url": "https://designeroftheday.com/sv/",
"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/sv/inslag/"
}
Bra att veta
- Behåll länken runt bilden så att dina besökare kan upptäcka hela presentationen.
- Använd alltid bildadressen som visas ovan och spara ingen kopia, så att din sida alltid är aktuell.
- Bilden är responsiv: den blir aldrig bredare än sin behållare.
- Behöver du hjälp eller ett anpassat format? Kontakta oss gärna.