hexo블로그 tranquilpeak테마 환경 설정

HEXO블로그 tranquilpeak 테마을 설치하고 테마 사용에 필요한 몇몇 가지 환경설정 및 사용 방법들을 정리합니다.

hexo tranquilpeak

tranquilpeak테마 설정

DOCUMENTATION 설명서를 참조하세요.

테마 설정 파일 tranquilpeak -> _config.yml

테마 이미지 경로

# Image directory (default: images) 헥소 기본 이미지 경로
image_dir: assets/images # 이 테마에 기본 이미지 경로

헥소 기본 이미지 경로로 변경해서 사용해도 되지만 이 테마에서 설정한 이미지 경로를
그대로 사용합니다.

이 이미지 경로를 사용하려면 루트 폴더에 보면 source 폴더가 있습니다. 그 안에 assets 폴더를 만들고 또 그 안에 images 폴더를 만듭니다

이 폴더 안에는 파피콘과 커버 사진 그리고, 프로필 사진 등이 저장됩니다.

사이드바 메뉴 설정

사이드바 메뉴에서 불필요한 팔로잉 링크들이 있으면 제거합니다.

1. categories, tags, archives

설정은 그대로 두고 명령 창을 이용해 새 페이지를 생성합니다.

hexo new page "all-categories"

hexo new page "all-tags"

hexo new page "all-archives"

각각 실행을 하면 source 폴더에 각각 폴더와 인텍스 파일이 생성됩니다.

예) source/all-categories/index.md

각 인덱스 파일을 열어 머리말을 아래와 같이 수정합니다.

---
title: "all-categories"
layout: "all-categories"
comments: false
---
---
title: "all-tags"
layout: "all-tags"
comments: false
---
---
title: "all-archives"
layout: "all-archives"
comments: false
---

2. 검색 search algolia

algolia에 가입해서 사용해야 해서 저는 패스합니다.

3. 헥소 검색엔진 최적화 RSS feed 포스팅 참고

  • RSS feed를 사용하기 위해 hexo-generator-feed를 설치(이미 설치가 되어 있다면 패스)
npm install hexo-generator-feed --save
  • 헥소 환경 설정에 아래 내용 추가 (루트 폴더 _config.yml)
feed:
  type: atom
  path: atom.xml
 limit: 20

이미 hexo-generator-feed가 설치되어 있거나 타입이 atom이 아닌 rss2로 사용할 경우 테마 환경 설정을 아래와 같이 한다.

rss:
  rss:
    title: global.rss
    url: /rss2.xml # atom.xml에서 rss.xml로 변경함.
    icon: fa fa-rss

author(저자)

사이드바 About 또는 상단 바 오른쪽 사진을 클릭하면 나오는 프로필

  • location: 대한민국/서울

사이드바 프로필 사진

  • picture: profile.jpg

커버 이미지 사이드바 이미지 또는 전체 이미지

  • cover_image: cover.jpg

파피콘 이미지

  • favicon: favicon.png

이미지 저장 위치 tranquilpeak 테마 폴더 source/_images 폴더와 source\assets\images에 넣습니다. 또는 루트 폴더 source\assets\images에만 넣습니다.(호스팅 서버에 deploy 후에 보임)

인덱스 페이지 썸네일

말머리에 thumbnailImage: 이미지. jpg

썸네일은 절대 경로라서 호스팅 서버에서 deploy후에만 보임

About

어바웃 팝업창 bio & job 부분 입력은

  • tranquilpeak\languages폴더 en.yml 또는 ko.yml파일 하단에 입력.

excerpt(요약글)

tranquilpeak 테마에는 <!-- more --> 요 기능 말고 <!-- excerpt -->라는 기능도 있습니다.

본문 작성 시 요약 글을 작성하고 그 아래에 <!-- excerpt -->를 넣어 주면 목록 페이지에 요약 글로 표시됩니다.

<!-- more --> 는 요약글이 목록 페이지에서도 보이고 본문에서도 보이지만 <!-- excerpt -->는 메인 목록 페이지에서만 보이고 본문에서는 안 보이는 요약글만을 위한 기능입니다.

반응형