# タイマーの追加と設定方法

### ⏳ 学べること

* パスワードページにカウントダウンタイマーを追加する方法
* UTCを使って正しい開始時間を設定する方法
* タイマーのスタイルと配置方法

***

### ステップ1: テーマエディタを開く

1. Shopify管理画面で、次へ移動します **オンラインストア > カスタマイズ**
2. 上部のドロップダウンで選択します **パスワード**
3. サイドバーでを探します **タイマー** セクション
   * そこにない場合は、をクリックします **セクションを追加 > タイマー**

***

### ステップ2: カウントダウン時間を設定する

右側の設定パネルの下で **カウントダウンタイマー**:

* **ドロップ日と時間を設定します**
  * 月、日、年、時、分を選択
  * 午前または午後を選択
* **UTC時間を使用**

  > ⚠️ 重要: ローカル時刻をUTCに変換して、すべての訪問者が同じカウントダウンを表示するようにしてください。
  >
  > 例:\
  > 開始がESTの午後5時の場合、次に変換します **UTCの午後9時**.\
  > Googleを使用：\
  > `5PM EST to UTC` ➜ `UTCの午後9時`

***

### ステップ3: タイマーのレイアウトを調整する

の下で **タイマーの配置**:

* 切り替え： **タイマーを中央に配置** ページの主要な要素がそれだけの場合
* 設定する： **タイマー上部の余白** および **タイマー下部の余白** 間隔のために

***

### ステップ4: タイマーのスタイルを設定する

の下で **カウントダウンのタイポグラフィ**:

* カウントダウンの数字とラベルのフォントサイズを調整（デスクトップのみ）

の下で **カウントダウンのスタイリング**:

* ラベルの切替: 日 / 時間 / 分 / 秒
* 視覚効果のために数字の周りにグローやボックスを有効にする
* ボックスの角の半径を設定（カウントダウンボックスの角を丸くする）
* で不透明度を調整 **カウントダウンボックスの不透明度**

の下で **カウントダウンの色**:

* ボックス、数字、ラベルの色を変更：
  * カウントダウンボックスの色
  * 日 / 時間 / 分 / 秒 のテキスト＋ラベルの色

***

### ステップ5: 保存してプレビュー

クリック： **保存** 💾 を押してライブストアを更新し、カウントダウンをテストしてください。

> 💡 カウントダウンはドロップ、プレセール、新コレクションの期待感作りに最適です。フル効果を得るにはアンロックアニメーションと組み合わせて使用してください。

***

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

* 💬 **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/readme-1/pages-and-menus/password-page/how-to-add-and-set-timer.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.