hugo웹사이트 hero 테마 설정

hero 테마 샘플웹사이트 스크리캡쳐

hugo웹사이트 hero 테마 설정

1. 테마 설치

2. 사이트 구조

content
 │  _index.md  # 사이트 홈 페이지
 ├─404
 │     index.md  # 404 에러페이지
 ├─contact
 │     index.md  # Contact 페이지
 ├─homepage
 │     index.md  # 단순히 하위 블록들을 묶는 역할
 │     about.md  # 홈화면 블록의 About 컴포넌트
 │     work.md  # 홈화면 블록의 Work 컴포넌트
 ├─pages
 │  ├─about
 │  │     index.md  # /about/ 독립 단일 페이지
 │  │     content1.md  # about페이지의 컴포넌트
 │  │     content2.md  # about페이지의 컴포넌트
 │  │     content3.md  # about페이지의 컴포넌트
 │  └─history
 │        index.md  # /history/ 독립 단일 페이지
 │        content1.md  # history페이지의 컴포넌트
 │        content2.md  # history페이지의 컴포넌트
 │        content3.md  # history페이지의 컴포넌트
 ├─services
 │     _index.md  # /services/ 섹션 페이지 (서비스 목록)
 │     accounting.md  # /services/ 하위 페이지
 │     business-advisory.md  # /services/ 하위 페이지
 │     business-sales.md  # /services/ 하위 페이지
 │     mergers.md  # /services/ 하위 페이지
 │     superannuation.md  # /services/ 하위 페이지
 │     tax-filing.md  # /services/ 하위 페이지
 └─work
       _index.md  # /work/ 섹션 페이지 (포트폴리오 목록)
       cargo-terminal.md  # /work/ 하위 페이지
       fall-plaza.md  # /work/ 하위 페이지
       modern-hospital.md  # /work/ 하위 페이지

3. 설정파일

####### config.toml
baseURL = "https://www.example.com/"
languageCode = "en-us"
title = "Hugo Hero Theme"
theme = "hugo-hero-theme"

[module]
  [module.hugoVersion]
    extended = true
    min = "0.92.0"
    
[params]
  google_analytics_id=""

  [params.logo]
    mobile = "images/logo-mobile.svg"
    mobile_height = "36px"
    mobile_width = "36px"
    desktop = "images/logo.svg"
    desktop_height = "29px"
    desktop_width = "217px"
    alt = "Hugo Hero"

  [params.homepage_meta_tags]
    meta_description = "Hero is a multipurpose Hugo theme with fullscreen hero images and page sections. It contains content types for a business or portfolio site."
    meta_og_title = "Hugo Hero Theme"
    meta_og_type = "website"
    meta_og_url = "https://hugo-hero.netlify.app"
    meta_og_image = "https://raw.githubusercontent.com/JugglerX/hugo-hero-theme/master/images/tn.png"
    meta_og_description = "Hero is a multipurpose Hugo theme with fullscreen hero images and page sections. It contains content types for a business or portfolio site."
    meta_twitter_card = "summary"
    meta_twitter_site = "@zerostaticio"
    meta_twitter_creator = "@zerostaticio"

[[menu.main]]
	name = "Services"
	url = "/services/"
    weight = 1

[[menu.main]]
    name = "Work"
    url = "/work/"
    weight = 2

[[menu.main]]
    name = "About"
    url = "/about/"
    weight = 3

[[menu.main]]
    name = "History"
    url = "/history/"
    weight = 3

[[menu.main]]
    name = "Contact"
    url = "/contact/"
    weight = 4

[permalinks]
  post = "/:year/:month/:day/:slug/"
  pages = "/:filename/"

【참고자료】