반응형
테마변경
landscape
테마가 기본 적용되어 있습니다
테마선택
Hexo Themes 에서 마음에 드는 테마를 선택하세요.
저는 icarus 테마를 적용해보겠습니다
이카루스(icarus) 테마의 장점
- 꾸준한 업데이트 (가장 중요함, 현재 Hexo 5 를 지원하는 4.1.2 버전 Release)
- 구글 애드센스를 붙이기 쉽다
- 구글 Analytics를 붙이기 쉽다
- 반응형 디자인을 제공한다
- 여러 가지 comment 기능을 제공한다
설치하기
Hexo v5 부터는 테마 설치도 npm 으로 가능해졌습니다
(예전처럼 git clone 할 필요 없습니다)
# npm 으로 이카루스 테마를 설치합니다
$ npm install --save hexo-theme-icarus
# hexo config 를 icarus 테마로 바꿉니다
$ hexo config theme icarus
이카루스테마 플러그인
플러그인을 많이 제공하는 데
Disqus, ShareThis, Widgets, Google Analytics를 사용해봤습니다
Comment
Changyan · Disqus · DisqusJS · Facebook · Gitalk · Gitment · Isso · LiveRe · Utterance · Valine
Donate Button
Afdian.net · Alipay · Buy me a coffee · Patreon · Paypal · Wecat
Search
Algolia · Baidu · Google CSE · Insight
Share
AddThis · AddToAny · Baidu Share · Share.js · ShareThis
Widgets
Google Adsense · Archives · Categories · External Site Links · Recent Posts · Google Feedburner · Tags · Table of Contents
Analytics
Baidu Statistics · Bing Webmaster · BuSuanZi Web Counter · CNZZ Statistics · Google Analytics · Hotjar · StatCounter · Twitter Conversion Tracking
Other Plugins
Cookie Consent · LightGallery · Justified Gallery · KaTeX · MathJax · Oudated Browser · Page Loading Animations
설정바꾸기
Hexo v5 버전부터는 테마의 config 를 _config.테마명.yml
로 관리합니다
테마 config 도 관리하기 쉽게 같은 위치에 생성됩니다
_config.yml # Hexo 전체 config 파일
_config.icarus.yml # icarus 테마 config 파일
node_modules 하위로 hexo-theme-icarus 모듈이 설치되고_config.icarus.yml
파일이 생성되고
Hexo 설정파일 _config.yml
에서 theme 가 이카루스로 바뀝니다
...
theme: icarus
...
이카루스 테마가 bulma 와 inferno 모듈이 필수라서
필요시 설치해줍니다
$ npm install --save bulma-stylus@0.8.0 hexo-renderer-inferno@^0.1.3
이카루스 config 설정
icarus config 파일 구조는
- version : icarus 버전
# 4.0.0
- variant : icarus 테마 선택
default
또는cyberpunk
선택 가능 - logo : 웹사이트 로고 파일
- head
- favicon : 즐겨찾기 아이콘
- manifest : 사이트 URL, 사이트 명 등
- open_graph : 검색/공유시 URL, 이미지, 저자
- structured_data : 사이트 정보
- navbar
- menu : GNB 메뉴
- links : GNB 오른쪽에 github 링크
- footer
- links : Creative Commons, icarus 테마 링크
- article
- highlight : 코드 테마
- licenses : 글의 저작권 설정
- search : 글 검색기능
insight
로 기본설정 - comment : 글의 댓글 기능
disqus
로 설정함 - donates : 여러 가지 제공하지만
사용안함
- share : 글 공유 기능
sharethis
설정함 - sidebar : 왼쪽/오른쪽 메뉴의 고정여부 설정
- widgets : 왼쪽 오른쪽에 위젯을 표기
- profile : 기본 개인 정보
- social_links : 깃허브, 페이스북, 트위터, RSS
- links : 외부 링크
- plugins
- google_analytics : 구글 분석
- providers
- cdn : javascript, css 파일 다운 받는 CDN 설정
- fontcdn : 인터넷 폰트 사용시
- iconcdn : icon 사용시
이카루스 적용예제
기본블로그( https://skyksit.com )는 이카루스 테마를 사용하고 있습니다.
반응형
'IT > Hexo' 카테고리의 다른 글
Hexo 네이버 사이트 소유확인 (0) | 2022.06.30 |
---|---|
Hexo 구글 검색 콘솔에 사이트맵 최신화 하기 (0) | 2022.06.30 |
Hexo Next 테마 적용하기 (0) | 2022.06.30 |
Hexo 이카루스 테마 수정방법 (0) | 2022.06.30 |
Hexo 태그 플러그인(Tag plugin) 사용법 (0) | 2022.06.30 |
마크다운(Markdown) 사용법 (0) | 2022.06.28 |
Hexo 로 글작성하기 (0) | 2022.06.28 |
Hexo 의 package 설정 (0) | 2022.06.28 |