ZeroZawa のカスタマイズ方法

このガイドでは、ZeroZawa ブログテンプレートの主なカスタマイズポイントについて説明します。

テーマカラーの変更

src/config.tsのthemeColorsセクションで、プライマリカラーとセカンダリカラーを設定できます：

export const SITE_CONFIG = {
  // ...
  themeColors: {
    primary: '#3b82f6',
    secondary: '#06b6d4',
  },
  // ...
}

プロフィールの設定

同じくsrc/config.tsのPROFILE_CONFIGセクションで、プロフィール情報を設定できます：

export const PROFILE_CONFIG = {
  avatar: '/images/profile.jpg',
  name: 'あなたの名前',
  bio: '自己紹介文をここに書きます。',
}

バナーのカスタマイズ

BANNER_CONFIGで、バナーの表示方法を設定できます：

export const BANNER_CONFIG = {
  style: 'image', // 'image' または 'gradient'
  image: '/images/banner.jpg',
  gradient: {
    from: '#3b82f6',
    to: '#06b6d4',
  },
}

その他のカスタマイズ

• tailwind.config.mjsで TailwindCSS の設定をカスタマイズ（Tailwind の設定はこのファイルのみで管理）
• src/styles/global.cssでグローバルスタイルを調整
• src/components/以下のコンポーネントを編集してレイアウトを変更