[💡] GitHub Pages 블로그에 이미지 올리는 법

✨ GPT의 요약 　

GitHub Pages 블로그에 이미지를 추가하는 방법 안내.

GitHub Pages 블로그에 이미지를 추가하고 싶은데 이슈가 터졌다.

• 어떻게 하는지 까먹었다.

• 각 레포지토리당 1GB 용량 제한이 있다는 것이 떠올랐다.
  • 2025.1.13 수정
    • 1GB는 권장 사항이지 강제 제한은 아님.
    • 5GB가 넘으면 메일이 날라올 수 있음.
    • 따로 명시된 총 용량 제한은 없음.
    • 단일 파일 크기는 100MB 제한이 있음. (Git LFS로 해결 가능)
    • 리포지토리 크기가 커지면 클론/푸시 속도에 영향을 받을 가능성이 큼.
• 외부 이미지 호스팅을 사용하는 방안이 있다는 것이 떠올랐다.

… 요즘같은 시대에는 어떻게 하면 좋겠는가?

✨ 딸깍 ✨

아래부터는 GPT-4o의 답변을 참고하여 작성한 글입니다.

1. 일반적인 방식: assets/images 폴더 사용

이미지를 블로그 프로젝트 내 assets/images 폴더에 저장하고 링크를 연결합니다.

예시

• 이미지 저장 경로:

  assets/images/example.jpg
  

• 포스트에서 사용:

  ![이미지 설명](/assets/images/example.jpg)
  

이 방법은 간단하지만, 저장소 용량이 1GB 제한에 도달하면 문제가 발생할 수 있습니다.

---

2. 용량 초과 시 대처법

1) 외부 이미지 호스팅

GitHub 저장소를 사용하지 않고 외부 서비스를 이용합니다.

• Imgur: 이미지 업로드 후 URL 사용.

  ![이미지 설명](https://i.imgur.com/example.jpg)
  

• Google Photos/Dropbox: 클라우드 스토리지 링크 활용.

---

2) 독립적인 이미지 저장소 생성

이미지만 관리하는 별도의 GitHub Pages 저장소를 생성합니다.

1. 새 저장소 생성 (예: blog-images).
2. 이미지를 업로드 및 푸시.

3. 이미지 링크 사용:

   ![이미지 설명](https://username.github.io/blog-images/example.jpg)
   

---

3. URL 변경에 대비한 설정

_config.yml에 기본 이미지 경로를 설정해 링크 수정 부담을 줄일 수 있습니다.

1. _config.yml에 추가:

   image_baseurl: "/assets/images"
   

2. 포스트 작성 시:

   ![이미지 설명](/example.jpg)
   

3. 이미지 저장소를 변경할 경우 image_baseurl만 수정:

   image_baseurl: "https://username.github.io/blog-images"
   

---

4. 결론

현재는 assets/images 폴더에 이미지를 저장해 사용하고, 용량 초과 시 외부 호스팅 또는 이미지 전용 저장소를 도입하세요.