오늘의 디자인 아이디어
오늘의 디자인 아이디어을(를) 내 웹사이트에 삽입하기
오늘의 디자인 아이디어은(는) 매일 새로운 특집을 발행합니다. 이미지 주소는 변하지 않지만 그 뒤의 사진은 매일 바뀌므로, 코드를 한 번만 추가하면 방문자에게 오늘의 특집이 자동으로 표시됩니다.
작동 방식
매일 하나의 고정된 주소에 새로운 사진이 게시됩니다. 페이지가 해당 주소를 불러오므로 항상 최신 특집이 표시되며, 클릭하면 방문자가 전체 내용이 소개된 오늘의 디자인 아이디어(으)로 이동합니다.
스크립트를 선호하시나요? 컨테이너 하나와 스크립트 하나만 추가하세요. 위젯은 data-dotd-variant(image, cta 또는 card)로 선택한 스타일을 그리며, 해당 언어가 지원되는 경우 스크립트 주소의 언어로 표시됩니다. 스크립트를 실행할 수 없는 경우 동일한 변형의 HTML 버전을 사용하세요.
변형 A: 이미지만
오늘의 디자인 아이디어(으)로 연결되는 오늘의 사진입니다. 가장 가벼운 옵션입니다.
실시간 미리보기
<a href="https://designideaoftheday.com/ko/" 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=ko"></script>변형 B: 이미지와 행동 유도 문구
오늘의 사진 아래에 행동 유도 문구가 함께 표시됩니다.
실시간 미리보기
<a href="https://designideaoftheday.com/ko/" 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=ko"></script>변형 C: Bootstrap 카드
사진, 특집 제목, 짧은 설명 문단, 행동 유도 버튼이 포함된 Bootstrap 카드입니다. 페이지에 Bootstrap이 필요합니다.
실시간 미리보기
<div class="card" style="max-width:24rem">
<a href="https://designideaoftheday.com/ko/" 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/ko/" 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=ko"></script>옵션 3: JSON
개발자, 앱 및 자동화를 위한 옵션입니다. JSON에는 이름, 설명, 이미지 주소, 링크 및 날짜가 포함되어 있습니다. 교차 출처 요청이 허용됩니다.
fetch("https://designideaoftheday.com/feature.json?lang=ko")
.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": "ko",
"image": "https://competition.adesignaward.com/design-idea-of-the-day/today.png",
"image_alt": "창의적 경계를 넓히는 혁신적 컨셉을 소개하는 오늘의 디자인 아이디어",
"url": "https://designideaoftheday.com/ko/",
"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/ko/imbedeu/"
}알아두면 좋은 점
- 방문자가 전체 특집을 확인할 수 있도록 이미지 주위의 링크를 유지하세요.
- 페이지를 항상 최신 상태로 유지하려면 위에 표시된 이미지 주소를 사용하고 사본을 저장하지 마세요.
- 이미지는 반응형이므로 컨테이너보다 넓어지지 않습니다.
- 도움이 필요하거나 맞춤 형식이 필요하시면 문의해 주세요.