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