# 基本設定

Plain Jane Starter をインストールしたら、ストアの基本設定を構成するためにこのガイドに従ってください。

## ステップ 1: テーマ設定にアクセス

1. **テーマエディタへ移動**

   ```
   Shopify 管理画面 → オンラインストア → テーマ
   ```
2. **カスタマイザを開く**
   * テーマ一覧から「Plain Jane Starter」を見つけます
   * クリック： **「カスタマイズ」** ボタン
   * これでテーマカスタマイザが開きます

\
\&#xNAN;*自動でキャプチャ: 2025-07-17*

## ステップ 2: 基本設定の構成

### アナウンスメントバーの設定

アナウンスメントバーはストアの上部に表示されます。

1. **設定へ移動**
   * カスタマイザで、クリックしてください **「テーマ設定」** 下部にあります
   * 見つける **「アナウンスメントバー」** セクション
2. **アナウンスメントを設定**
   * **アナウンスメントテキスト**： メッセージを入力してください
     * 例: 「$50以上のご注文で送料無料」
   * **アナウンスメントバーを表示**： トグルを ON に
   * **アナウンスメントバーの色**： 背景色を選択
   * **アナウンスメントのテキスト色**： 読みやすさのためにテキスト色を設定
3. **ベストプラクティス**
   * テキストは短く行動を促す内容にしてください
   * 読みやすさのためにコントラストのある色を使用してください
   * 現在のプロモーションに合わせて定期的に更新してください

### タイポグラフィの設定

ストア全体でブランドフォントを設定します。

1. **タイポグラフィセクションを見つける**
   * テーマ設定で、次を探します **「タイポグラフィ」**
2. **フォントを設定**
   * **本文フォント**： 一般的なテキスト（段落、説明）用
   * **ヘッダーフォント**： 見出しやタイトル用
   * **ボタンフォント**： ボタンのテキスト用
3. **フォント選択のヒント**
   * 本文テキストには読みやすいフォントを選んでください
   * ヘッダーはブランドに合うものを選んでください
   * モバイルデバイスでテストしてください
   * 最大で1〜2ファミリーに絞ってください

### 時計設定

一貫した時刻表示のためにストアのタイムゾーンを設定します。

1. **時計設定にアクセス**
   * 見つける **「時計設定」** テーマ設定内
2. **タイムゾーンを選択**
   * ドロップダウンリストから選んでください
   * ビジネスの所在地のタイムゾーンを選択してください
   * 例: 「America/New\_York」、「Europe/London」、「Asia/Tokyo」
3. **これが重要な理由**
   * タイムスタンプ表示に影響します
   * 海外のお客さまにとって重要です
   * 一貫した時間参照を確保します

## ステップ 3: ショップロゴのアップロード

ブランドロゴを追加してアイデンティティを確立します。

1. **ショップロゴへ移動**
   * 見つける **「ショップロゴ」** テーマ設定内
2. **ロゴをアップロード**
   * クリック： **「ショップロゴ」** フィールド
   * ロゴファイルをアップロードしてください（PNG、JPG、SVG 推奨）
   * **ロゴサイズ**： 範囲スライダーで調整（65〜165px）
3. **ロゴに関するガイドライン**
   * 高解像度の画像を使用してください
   * 透明な背景（PNG）が最適です
   * 異なるサイズでテストしてください
   * モバイルでの読みやすさを確認してください

## ステップ 4: 基本的なショップレイアウト

コレクションページでの商品の表示方法を構成します。

1. **ショップレイアウト設定を見つける**
   * 次を探してください **「ショップレイアウト」** セクション
2. **グリッドを設定**
   * **デスクトップの列数**： 2 列または 3 列を選択
   * **モバイルの列数**： 1 列または 2 列を選択
   * **カラム間隔**： 商品間のスペース
   * **行間隔**： 垂直方向のスペース
3. **商品表示オプション**
   * **商品画像のサイズ**： コンテナの割合（60〜100%）
   * **商品ボックス幅**： コンテナサイズ（550〜780px）
   * **商品ボックスをレスポンシブにする**： 推奨は ON
   * **エンドレススクロールを有効にする**： 無限読み込みを有効化
4. **レイアウトのヒント**
   * 商品点数が多いストアには 3 列が適しています
   * 2 列は商品詳細に余白を与えます
   * モバイルでは通常より少ない列を使用してください

## ステップ 5: 基本的な SEO 設定

必須の SEO 要素を設定します。

1. **SEO 設定にアクセス**
   * 見つける **「SEO 設定」** テーマ設定内
2. **アイコンをアップロード**
   * **ファビコン**： ブラウザタブ用の小さなアイコン（32x32px）
   * **Apple Touch アイコン**： モバイルのブックマーク用（120x120px）
3. **リッチスニペットを有効化**
   * **商品リッチスニペット**： ON にしてください
   * **記事リッチスニペット**： ON にしてください
   * これらは検索エンジンでの可視性向上に役立ちます

## ステップ 6: プレビューとテスト

基本設定の後：

1. **変更をプレビュー**
   * クリック： **「プレビュー」** で変更を確認
   * デスクトップとモバイルでテストしてください
   * すべての重要なページを確認してください
2. **重要な機能をテスト**
   * ナビゲーションが正しく動作するか
   * ロゴが正しく表示されるか
   * フォントが見栄え良く表示されるか
   * レイアウトがレスポンシブか
3. **設定を保存**
   * クリック： **「保存」** カスタマイザ内で
   * 変更は自動保存されますが、保存しておくと確実です

## 一般的な設定の問題

### ロゴが表示されない

* ファイル形式を確認してください（PNG、JPG、SVG）
* ファイルサイズが大きすぎないか確認してください
* ブラウザのキャッシュをクリアしてください

### フォントが正しく見えない

* 別のフォント組み合わせを試してください
* モバイルでフォントが読み込まれているか確認してください
* ブラウザのキャッシュをクリアしてください

### レイアウトの問題

* 商品ボックス幅を調整してください
* レスポンシブトグルの設定を確認してください
* 実際のモバイルデバイスでテストしてください

## 次のステップ

基本設定が完了したら、詳細なカスタマイズに進んでください：

👉 **次へ**: [基本設定](/english-ja/plain-jane-starter/getting-started/essential-configuration.md) - ストアの外観と機能を微調整します。

## クイックチェックリスト

先に進む前に、次を完了していることを確認してください：

* ✅ アナウンスメントバーを設定済み
* ✅ フォントを選択しテスト済み
* ✅ タイムゾーンを正しく設定済み
* ✅ ロゴをアップロードしてサイズ調整済み
* ✅ ショップレイアウトを設定済み
* ✅ SEO 設定を有効化済み

***

## ヘルプが必要ですか？

💬 **Discordでコミュニティに参加：** <https://discord.gg/hcc2GvgZc6>

📧 **メールでお問い合わせ：** <support@openspaces.design>

💻 **ライブチャット：** 月〜金、現地時間午前10時〜午後6時（EST）に当社ウェブサイトで直接対応

* ✅ モバイルとデスクトップでプレビューをテスト済み


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.openspaces.design/english-ja/plain-jane-starter/getting-started/basic-setup.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.