Petear fan de Dei
Ynslút Untwerpynsjoch fan de Dei op jo webside
Petear fan de Dei publisearret alle dagen in nij ûnderwerp. It ôfbyldingsadres feroaret nea, mar de foto derachter wol, dus jo foegje de koade ien kear ta en jo besikers sjogge automatysk it ûnderwerp fan hjoed.
Hoe't it wurket
Alle dagen wurdt in nije ôfbylding publisearre op ien fêst adres. Jo side laadt dat adres, sadat it altyd it aktuele ûnderwerp toant, en in klik bringt jo besikers nei Petear fan de Dei dêr't it folsleine ferhaal te lêzen is.
Leaver in skript? Foegje ien kontener en ien skript ta: de widget tekenet de styl dy't jo kieze mei data-dotd-variant (image, cta of card), yn de taal fan it skriptadres as dy taal beskikber is. As jo gjin skripts útfiere kinne, brûk dan de HTML-ferzje fan deselde fariant.
Fariant A: allinnich ôfbylding
De ôfbylding fan hjoed, keppele oan Petear fan de Dei. De lichtste opsje.
Live foarbyld
<a href="https://interviewoftheday.com/fy/" target="_blank" rel="noopener">
<img src="https://competition.adesignaward.com/design-interview-of-the-day/today.png" alt="Untwerpynsjoch fan de Dei mei in yngeand petear mei in foaroansteand ûntwerper" loading="lazy" style="max-width:100%;height:auto">
</a>
<div data-dotd="interviewoftheday.com" data-dotd-variant="image"></div>
<script async src="https://interviewoftheday.com/feature.js?lang=fy"></script>
Fariant B: ôfbylding en oprop ta aksje
De ôfbylding fan hjoed mei in oprop ta aksje derûnder.
Live foarbyld
<a href="https://interviewoftheday.com/fy/" 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-interview-of-the-day/today.png" alt="Untwerpynsjoch fan de Dei mei in yngeand petear mei in foaroansteand ûntwerper" 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">Untdek Untwerpynsjoch fan de Dei</span>
</a>
<div data-dotd="interviewoftheday.com" data-dotd-variant="cta"></div>
<script async src="https://interviewoftheday.com/feature.js?lang=fy"></script>
Fariant C: Bootstrap-kaart
In Bootstrap-kaart mei de ôfbylding, de titel fan it ûnderwerp, in koart stikje tekst en in oprop-ta-aksje-knop. Jo side hat Bootstrap nedich.
Live foarbyld
<div class="card" style="max-width:24rem">
<a href="https://interviewoftheday.com/fy/" target="_blank" rel="noopener"><img src="https://competition.adesignaward.com/design-interview-of-the-day/today.png" class="card-img-top" alt="Untwerpynsjoch fan de Dei mei in yngeand petear mei in foaroansteand ûntwerper" loading="lazy"></a>
<div class="card-body">
<h5 class="card-title">Untwerpynsjoch fan de Dei</h5>
<p class="card-text">A' Design Award presintearret elke dei in petear mei in wrâldklasse-ûntwerper, arsjitekt of kreatyf profesjonal as it Untwerpynsjoch fan de Dei, mei harren achtergrûn, ûntwerpfilosofy, kreatyf proses en fyzje op de takomst fan ûntwerp.</p>
<a href="https://interviewoftheday.com/fy/" class="btn btn-danger" target="_blank" rel="noopener">Untdek Untwerpynsjoch fan de Dei</a>
</div>
</div>
<div data-dotd="interviewoftheday.com" data-dotd-variant="card"></div>
<script async src="https://interviewoftheday.com/feature.js?lang=fy"></script>
Opsje 3: JSON
Foar ûntwikkelers, apps en automatisearring. De JSON befettet de namme, de beskriuwing, it ôfbyldingsadres, de keppelings en de datum. Cross-origin-oanfragen binne tastien.
fetch("https://interviewoftheday.com/feature.json?lang=fy")
.then(function (r) { return r.json(); })
.then(function (d) {
// d.name, d.feature, d.paragraph, d.image, d.url, d.date ...
});
Foarbyld-antwurd
{
"domain": "interviewoftheday.com",
"name": "Petear fan de Dei",
"feature": "Untwerpynsjoch fan de Dei",
"paragraph": "A' Design Award presintearret elke dei in petear mei in wrâldklasse-ûntwerper, arsjitekt of kreatyf profesjonal as it Untwerpynsjoch fan de Dei, mei harren achtergrûn, ûntwerpfilosofy, kreatyf proses en fyzje op de takomst fan ûntwerp.",
"description": "Petear fan de Dei presintearret deistige petearen mei wrâldklasse-ûntwerpers, arsjitekten en kreative profesjonals erkend troch de heech prestizjeuze A' Design Award and Competition, mei harren achtergrûnen, profesjonele ûnderfiningen, ûntwerpfilosofyen, kreative prosessen, projekten en perspektiven fan liedende ûntwerpers op de takomst fan ûntwerp.",
"call_to_action": "Untdek Untwerpynsjoch fan de Dei",
"date": "2026-11-08",
"language": "fy",
"image": "https://competition.adesignaward.com/design-interview-of-the-day/today.png",
"image_alt": "Untwerpynsjoch fan de Dei mei in yngeand petear mei in foaroansteand ûntwerper",
"url": "https://interviewoftheday.com/fy/",
"feature_url": "https://competition.adesignaward.com/design-interview-of-the-day.html",
"registry_url": "https://competition.adesignaward.com/design-interviews-of-the-days.php",
"embed_url": "https://interviewoftheday.com/fy/feature/"
}
Goed om te witten
- Hâld de keppeling om de ôfbylding hinne, sadat jo besikers it folsleine ûnderwerp ûntdekke kinne.
- Brûk altyd it ôfbyldingsadres dat hjirboppe toand wurdt en bewarje gjin kopy, sadat jo side aktueel bliuwt.
- De ôfbylding is responsyf: hy wurdt nea breder as syn kontener.
- Help nedich of in oanpast formaat? Nim kontakt mei ús op.