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