> ## Documentation Index
> Fetch the complete documentation index at: https://craft-support.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# カバー画像

> ドキュメントのカバー画像を追加し、トリミング、位置調整、アスペクト比のオプションでカスタマイズできます。

カバー画像は Craft のドキュメントに視覚的なヘッダーを追加し、洗練されたプロフェッショナルな外観を作ります。自分の画像をアップロードするか、Unsplash の写真コレクションから選択できます。

## カバー画像の追加

<Tabs>
  <Tab title="macOS">
    <Steps>
      <Step>
        ドキュメントを開きます
      </Step>

      <Step>
        右の sidebar で **Style** セクションを選択します
      </Step>

      <Step>
        Click the **Cover Image** option
      </Step>

      <Step>
        **upload your own image** を選ぶか、**Unsplash** から画像を選択します
      </Step>
    </Steps>
  </Tab>

  <Tab title="Web">
    <Steps>
      <Step>
        ドキュメントを開きます
      </Step>

      <Step>
        右の sidebar で **Style** セクションを選択します
      </Step>

      <Step>
        Click the **Cover Image** option
      </Step>

      <Step>
        **upload your own image** を選ぶか、**Unsplash** から画像を選択します
      </Step>
    </Steps>
  </Tab>

  <Tab title="iOS">
    <Steps>
      <Step>
        ドキュメントを開きます
      </Step>

      <Step>
        Tap the three-dot menu
      </Step>

      <Step>
        **Page Style** を選択します
      </Step>

      <Step>
        **Cover Image** を選びます
      </Step>

      <Step>
        **upload your own image** を選ぶか、**Unsplash** から画像を選択します
      </Step>
    </Steps>
  </Tab>
</Tabs>

## カバー画像のカスタマイズ

カバー画像を追加したら、編集・トリミング・位置調整を行って目的に合わせてカスタマイズできます。

<Steps>
  <Step>
    カバー画像の右下にカーソルを合わせます
  </Step>

  <Step>
    表示される **鉛筆アイコン** を Click します
  </Step>

  <Step>
    編集ツールを使って画像をトリミングおよび位置調整します
  </Step>

  <Step>
    終了したら **Done** を Click します
  </Step>
</Steps>

<iframe src="https://www.loom.com/embed/b18a0d437cfc469c9deb5e7985e8a552" title="Customizing cover images in Craft" className="w-full aspect-video rounded-xl" allowFullScreen />

## トリミングのオプション

グリッドのドロップダウンから特定のアスペクト比にトリミングできます：

* **Default** - 元の画像比率
* **16:9** - ワイドスクリーン形式
* **2:1** - ウルトラワイド形式
* **3:1** - 横長バナー
* **4:3** - クラシック表示比
* **Freeform** - コーナーをドラッグして自由にサイズ調整

<Info title="編集のヒント">
  - **ズームアウト**: 編集中に `Cmd` (Mac) または `Ctrl` (Windows) を押し続けます
  - **画像をドラッグ**: 画像を再配置するには `Space` バーを押し続けてドラッグします
  - **リセット**: グリッドのドロップダウンから **Reset** を選んでやり直します
</Info>

## カバー画像の削除

ドキュメントからカバー画像を削除するには：

<Steps>
  <Step>
    カバー画像にカーソルを合わせます
  </Step>

  <Step>
    表示される **X** アイコンを Click します
  </Step>
</Steps>

## Unsplash の画像の利用について

Craft の Unsplash 統合により、高品質なプロの写真にすばやくアクセスできます：

<Steps>
  <Step>
    カバー画像を追加する際に **Unsplash** を選択します
  </Step>

  <Step>
    ドキュメントのトピックに関連するキーワードを検索します
  </Step>

  <Step>
    画像をクリックしてカバーとして追加します
  </Step>
</Steps>

すべての Unsplash 画像は無料で使用でき、帰属表示は必須ではありませんが、記載いただけると助かります。

## 関連記事

<CardGroup cols={2}>
  <Card title="スタイルのクイックガイド" href="/ja/write-and-edit/styling/quick-guide">
    スタイリング機能を網羅したガイド
  </Card>

  <Card title="カード" href="/ja/write-and-edit/styling/cards">
    ページをビジュアルなカードレイアウトに変換する方法
  </Card>

  <Card title="アプリのスタイル" href="/ja/write-and-edit/styling/app-styles">
    ドキュメントスタイルをアプリインターフェイスに拡張する方法
  </Card>
</CardGroup>