每日設計理念
將每日設計理念嵌入你嘅網站
每日設計理念 每日發佈一個新專題。圖片地址唔會變，但背後嘅圖片每日都唔同，所以你只需要加一次代碼，你嘅訪客就會自動睇到今日嘅專題。
點樣運作
每日都有一張新圖片發佈喺同一個固定地址。你嘅頁面載入呢個地址，所以永遠都會顯示最新嘅專題，訪客一撳就會去到 每日設計理念，睇到完整嘅故事。
鍾意用腳本？加一個容器同一個腳本就得：小工具會根據你用 data-dotd-variant 揀嘅樣式（image、cta 或者 card）嚟顯示，語言就跟腳本地址嘅語言（如果有嘅話）。如果你唔可以執行腳本，就用同一款式嘅 HTML 版本。
款式 A：淨係圖片
今日嘅圖片，連結去 每日設計理念。最輕量嘅選擇。
即時預覽
<a href="https://designideaoftheday.com/zy/" target="_blank" rel="noopener">
<img src="https://competition.adesignaward.com/design-idea-of-the-day/today.png" alt="每日設計理念展示一個突破創意界限嘅創新概念" 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=zy"></script>款式 B：圖片加行動呼籲
今日嘅圖片，下面附帶行動呼籲。
即時預覽
<a href="https://designideaoftheday.com/zy/" 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="每日設計理念展示一個突破創意界限嘅創新概念" 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">探索每日設計理念</span>
</a><div data-dotd="designideaoftheday.com" data-dotd-variant="cta"></div>
<script async src="https://designideaoftheday.com/feature.js?lang=zy"></script>款式 C：Bootstrap 卡片
一張 Bootstrap 卡片，入面有圖片、專題標題、一段簡短介紹同行動呼籲按鈕。你嘅頁面需要用到 Bootstrap。
即時預覽
<div class="card" style="max-width:24rem">
<a href="https://designideaoftheday.com/zy/" target="_blank" rel="noopener"><img src="https://competition.adesignaward.com/design-idea-of-the-day/today.png" class="card-img-top" alt="每日設計理念展示一個突破創意界限嘅創新概念" loading="lazy"></a>
<div class="card-body">
<h5 class="card-title">每日設計理念</h5>
<p class="card-text">A' Design Award 每日呈獻一個極具創新嘅設計理念或者高度創意嘅概念，作為每日設計理念，探索原創思維、實用方案同啟發人心嘅卓越設計方式。</p>
<a href="https://designideaoftheday.com/zy/" class="btn btn-danger" target="_blank" rel="noopener">探索每日設計理念</a>
</div>
</div><div data-dotd="designideaoftheday.com" data-dotd-variant="card"></div>
<script async src="https://designideaoftheday.com/feature.js?lang=zy"></script>選項 3：JSON
專為開發者、應用程式同自動化而設。JSON 入面包含名稱、描述、圖片地址、連結同日期。允許跨域請求。
fetch("https://designideaoftheday.com/feature.json?lang=zy")
.then(function (r) { return r.json(); })
.then(function (d) {
// d.name, d.feature, d.paragraph, d.image, d.url, d.date ...
});回應範例
{
"domain": "designideaoftheday.com",
"name": "每日設計理念",
"feature": "每日設計理念",
"paragraph": "A' Design Award 每日呈獻一個極具創新嘅設計理念或者高度創意嘅概念，作為每日設計理念，探索原創思維、實用方案同啟發人心嘅卓越設計方式。",
"description": "每日設計理念每日呈獻一個極具創新嘅設計理念、高度創意嘅概念，探索原創思維、實用方案同啟發人心嘅全球卓越設計方式，由極具聲望嘅 A' Design Award and Competition 精選。",
"call_to_action": "探索每日設計理念",
"date": "2026-11-08",
"language": "zy",
"image": "https://competition.adesignaward.com/design-idea-of-the-day/today.png",
"image_alt": "每日設計理念展示一個突破創意界限嘅創新概念",
"url": "https://designideaoftheday.com/zy/",
"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/zy/tese/"
}實用貼士
- 保留圖片周圍嘅連結，等你嘅訪客可以發現完整嘅專題。
- 一定要用上面顯示嘅圖片地址，唔好自己儲存副本，咁你嘅頁面先至保持最新。
- 圖片係響應式嘅：佢唔會超過容器嘅闊度。
- 需要幫手或者自訂格式？請聯絡我哋。