https://hugo-theme-test-a-1.pages.dev/ko/tags/reference/ Recent content in Reference on SITE — SITE https://hugo-theme-test-a-1.pages.dev/social.png https://hugo-theme-test-a-1.pages.dev/social.png Hugo -- 0.147.7 ko-KR https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/ <h1 id="92-hugo-shortcode-built-in">92 Hugo shortcode built-in</h1> <p>이 섹션은 <code>themes/1/layouts/_shortcodes/readme/built-in/</code>의 계약을 기준으로 만든 테스트 포스트 모음입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/ <h1 id="92-hugo-shortcode-custom">92 Hugo shortcode custom</h1> <p>이 섹션은 <code>themes/1/layouts/_shortcodes/readme/custom/</code>의 계약을 기준으로 만든 테스트 포스트 모음입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/ <h1 id="92-hugo-shortcode-lab">92 Hugo shortcode lab</h1> <p>이 섹션은 <code>themes/1/layouts/_shortcodes/readme/</code>의 구조를 따라 만든 테스트 포스트 모음입니다.</p> <ul> <li><code>built-in/</code></li> <li><code>custom/</code></li> </ul> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/accordion/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/accordion/ <h1 id="accordion-shortcode">accordion shortcode</h1> <p><code>accordion</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/accordion.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/accordionitem/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/accordionitem/ <h1 id="accordionitem-shortcode">accordionItem shortcode</h1> <p><code>accordionItem</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/accordionItem.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/alert/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/alert/ <h1 id="alert-shortcode">alert shortcode</h1> <p><code>alert</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/alert.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/audio/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/audio/ <h1 id="audio-shortcode">audio shortcode</h1> <p><code>audio</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/audio.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/badge/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/badge/ <h1 id="badge-shortcode">badge shortcode</h1> <p><code>badge</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/badge.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/bluesky/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/bluesky/ <h1 id="bluesky-shortcode">bluesky shortcode</h1> <p><code>bluesky</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/bluesky.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/button/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/button/ <h1 id="button-shortcode">button shortcode</h1> <p><code>button</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/button.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/card/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/card/ <h1 id="card-shortcode">card shortcode</h1> <p><code>card</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/card.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/collapse/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/collapse/ <h1 id="collapse-shortcode">collapse shortcode</h1> <p><code>collapse</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/collapse.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/column/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/column/ <h1 id="column-shortcode">column shortcode</h1> <p><code>column</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/column.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/columns/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/columns/ <h1 id="columns-shortcode">columns shortcode</h1> <p><code>columns</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/columns.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/cta/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/cta/ <h1 id="cta-shortcode">cta shortcode</h1> <p><code>cta</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/cta.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/design-probe/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/design-probe/ <h1 id="design-probe-shortcode">design-probe shortcode</h1> <p><code>design-probe</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/design-probe.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/details/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/details/ <h1 id="details-shortcode">details shortcode</h1> <p><code>details</code>는 HTML의 <code>&lt;details&gt;</code> / <code>&lt;summary&gt;</code> 요소를 본문 안에 안전하게 넣을 수 있게 해 주는 shortcode입니다. 긴 설명, 보조 문서, 선택형 안내, FAQ 같은 콘텐츠에 잘 맞습니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/details/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/details/ <h1 id="details-shortcode">details shortcode</h1> <p><code>details</code>는 HTML의 <code>&lt;details&gt;</code> / <code>&lt;summary&gt;</code> 요소를 본문 안에 안전하게 넣을 수 있게 해 주는 shortcode입니다. 긴 설명, 보조 문서, 선택형 안내, FAQ 같은 콘텐츠에 잘 맞습니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/ <h1 id="embedded-shortcode">embedded shortcode</h1> <p>이 섹션은 Hugo 공식 문서의 embedded shortcode를 실습용으로 다시 구성한 페이지 묶음입니다.</p> <h2 id="분류-기준">분류 기준</h2> <ul> <li>구조형: <code>details</code>, <code>figure</code></li> <li>서식형: <code>highlight</code></li> <li>데이터형: <code>param</code></li> <li>유틸리티형: <code>qr</code></li> <li>참조형: <code>ref</code>, <code>relref</code></li> <li>외부 임베드형: <code>instagram</code>, <code>vimeo</code>, <code>x</code>, <code>youtube</code></li> </ul> <h2 id="공통-원칙">공통 원칙</h2> <p>모든 페이지에서 다음 형식을 지킵니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/facebook/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/facebook/ <h1 id="facebook-shortcode">facebook shortcode</h1> <p><code>facebook</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/facebook.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/figure/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/figure/ <h1 id="figure-shortcode">figure shortcode</h1> <p><code>figure</code>는 <code>&lt;figure&gt;</code>, <code>&lt;img&gt;</code>, <code>&lt;figcaption&gt;</code> 구조를 한 번에 만들고 싶을 때 쓰는 shortcode입니다.<br> 이미지 본문, 캡션, 출처, 링크를 하나의 단위로 묶기 좋습니다.</p> <p>공식 문서 기준으로 <code>src</code>, <code>alt</code>, <code>width</code>, <code>height</code>, <code>loading</code>, <code>class</code>, <code>link</code>, <code>target</code>, <code>rel</code>, <code>title</code>, <code>caption</code>, <code>attr</code>, <code>attrlink</code>를 사용할 수 있습니다. <code>src</code>는 이미지 경로, <code>caption</code>은 설명, <code>attr</code>과 <code>attrlink</code>는 출처 표기에 특히 유용합니다. 문서에는 내부 리소스, 전역 리소스, 원격 주소를 모두 지원한다고 설명되어 있습니다. citeturn791175view5turn241043view1</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/figure/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/figure/ <h1 id="figure-shortcode">figure shortcode</h1> <p><code>figure</code>는 <code>&lt;figure&gt;</code>, <code>&lt;img&gt;</code>, <code>&lt;figcaption&gt;</code> 구조를 한 번에 만들고 싶을 때 쓰는 shortcode입니다.<br> 이미지 본문, 캡션, 출처, 링크를 하나의 단위로 묶기 좋습니다.</p> <p>공식 문서 기준으로 <code>src</code>, <code>alt</code>, <code>width</code>, <code>height</code>, <code>loading</code>, <code>class</code>, <code>link</code>, <code>target</code>, <code>rel</code>, <code>title</code>, <code>caption</code>, <code>attr</code>, <code>attrlink</code>를 사용할 수 있습니다. <code>src</code>는 이미지 경로, <code>caption</code>은 설명, <code>attr</code>과 <code>attrlink</code>는 출처 표기에 특히 유용합니다. 문서에는 내부 리소스, 전역 리소스, 원격 주소를 모두 지원한다고 설명되어 있습니다. citeturn791175view5turn241043view1</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/gallery/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/gallery/ <h1 id="gallery-shortcode">gallery shortcode</h1> <p><code>gallery</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/gallery.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/gist/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/gist/ <h1 id="gist-shortcode">gist shortcode</h1> <p><code>gist</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/gist.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/highlight/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/highlight/ <h1 id="highlight-shortcode">highlight shortcode</h1> <p><code>highlight</code>는 코드를 syntax highlight가 적용된 HTML로 바꿔 주는 shortcode입니다.<br> Markdown에서는 기본 fenced code block만으로도 충분한 경우가 많지만, 인라인 코드 조각을 강조하거나 하이라이트 옵션을 세밀하게 통제하고 싶을 때 유용합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/highlight/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/highlight/ <h1 id="highlight-shortcode">highlight shortcode</h1> <p><code>highlight</code>는 코드를 syntax highlight가 적용된 HTML로 바꿔 주는 shortcode입니다.<br> Markdown에서는 기본 fenced code block만으로도 충분한 경우가 많지만, 인라인 코드 조각을 강조하거나 하이라이트 옵션을 세밀하게 통제하고 싶을 때 유용합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/ <h1 id="hugo-기본-shortcode-아카이브">Hugo 기본 shortcode 아카이브</h1> <p>이 폴더는 Hugo가 기본으로 제공하는 embedded shortcode를 실무 관점에서 다시 정리한 실습 묶음입니다.</p> <p>Hugo의 공식 문서에는 embedded shortcode로 <code>details</code>, <code>figure</code>, <code>highlight</code>, <code>instagram</code>, <code>param</code>, <code>qr</code>, <code>ref</code>, <code>relref</code>, <code>vimeo</code>, <code>x</code>, <code>youtube</code>가 안내되어 있습니다. 이 아카이브는 그 11개를 모두 다루며, 각 shortcode마다 다음을 함께 봅니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/icon/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/icon/ <h1 id="icon-shortcode">icon shortcode</h1> <p><code>icon</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/icon.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/instagram/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/instagram/ <h1 id="instagram-shortcode">instagram shortcode</h1> <p><code>instagram</code>은 Instagram 게시물을 본문 안에 임베드하는 shortcode입니다.<br> 정적 사이트에서는 소셜 임베드가 외부 서비스 의존성을 만들기 쉬우므로, 어떤 설정이 렌더링에 영향을 주는지 함께 보는 것이 중요합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/instagram/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/instagram/ <h1 id="instagram-shortcode">instagram shortcode</h1> <p><code>instagram</code>은 Instagram 게시물을 본문 안에 임베드하는 shortcode입니다.<br> 정적 사이트에서는 소셜 임베드가 외부 서비스 의존성을 만들기 쉬우므로, 어떤 설정이 렌더링에 영향을 주는지 함께 보는 것이 중요합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/intextimg/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/intextimg/ <h1 id="intextimg-shortcode">inTextImg shortcode</h1> <p><code>inTextImg</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/inTextImg.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/katex/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/katex/ <h1 id="katex-shortcode">katex shortcode</h1> <p><code>katex</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/katex.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/lead/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/lead/ <h1 id="lead-shortcode">lead shortcode</h1> <p><code>lead</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/lead.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/linkedin/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/linkedin/ <h1 id="linkedin-shortcode">linkedin shortcode</h1> <p><code>linkedin</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/linkedin.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/ltr/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/ltr/ <h1 id="ltr-shortcode">ltr shortcode</h1> <p><code>ltr</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/ltr.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/mastodon/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/mastodon/ <h1 id="mastodon-shortcode">mastodon shortcode</h1> <p><code>mastodon</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/mastodon.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/mermaid/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/mermaid/ <h1 id="mermaid-shortcode">mermaid shortcode</h1> <p><code>mermaid</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/mermaid.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/param/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/param/ <h1 id="param-shortcode">param shortcode</h1> <p><code>param</code>은 front matter나 site configuration에 저장된 값을 본문 안으로 꺼내오는 shortcode입니다.<br> 문구를 여러 페이지에 반복하지 않으려면, 이 방식이 생각보다 강력합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/param/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/param/ <h1 id="param-shortcode">param shortcode</h1> <p><code>param</code>은 front matter나 site configuration에 저장된 값을 본문 안으로 꺼내오는 shortcode입니다.<br> 문구를 여러 페이지에 반복하지 않으려면, 이 방식이 생각보다 강력합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/pinterest/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/pinterest/ <h1 id="pinterest-shortcode">pinterest shortcode</h1> <p><code>pinterest</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/pinterest.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/qr/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/qr/ <h1 id="qr-shortcode">qr shortcode</h1> <p><code>qr</code>은 본문 안의 텍스트를 QR 코드 이미지로 바꿔 주는 shortcode입니다.<br> 짧은 링크, 전화번호, 연락처, 등록 URL 같은 정보를 빠르게 전달하고 싶을 때 적합합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/qr/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/qr/ <h1 id="qr-shortcode">qr shortcode</h1> <p><code>qr</code>은 본문 안의 텍스트를 QR 코드 이미지로 바꿔 주는 shortcode입니다.<br> 짧은 링크, 전화번호, 연락처, 등록 URL 같은 정보를 빠르게 전달하고 싶을 때 적합합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/rawhtml/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/rawhtml/ <h1 id="rawhtml-shortcode">rawhtml shortcode</h1> <p><code>rawhtml</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/rawhtml.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/reddit/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/reddit/ <h1 id="reddit-shortcode">reddit shortcode</h1> <p><code>reddit</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/reddit.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/ref/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/ref/ <h1 id="ref-shortcode">ref shortcode</h1> <p><code>ref</code>는 특정 페이지를 가리키는 permalink를 만들어 주는 shortcode입니다.<br> 문서 내부 링크를 직접 하드코딩하지 않고, 페이지 참조를 기준으로 링크를 만들고 싶을 때 유용합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/ref/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/ref/ <h1 id="ref-shortcode">ref shortcode</h1> <p><code>ref</code>는 특정 페이지를 가리키는 permalink를 만들어 주는 shortcode입니다.<br> 문서 내부 링크를 직접 하드코딩하지 않고, 페이지 참조를 기준으로 링크를 만들고 싶을 때 유용합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/relref/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/relref/ <h1 id="relref-shortcode">relref shortcode</h1> <p><code>relref</code>는 대상 페이지까지의 상대 permalink를 만들어 주는 shortcode입니다.<br> <code>ref</code>와 문법은 거의 비슷하지만, 결과가 상대 경로라는 점이 다릅니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/relref/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/relref/ <h1 id="relref-shortcode">relref shortcode</h1> <p><code>relref</code>는 대상 페이지까지의 상대 permalink를 만들어 주는 shortcode입니다.<br> <code>ref</code>와 문법은 거의 비슷하지만, 결과가 상대 경로라는 점이 다릅니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/rtl/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/rtl/ <h1 id="rtl-shortcode">rtl shortcode</h1> <p><code>rtl</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/rtl.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/90-shortcode-cta/04-coverage/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/90-shortcode-cta/04-coverage/ <h1 id="shortcode-cta-coverage-index">shortcode CTA coverage index</h1> <p>이 페이지는 <code>04-coverage</code> 아래의 모든 예제를 파일 단위로 모아, 렌더링 결과와 원형 코드를 함께 보여 줍니다.</p> <h2 id="contentkobloglab90-shortcode-cta04-coverage00-kind01-defaultmd"><code>content/ko/blog/lab/90-shortcode-cta/04-coverage/00-kind/01-default.md</code></h2> <h3 id="렌더링-결과">렌더링 결과</h3> <div id="cta-kind-default" class="cta cta--kind-default cta--priority-secondary cta--surface-after-content cta--size-md cta--tone-neutral cta--align-center cta--has-body is-default" data-cta-kind="default" data-cta-intent="generic" data-cta-priority="secondary" data-cta-surface="after-content" data-cta-size="md" data-cta-tone="neutral" data-cta-align="center" data-cta-target="_self" data-cta-has-body="true" data-cta-disabled="false" data-cta-compact="false" data-tracking-id="cta-kind-01" data-analytics-event="cta_kind_default"> <div class="cta__frame"><a class="cta__link" href="https://hugo-theme-test-a-1.pages.dev/contact/" target="_self" rel="&amp;lt;nil&amp;gt;" aria-label="&amp;lt;nil&amp;gt;"> <span class="cta__link-inner"><span class="cta__badge">BASE</span><span class="cta__label">기본 CTA</span><span class="cta__subtitle">자세히 보기</span></span> </a><div class="cta__support"><p class="cta__note">기본 동작을 확인합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/90-shortcode-cta/04-coverage/shortcode-cta-default/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/90-shortcode-cta/04-coverage/shortcode-cta-default/ <hr> <h1 id="priority">priority</h1> <h2 id="primary">primary</h2> <div id="-nil-" class="cta cta--kind-default cta--priority-primary cta--surface-after-content cta--size-md cta--tone-neutral cta--align-center cta--has-body &amp;lt;nil&amp;gt;" data-cta-kind="default" data-cta-intent="&lt;nil&gt;" data-cta-priority="primary" data-cta-surface="after-content" data-cta-size="md" data-cta-tone="neutral" data-cta-align="center" data-cta-target="_self" data-cta-has-body="true" data-cta-disabled="false" data-cta-compact="false" data-tracking-id="&amp;lt;nil&amp;gt;" data-analytics-event="&amp;lt;nil&amp;gt;"> <div class="cta__frame"><a class="cta__link" href="https://example.com/" target="_self" rel="&amp;lt;nil&amp;gt;" aria-label="&amp;lt;nil&amp;gt;"> <span class="cta__link-inner"><span class="cta__badge">BASE</span><span class="cta__label">CTA 버튼입니다</span><span class="cta__subtitle">자세히 보기</span></span> </a><div class="cta__support"><p class="cta__note">기본 동작을 확인합니다.</p></div></div> </div> <h1 id="priority-1">priority</h1> <h2 id="primary-1">primary</h2> <h3 id="raw-code">raw-code</h3> <div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-text" data-lang="text"><span style="display:flex;"><span>{{&lt; cta </span></span><span style="display:flex;"><span> kind = &#34;default&#34; </span></span><span style="display:flex;"><span> priority = &#34;primary&#34; </span></span><span style="display:flex;"><span> </span></span><span style="display:flex;"><span> size = &#34;md&#34; </span></span><span style="display:flex;"><span> tone = &#34;neutral&#34; </span></span><span style="display:flex;"><span> align = &#34;center&#34; </span></span><span style="display:flex;"><span> </span></span><span style="display:flex;"><span> badge = &#34;BASE&#34; </span></span><span style="display:flex;"><span> label = &#34;CTA 버튼입니다&#34; </span></span><span style="display:flex;"><span> subtitle = &#34;자세히 보기&#34; </span></span><span style="display:flex;"><span> note = &#34;기본 동작을 확인합니다.&#34; </span></span><span style="display:flex;"><span> </span></span><span style="display:flex;"><span> target = &#34;_self&#34; </span></span><span style="display:flex;"><span> href = &#34;https://example.com/&#34; </span></span><span style="display:flex;"><span> rel = &#34;&#34; </span></span><span style="display:flex;"><span> </span></span><span style="display:flex;"><span> aria_label = &#34;&#34; </span></span><span style="display:flex;"><span> tracking_id = &#34;&#34; </span></span><span style="display:flex;"><span> analytics_event = &#34;&#34; </span></span><span style="display:flex;"><span> id = &#34;&#34; </span></span><span style="display:flex;"><span> class = &#34;&#34; </span></span><span style="display:flex;"><span> </span></span><span style="display:flex;"><span> disabled = &#34;false&#34; </span></span><span style="display:flex;"><span> &gt;}} </span></span></code></pre></div><hr> <h1 id="priority-2">priority</h1> <h2 id="primary-2">primary</h2> <div id="-nil-" class="cta cta--kind-default cta--priority-secondary cta--surface-after-content cta--size-md cta--tone-neutral cta--align-center cta--has-body &amp;lt;nil&amp;gt;" data-cta-kind="default" data-cta-intent="&lt;nil&gt;" data-cta-priority="secondary" data-cta-surface="after-content" data-cta-size="md" data-cta-tone="neutral" data-cta-align="center" data-cta-target="_self" data-cta-has-body="true" data-cta-disabled="false" data-cta-compact="false" data-tracking-id="&amp;lt;nil&amp;gt;" data-analytics-event="&amp;lt;nil&amp;gt;"> <div class="cta__frame"><a class="cta__link" href="https://example.com/" target="_self" rel="&amp;lt;nil&amp;gt;" aria-label="&amp;lt;nil&amp;gt;"> <span class="cta__link-inner"><span class="cta__badge">BASE</span><span class="cta__label">CTA 버튼입니다</span><span class="cta__subtitle">자세히 보기</span></span> </a><div class="cta__support"><p class="cta__note">기본 동작을 확인합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/90-shortcode-cta/04-coverage/shortcode-cta-test/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/90-shortcode-cta/04-coverage/shortcode-cta-test/ <hr> <h1 id="kind">kind</h1> <h2 id="default">default</h2> <div id="-nil-" class="cta cta--kind-default cta--priority-primary cta--surface-after-content cta--size-md cta--tone-neutral cta--align-center cta--has-body &amp;lt;nil&amp;gt;" data-cta-kind="default" data-cta-intent="&lt;nil&gt;" data-cta-priority="primary" data-cta-surface="after-content" data-cta-size="md" data-cta-tone="neutral" data-cta-align="center" data-cta-target="_self" data-cta-has-body="true" data-cta-disabled="false" data-cta-compact="false" data-tracking-id="&amp;lt;nil&amp;gt;" data-analytics-event="&amp;lt;nil&amp;gt;"> <div class="cta__frame"><a class="cta__link" href="https://example.com/" target="_self" rel="&amp;lt;nil&amp;gt;" aria-label="&amp;lt;nil&amp;gt;"> <span class="cta__link-inner"><span class="cta__badge">BASE</span><span class="cta__label">CTA 버튼입니다</span><span class="cta__subtitle"></span></span> </a><div class="cta__support"><p class="cta__note">기본 동작을 확인합니다.</p></div></div> </div> <h1 id="kind-1">kind</h1> <h2 id="default-1">default</h2> <h3 id="raw-code">raw-code</h3> <div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-text" data-lang="text"><span style="display:flex;"><span>{{&lt; cta </span></span><span style="display:flex;"><span> kind = &#34;default&#34; </span></span><span style="display:flex;"><span> priority = &#34;primary&#34; </span></span><span style="display:flex;"><span> </span></span><span style="display:flex;"><span> size = &#34;md&#34; </span></span><span style="display:flex;"><span> tone = &#34;neutral&#34; </span></span><span style="display:flex;"><span> align = &#34;center&#34; </span></span><span style="display:flex;"><span> </span></span><span style="display:flex;"><span> badge = &#34;BASE&#34; </span></span><span style="display:flex;"><span> label = &#34;CTA 버튼입니다&#34; </span></span><span style="display:flex;"><span> surface = &#34;after-content&#34; </span></span><span style="display:flex;"><span> note = &#34;기본 동작을 확인합니다.&#34; </span></span><span style="display:flex;"><span> </span></span><span style="display:flex;"><span> target = &#34;_self&#34; </span></span><span style="display:flex;"><span> href = &#34;https://example.com/&#34; </span></span><span style="display:flex;"><span> rel = &#34;&#34; </span></span><span style="display:flex;"><span> </span></span><span style="display:flex;"><span> aria_label = &#34;&#34; </span></span><span style="display:flex;"><span> tracking_id = &#34;&#34; </span></span><span style="display:flex;"><span> analytics_event = &#34;&#34; </span></span><span style="display:flex;"><span> id = &#34;&#34; </span></span><span style="display:flex;"><span> class = &#34;&#34; </span></span><span style="display:flex;"><span> </span></span><span style="display:flex;"><span> disabled = &#34;false&#34; </span></span><span style="display:flex;"><span> &gt;}} </span></span></code></pre></div><hr> <h1 id="kind-2">kind</h1> <h2 id="external">external</h2> <div id="-nil-" class="cta cta--kind-external cta--priority-primary cta--surface-after-content cta--size-md cta--tone-neutral cta--align-center cta--has-body &amp;lt;nil&amp;gt;" data-cta-kind="external" data-cta-intent="&lt;nil&gt;" data-cta-priority="primary" data-cta-surface="after-content" data-cta-size="md" data-cta-tone="neutral" data-cta-align="center" data-cta-target="_self" data-cta-has-body="true" data-cta-disabled="false" data-cta-compact="false" data-tracking-id="&amp;lt;nil&amp;gt;" data-analytics-event="&amp;lt;nil&amp;gt;"> <div class="cta__frame"><a class="cta__link" href="https://example.com/" target="_self" rel="&amp;lt;nil&amp;gt;" aria-label="&amp;lt;nil&amp;gt;"> <span class="cta__link-inner"><span class="cta__badge">BASE</span><span class="cta__label">CTA 버튼입니다</span><span class="cta__subtitle"></span></span> </a><div class="cta__support"><p class="cta__note">기본 동작을 확인합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/tab/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/tab/ <h1 id="tab-shortcode">tab shortcode</h1> <p><code>tab</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/tab.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/tabs/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/tabs/ <h1 id="tabs-shortcode">tabs shortcode</h1> <p><code>tabs</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/tabs.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/threads/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/threads/ <h1 id="threads-shortcode">threads shortcode</h1> <p><code>threads</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/threads.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/tiktok/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/tiktok/ <h1 id="tiktok-shortcode">tiktok shortcode</h1> <p><code>tiktok</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/tiktok.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/video/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/custom/video/ <h1 id="video-shortcode">video shortcode</h1> <p><code>video</code>는 <code>themes/1/layouts/_shortcodes/readme/custom/video.html</code>와 1:1로 대응하는 테스트 문서입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/vimeo/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/vimeo/ <h1 id="vimeo-shortcode">vimeo shortcode</h1> <p><code>vimeo</code>는 Vimeo 영상을 본문에 임베드하는 shortcode입니다.<br> 튜토리얼, 강의, 데모 영상처럼 영상 자료를 본문에서 바로 보여 주고 싶을 때 사용합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/vimeo/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/vimeo/ <h1 id="vimeo-shortcode">vimeo shortcode</h1> <p><code>vimeo</code>는 Vimeo 영상을 본문에 임베드하는 shortcode입니다.<br> 튜토리얼, 강의, 데모 영상처럼 영상 자료를 본문에서 바로 보여 주고 싶을 때 사용합니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/x/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/x/ <h1 id="x-shortcode">x shortcode</h1> <p><code>x</code>는 X 포스트를 본문에 임베드하는 shortcode입니다.<br> 과거 Twitter 임베드와 비슷한 역할을 하지만, 현재는 X 서비스 설정을 함께 고려해야 합니다.</p> <p>공식 문서에는 <code>user</code>, <code>id</code> 조합의 예시와 함께 <code>privacy.x.disable</code>, <code>privacy.x.enableDNT</code>, <code>privacy.x.simple</code>, 그리고 <code>services.x.disableInlineCSS</code> 설정이 안내되어 있습니다. citeturn791175view3turn241043view4</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/x/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/x/ <h1 id="x-shortcode">x shortcode</h1> <p><code>x</code>는 X 포스트를 본문에 임베드하는 shortcode입니다.<br> 과거 Twitter 임베드와 비슷한 역할을 하지만, 현재는 X 서비스 설정을 함께 고려해야 합니다.</p> <p>공식 문서에는 <code>user</code>, <code>id</code> 조합의 예시와 함께 <code>privacy.x.disable</code>, <code>privacy.x.enableDNT</code>, <code>privacy.x.simple</code>, 그리고 <code>services.x.disableInlineCSS</code> 설정이 안내되어 있습니다. citeturn791175view3turn241043view4</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/youtube/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/91-hugo-shortcode/01-embedded/youtube/ <h1 id="youtube-shortcode">youtube shortcode</h1> <p><code>youtube</code>는 YouTube 영상을 본문에 임베드하는 shortcode입니다.<br> 가장 익숙한 외부 영상 임베드 중 하나이며, 튜토리얼, 발표 자료, 쇼케이스 페이지에서 자주 쓰입니다.</p> https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/youtube/ Mon, 01 Jan 0001 00:00:00 +0000 https://hugo-theme-test-a-1.pages.dev/ko/blog/lab/92-hugo-shortcode/built-in/youtube/ <h1 id="youtube-shortcode">youtube shortcode</h1> <p><code>youtube</code>는 YouTube 영상을 본문에 임베드하는 shortcode입니다.<br> 가장 익숙한 외부 영상 임베드 중 하나이며, 튜토리얼, 발표 자료, 쇼케이스 페이지에서 자주 쓰입니다.</p>