Designidee des Tages
Einbetten: Designidee des Tages auf Ihrer Website
Designidee des Tages veröffentlicht jeden Tag einen neuen Beitrag. Die Bildadresse bleibt immer gleich, doch das Bild dahinter wechselt – Sie fügen den Code einmal ein, und Ihre Besucher sehen automatisch den aktuellen Beitrag.
So funktioniert es
Jeden Tag wird ein neues Bild unter einer festen Adresse veröffentlicht. Ihre Seite lädt diese Adresse, zeigt also immer den aktuellen Beitrag, und ein Klick führt Ihre Besucher zu Designidee des Tages, wo die vollständige Geschichte erzählt wird.
Lieber ein Skript? Fügen Sie einen Container und ein Skript hinzu: Das Widget zeichnet die Variante, die Sie mit data-dotd-variant wählen (image, cta oder card), in der Sprache der Skriptadresse, sofern diese Sprache verfügbar ist. Falls Sie keine Skripte ausführen können, verwenden Sie die HTML-Version derselben Variante.
Variante A: nur Bild
Das heutige Bild, verlinkt mit Designidee des Tages. Die leichteste Option.
Live-Vorschau
<a href="https://designideaoftheday.com/de/" target="_blank" rel="noopener">
<img src="https://competition.adesignaward.com/design-idea-of-the-day/today.png" alt="Designidee des Tages mit einem innovativen Konzept, das kreative Grenzen erweitert" loading="lazy" style="max-width:100%;height:auto">
</a><div data-dotd="designideaoftheday.com" data-dotd-variant="image"></div>
<script async src="https://designideaoftheday.com/feature.js?lang=de"></script>Variante B: Bild und Handlungsaufforderung
Das heutige Bild mit einer Handlungsaufforderung darunter.
Live-Vorschau
<a href="https://designideaoftheday.com/de/" 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-idea-of-the-day/today.png" alt="Designidee des Tages mit einem innovativen Konzept, das kreative Grenzen erweitert" 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">Designidee des Tages entdecken</span>
</a><div data-dotd="designideaoftheday.com" data-dotd-variant="cta"></div>
<script async src="https://designideaoftheday.com/feature.js?lang=de"></script>Variante C: Bootstrap-Karte
Eine Bootstrap-Karte mit dem Bild, dem Titel des Beitrags, einem kurzen Absatz und einem Aktionsbutton. Ihre Seite benötigt Bootstrap.
Live-Vorschau
<div class="card" style="max-width:24rem">
<a href="https://designideaoftheday.com/de/" target="_blank" rel="noopener"><img src="https://competition.adesignaward.com/design-idea-of-the-day/today.png" class="card-img-top" alt="Designidee des Tages mit einem innovativen Konzept, das kreative Grenzen erweitert" loading="lazy"></a>
<div class="card-body">
<h5 class="card-title">Designidee des Tages</h5>
<p class="card-text">A' Design Award präsentiert jeden Tag eine besonders innovative Designidee oder ein höchst kreatives Konzept als Designidee des Tages und beleuchtet originelle Denkweisen, praktische Lösungen und inspirierende Ansätze für exzellentes Design.</p>
<a href="https://designideaoftheday.com/de/" class="btn btn-danger" target="_blank" rel="noopener">Designidee des Tages entdecken</a>
</div>
</div><div data-dotd="designideaoftheday.com" data-dotd-variant="card"></div>
<script async src="https://designideaoftheday.com/feature.js?lang=de"></script>Option 3: JSON
Für Entwickler, Apps und Automatisierung. Das JSON enthält den Namen, die Beschreibung, die Bildadresse, die Links und das Datum. Cross-Origin-Anfragen sind erlaubt.
fetch("https://designideaoftheday.com/feature.json?lang=de")
.then(function (r) { return r.json(); })
.then(function (d) {
// d.name, d.feature, d.paragraph, d.image, d.url, d.date ...
});Beispielantwort
{
"domain": "designideaoftheday.com",
"name": "Designidee des Tages",
"feature": "Designidee des Tages",
"paragraph": "A' Design Award präsentiert jeden Tag eine besonders innovative Designidee oder ein höchst kreatives Konzept als Designidee des Tages und beleuchtet originelle Denkweisen, praktische Lösungen und inspirierende Ansätze für exzellentes Design.",
"description": "Designidee des Tages präsentiert jeden Tag eine besonders innovative Designidee oder ein höchst kreatives Konzept, ausgewählt vom äußerst renommierten A' Design Award and Competition, und beleuchtet originelle Denkweisen, praktische Lösungen und inspirierende Ansätze für exzellentes Design weltweit.",
"call_to_action": "Designidee des Tages entdecken",
"date": "2026-11-08",
"language": "de",
"image": "https://competition.adesignaward.com/design-idea-of-the-day/today.png",
"image_alt": "Designidee des Tages mit einem innovativen Konzept, das kreative Grenzen erweitert",
"url": "https://designideaoftheday.com/de/",
"feature_url": "https://competition.adesignaward.com/design-idea-of-the-day.html",
"registry_url": "https://competition.adesignaward.com/design-ideas-of-the-days.php",
"embed_url": "https://designideaoftheday.com/de/einbetten/"
}Gut zu wissen
- Behalten Sie den Link um das Bild bei, damit Ihre Besucher den vollständigen Beitrag entdecken können.
- Verwenden Sie immer die oben gezeigte Bildadresse und speichern Sie keine Kopie, damit Ihre Seite aktuell bleibt.
- Das Bild ist responsiv: Es wird nie breiter als sein Container.
- Brauchen Sie Hilfe oder ein individuelles Format? Bitte kontaktieren Sie uns.