Jekyll의 인기 테마 중에서 비지니스, 홈페이지용으로 사용되는 Helium 테마를 간단히 소개해보겠습니다.
ToC on/off
개요
Jekyll에서 사용하는 여러 종류의 테마 중에서 비지니스용 (회사 홈페이지, 랜딩 페이지) 테마에서 인기 순위 상위권을 차지하는 Helium 테마를 소개해보려고 합니다.
![Jekyll의 인기 테마 중에서 비지니스, 홈페이지용으로 사용되는 Helium 테마를 간단히 소개해보겠습니다](/images/programming/jekyll/jekyll-helium-theme-setting-01.png)
구성 요소
Helium 테마의 특징적인 구성 요소들을 정리해보면 다음과 같습니다.
저는 이 중에서 100개 이상의 다양한 UI 블럭이 Helium 테마를 선택해야 하는 가장 큰 장점이 아닐까 생각합니다.
메인 요소
- Bootstrap 4
- Font Awesome
- 100개 이상의 다양한 UI 블럭
- 반응형 디자인
Jekyll 특화 요소
- Jekyll 3.x 이상, Github 지원
- SEO 최적화
- Google Analytics 지원
- Google AdSense 지원
- Disqus comments 지원
기타 요소
- 블로그 페이지 샘플
- 랜딩 페이지 샘플
- 테그 페이지
- 슬라이딩 배너 지원
- Emoji 지원
메인 화면 예시
슬라이딩 배너
홈페이지 상단에 노출되는 슬라이딩 배너를 이렇게 표시할 수 있습니다.
![Jekyll의 인기 테마 중에서 비지니스, 홈페이지용으로 사용되는 Helium 테마를 간단히 소개해보겠습니다](/images/programming/jekyll/jekyll-helium-theme-setting-01.png)
사업 영역
아래와 같은 형식으로 사업 영역을 소개할 수 있고, 고정 배너도 표시할 수 있습니다.
![Jekyll의 인기 테마 중에서 비지니스, 홈페이지용으로 사용되는 Helium 테마를 간단히 소개해보겠습니다](/images/programming/jekyll/jekyll-helium-theme-setting-02.png)
서비스 지표
서비스 소개나 서비스 지표를 아래와 같은 형식으로 표시할 수 있습니다.
![Jekyll의 인기 테마 중에서 비지니스, 홈페이지용으로 사용되는 Helium 테마를 간단히 소개해보겠습니다](/images/programming/jekyll/jekyll-helium-theme-setting-03.png)
직원 소개와 푸터
회사 직원이나 프로젝트 멤버를 소개하는 영역과 푸터 표시는 아래와 같이 할 수 있습니다.
![Jekyll의 인기 테마 중에서 비지니스, 홈페이지용으로 사용되는 Helium 테마를 간단히 소개해보겠습니다](/images/programming/jekyll/jekyll-helium-theme-setting-04.png)
UI 블럭
위에서도 설명 했듯이 Helium 테마는 100개 이상의 UI 블럭을 제공하고 있는데 종류별로 살펴보면 아래와 같습니다.
UI 블럭 1
- Header
- Sliders
- Navigations
- Typography
- Buttons
- Labels / Alerts
![Jekyll의 인기 테마 중에서 비지니스, 홈페이지용으로 사용되는 Helium 테마를 간단히 소개해보겠습니다](/images/programming/jekyll/jekyll-helium-theme-setting-05.png)
UI 블럭 2
- Progress Bars
- Tabs / Accordionss
- Tables
- Cards
- Team
- List
![Jekyll의 인기 테마 중에서 비지니스, 홈페이지용으로 사용되는 Helium 테마를 간단히 소개해보겠습니다](/images/programming/jekyll/jekyll-helium-theme-setting-06.png)
UI 블럭 3
- Pricing
- About Us
- Services
- Features
- Portfolio
- Blog
![Jekyll의 인기 테마 중에서 비지니스, 홈페이지용으로 사용되는 Helium 테마를 간단히 소개해보겠습니다](/images/programming/jekyll/jekyll-helium-theme-setting-07.png)
UI 블럭 4
- Footers
- Maps
- Contact
![Jekyll의 인기 테마 중에서 비지니스, 홈페이지용으로 사용되는 Helium 테마를 간단히 소개해보겠습니다](/images/programming/jekyll/jekyll-helium-theme-setting-08.png)
다운로드
Helium 테마는 아래 경로에서 다운로드 받을 수 있습니다.
미리보기
Helium 테마 미리보기는 아래 경로에서 확인할 수 있습니다.