Built-In on SITE

92 Hugo shortcode built-in

Mon, 01 Jan 0001 00:00:00 +0000

92 Hugo shortcode built-in

이 섹션은 themes/1/layouts/_shortcodes/readme/built-in/의 계약을 기준으로 만든 테스트 포스트 모음입니다.

details shortcode

Mon, 01 Jan 0001 00:00:00 +0000

details shortcode

details는 HTML의 <details> / <summary> 요소를 본문 안에 안전하게 넣을 수 있게 해 주는 shortcode입니다. 긴 설명, 보조 문서, 선택형 안내, FAQ 같은 콘텐츠에 잘 맞습니다.

figure shortcode

Mon, 01 Jan 0001 00:00:00 +0000

figure shortcode

figure는 <figure>, <img>, <figcaption> 구조를 한 번에 만들고 싶을 때 쓰는 shortcode입니다.
이미지 본문, 캡션, 출처, 링크를 하나의 단위로 묶기 좋습니다.

공식 문서 기준으로 src, alt, width, height, loading, class, link, target, rel, title, caption, attr, attrlink를 사용할 수 있습니다. src는 이미지 경로, caption은 설명, attr과 attrlink는 출처 표기에 특히 유용합니다. 문서에는 내부 리소스, 전역 리소스, 원격 주소를 모두 지원한다고 설명되어 있습니다. citeturn791175view5turn241043view1

highlight shortcode

Mon, 01 Jan 0001 00:00:00 +0000

highlight shortcode

highlight는 코드를 syntax highlight가 적용된 HTML로 바꿔 주는 shortcode입니다.
Markdown에서는 기본 fenced code block만으로도 충분한 경우가 많지만, 인라인 코드 조각을 강조하거나 하이라이트 옵션을 세밀하게 통제하고 싶을 때 유용합니다.

instagram shortcode

Mon, 01 Jan 0001 00:00:00 +0000

instagram shortcode

instagram은 Instagram 게시물을 본문 안에 임베드하는 shortcode입니다.
정적 사이트에서는 소셜 임베드가 외부 서비스 의존성을 만들기 쉬우므로, 어떤 설정이 렌더링에 영향을 주는지 함께 보는 것이 중요합니다.

param shortcode

Mon, 01 Jan 0001 00:00:00 +0000

param shortcode

param은 front matter나 site configuration에 저장된 값을 본문 안으로 꺼내오는 shortcode입니다.
문구를 여러 페이지에 반복하지 않으려면, 이 방식이 생각보다 강력합니다.

qr shortcode

Mon, 01 Jan 0001 00:00:00 +0000

qr shortcode

qr은 본문 안의 텍스트를 QR 코드 이미지로 바꿔 주는 shortcode입니다.
짧은 링크, 전화번호, 연락처, 등록 URL 같은 정보를 빠르게 전달하고 싶을 때 적합합니다.

ref shortcode

Mon, 01 Jan 0001 00:00:00 +0000

ref shortcode

ref는 특정 페이지를 가리키는 permalink를 만들어 주는 shortcode입니다.
문서 내부 링크를 직접 하드코딩하지 않고, 페이지 참조를 기준으로 링크를 만들고 싶을 때 유용합니다.

relref shortcode

Mon, 01 Jan 0001 00:00:00 +0000

relref shortcode

relref는 대상 페이지까지의 상대 permalink를 만들어 주는 shortcode입니다.
ref와 문법은 거의 비슷하지만, 결과가 상대 경로라는 점이 다릅니다.

vimeo shortcode

Mon, 01 Jan 0001 00:00:00 +0000

vimeo shortcode

vimeo는 Vimeo 영상을 본문에 임베드하는 shortcode입니다.
튜토리얼, 강의, 데모 영상처럼 영상 자료를 본문에서 바로 보여 주고 싶을 때 사용합니다.

x shortcode

Mon, 01 Jan 0001 00:00:00 +0000

x shortcode

x는 X 포스트를 본문에 임베드하는 shortcode입니다.
과거 Twitter 임베드와 비슷한 역할을 하지만, 현재는 X 서비스 설정을 함께 고려해야 합니다.

공식 문서에는 user, id 조합의 예시와 함께 privacy.x.disable, privacy.x.enableDNT, privacy.x.simple, 그리고 services.x.disableInlineCSS 설정이 안내되어 있습니다. citeturn791175view3turn241043view4

youtube shortcode

Mon, 01 Jan 0001 00:00:00 +0000

youtube shortcode

youtube는 YouTube 영상을 본문에 임베드하는 shortcode입니다.
가장 익숙한 외부 영상 임베드 중 하나이며, 튜토리얼, 발표 자료, 쇼케이스 페이지에서 자주 쓰입니다.