테마 가이드

2025-01-26 updated 2025-04-13 4 min

Retypeset은 Astro 프레임워크를 기반으로 한 정적 블로그 테마입니다. 이 가이드는 테마 설정을 수정하고 새로운 글을 작성하는 방법을 소개하여, 개인 블로그를 빠르게 구축할 수 있도록 도와줍니다.

Theme Configuration

설정 파일 src/config.ts을 수정하여 블로그를 커스터마이징할 수 있습니다.

Site Information

site: {
  // 사이트 제목
  title: 'Retypeset'
  // 사이트 부제목
  subtitle: '타이포그래피의 아름다움을 되살리다'
  // 사이트 설명
  description: 'Retypeset은 정적 블로그 테마입니다...'
  // 위의 정적 title/subtitle/description 대신 src/i18n/ui.ts의 i18n 값을 사용
  i18nTitle: true // true | false
  // 작성자 이름
  author: 'radishzz'
  // 사이트 URL
  url: 'https://retypeset.radishzz.cc'
  // base 경로
  // 모든 페이지와 에셋의 루트 디렉터리
  base: '/' // 예: '/blog', '/docs'
  // 파비콘 URL
  // 권장 포맷: svg, png 또는 ico
  favicon: '/icons/favicon.svg' // 또는 https://example.com/favicon.svg
}

Theme Color

color: {
  // 기본 테마 모드
  mode: 'light' // light | dark | auto
  // 라이트 모드
  light: {
    // 기본 색상
    // 제목, hover 등에 사용
    primary: 'oklch(25% 0.005 298)'
    // 보조 색상
    // 본문 텍스트에 사용
    secondary: 'oklch(40% 0.005 298)'
    // 배경 색상
    background: 'oklch(96% 0.005 298)'
    // 하이라이트 색상
    // 네비게이션 바, 선택된 텍스트 등에 사용
    highlight: 'oklch(0.93 0.195089 103.2532 / 0.5)'
  }
  // 다크 모드
  dark: {
    // 기본 색상
    primary: 'oklch(92% 0.005 298)'
    // 보조 색상
    secondary: 'oklch(77% 0.005 298)'
    // 배경 색상
    background: 'oklch(22% 0.005 298)'
    // 하이라이트 색상
    highlight: 'oklch(0.93 0.195089 103.2532 / 0.2)'
  }
}

Global Settings

global: {
  // 기본 언어
  // 사이트 루트 경로 '/'의 언어
  locale: 'zh' // de | en | es | fr | ja | ko | pl | pt | ru | zh | zh-tw
  // 추가 언어
  // '/en/' '/es/' 와 같은 다국어 경로 생성
  // 위 locale 코드와 중복해서 입력하지 않으며, 빈 배열 [] 가능
  moreLocales: ['en', 'es', 'ja', 'ru', 'zh-tw']
  // 게시글 폰트 스타일
  fontStyle: 'sans' // sans | serif
  // 게시글 날짜 포맷
  dateFormat: 'YYYY-MM-DD'
  // 목차 활성화
  toc: true // true | false
  // katex 수식 렌더링 활성화
  katex: true // true | false
  // 모션 감소
  reduceMotion: false // true | false
}

Comment System

comment: {
  // 댓글 시스템 활성화
  enabled: true // true | false
  // giscus 댓글 시스템
  giscus: {
    repo: ''
    repoId: ''
    category: ''
    categoryId: ''
    mapping: 'pathname'
    strict: '0'
    reactionsEnabled: '1'
    emitMetadata: '0'
    inputPosition: 'bottom'
  }
  // twikoo 댓글 시스템
  twikoo: {
    envId: ''
  }
  // waline 댓글 시스템
  waline: {
    // 서버 URL
    serverURL: 'https://retypeset-comment.radishzz.cc'
    // 이모지 URL
    emoji: [
      'https://unpkg.com/@waline/emojis@1.2.0/tw-emoji'
    ]
    // GIF 검색
    search: false // true | false
    // 이미지 업로더
    imageUploader: false // true | false
  }
}

SEO

seo: {
  // Twitter ID
  twitterID: '@radishzz_'
  // 사이트 인증
  verification: {
    google: 'AUCrz5F1e5qbnmKKDXl2Sf8u6y0kOpEO1wLs6HMMmlM'
    bing: '64708CD514011A7965C84DDE1D169F87'
    yandex: ''
    baidu: ''
  }
  // Google Analytics
  googleAnalyticsID: ''
  // Umami Analytics
  umamiAnalyticsID: 'dab0e4b9-9cbf-43c3-af60-b09d3b545c38'
  // 팔로우 인증
  follow: {
    feedID: ''
    userID: ''
  }
  // Open Graph 이미지 생성을 위한 apiflash 키
  // 발급: https://apiflash.com/
  apiflashKey: ''
}

footer: {
  // 소셜 링크
  links: [
    { name: 'RSS', url: '/atom.xml' },
    { name: 'GitHub', url: 'https://github.com/radishzzz/astro-theme-retypeset' },
    { name: 'Email', url: 'email@radishzz.cc' }
  ]
  // 웹사이트 시작 연도
  startYear: 2025
}

Preload Resources

preload: {
  // 이미지 호스팅 URL
  imageHostURL: 'image.radishzz.cc'
  // 커스텀 Google Analytics JS
  customGoogleAnalyticsJS: ''
  // 커스텀 Umami Analytics JS
  customUmamiAnalyticsJS: 'https://views.radishzz.cc/script.js'
}

Creating a New Post

pnpm new-post <filename> 명령어를 실행하여 새 글을 생성한 뒤, src/content/posts/ 디렉터리에서 편집할 수 있습니다.

pnpm new-post
pnpm new-post first-post
pnpm new-post 2025/03/first-post
pnpm new-post first-post.mdx

블로그 테마 가이드

이정민