Blog

GitHub Blog 카테고리 페이지 생성하기

GitHub 블로그에 카테고리별 페이지를 만들고, 페이지네이션과 정렬 기능(최신순/과거순) 까지 넣고 싶다면? 이 글에서는 jekyll-paginate-v2 플러그인을 이용해 minimal-mistakes 테마 기반 블로그에서 카테고리 페이지를 만드는 전 과정을 정리했습니다.

GitHub Blog 카테고리별 게시글 정렬 기능 구현

GitHub 블로그를 최신순 또는 과거순으로 정렬하고 싶다면? 이 글에서는 minimal-mistakes 테마에서 카테고리별 게시글 정렬 기능을 구현하는 전체 과정을 코드 중심으로 정리했습니다.

GitHub 블로그에 Lunr 기반 커스텀 검색창 만들기

GitHub Pages 블로그에 사용자 정의 검색창을 추가하고 싶으셨나요? 이 포스트에서는 minimal-mistakes 테마를 기반으로 Lunr.js를 활용해 상단과 사이드바에 검색창을 구현하고, 제목 및 태그 기준의 검색 기능을 설정하는 방법을 단계별로 안내합니다.

GitHub 블로그에 태그 기능 추가 및 자동 생성 방법

Jekyll 기반의 GitHub 블로그에서 태그(tag)를 활용하면 각 포스트를 키워드로 분류하고 관련된 글끼리 연결할 수 있습니다. 이 글에서는 /tags/태그명/ 형식의 태그별 아카이브 페이지를 자동으로 생성하는 방법과 그 설정 과정을 단계별로 정리해봅니다.

GitHub Blog Google Analytics GA4 연동 가이드

GitHub Pages 기반 Jekyll 블로그에서 방문자 추적을 하고 싶다면, Google Analytics GA4를 연동하는 것이 필수입니다. 이 글에서는 GA4 측정 ID 삽입, minimal-mistakes 테마 설정, 실시간 유입 확인, 그리고 Google Search C...

GitHub Blog Reveal.js 슬라이드 만들기

Reveal.js를 사용하면 GitHub 블로그에서도 마치 PowerPoint처럼 HTML 슬라이드를 만들 수 있습니다. 이 글에서는 Jekyll 환경에서 reveal.js를 이용해 슬라이드 프레젠테이션, 인터랙티브 발표용 페이지, Jekyll 커스텀 플러그인 구현 방법까지 단계별...

GitHub Blog 카드 링크 플러그인 만들기

GitHub Pages 기반 Jekyll 블로그에서 외부 링크를 자동으로 카드 형식으로 만들어주는 링크 카드 플러그인, OG 태그 기반 미리보기 카드, Liquid 태그 확장을 구현하고 싶다면 이 글을 참고하세요.

GitHub Blog Toggle 플러그인 설정 - Jekyll에서 접기 UI 구현하기

Jekyll 블로그에 접이식 콘텐츠를 넣고 싶다면 기본 <details> 외에도 커스텀 Liquid 플러그인을 통해 더 유연하고 스타일링 가능한 Toggle UI를 구현할 수 있습니다. 이 글에서는 toggle 플러그인을 직접 만들어 접기 기능을 구현하고, 내용에 따라 ...

GitHub Blog 코드 복사 버튼 추가 - Jekyll에서 Copy 버튼 구현

Jekyll 블로그에서 코드블럭에 복사 버튼을 추가하고 싶다면, clipboard.js를 활용해 div.highlighter-rouge 안에 Copy 버튼을 삽입하면 됩니다. 이 글에서는 복사 기능 구현 → 복사 후 텍스트 변경 → 로컬 대체까지 완벽하게 적용하는 법을 단계별로 설...

GitHub Blog 목차 설정 - Jekyll 블로그 TOC 스크롤 고정 기능

Jekyll 블로그에서 글의 구조를 명확히 보여주기 위해 목차(TOC)를 추가하는 것은 매우 유용합니다. 특히 minimal-mistakes 테마는 toc 옵션 하나로 자동 생성이 가능하며, toc_sticky 설정을 통해 스크롤을 따라다니는 고정 목차도 구현할 수 있습니다.

GitHub Blog 이미지 경로 설정 - Jekyll 블로그 이미지 관리법

Jekyll 기반 GitHub 블로그에서 이미지를 체계적으로 관리하고 싶다면, 게시글 별 이미지 폴더 구조를 사용하는 것이 좋습니다. 이 글에서는 post-image.html 인클루드를 만들어, 자동으로 포스트 경로에 맞는 이미지 경로를 지정하는 방법을 소개합니다.

GitHub Blog 빌드 & 릴리즈 자동화 - GitHub Actions로 Jekyll 배포하기

GitHub 블로그를 운영하면서 자동 배포를 설정하고 싶다면, GitHub Actions를 사용한 CI/CD 환경이 필요합니다. 이 글에서는 Jekyll로 작성한 블로그를 GitHub 서버에서 자동으로 빌드하고 gh-pages 브랜치로 배포하는 워크플로우를 설정하는 방법을 정리합니다.

GitHub Blog 로컬 서버 설정 - Jekyll 개발 환경 구축

GitHub 블로그를 로컬에서 수정하고 테스트하려면, Jekyll 로컬 서버 설정을 통해 실시간으로 확인하는 환경이 필요합니다. 이 글에서는 Ruby, Jekyll, Bundler 설치부터 bundle exec jekyll serve 명령어로 로컬 서버를 띄우는 전체 과정을 설명합...