時計 + 天気予報（簡易版）｜Webでデジタル・アナログ時計をテレビやスマホに表示

こんな人におすすめ

• すぐに使える全画面時計をブログ/サイトに置きたい
• 都道府県・市区町村ごとの天気を簡単に見せたい
• アナログ/デジタルを切り替えたい、秒針の有無や針の太さを調整したい
• BGMループを流して雰囲気を出したい（※ブラウザの仕様に従いユーザー操作後に再生）

主な機能（要点）

• 時計：デジタル/アナログ切替、12/24時間、秒表示、フォント、サイズ、テーマ
• アナログ：目盛り・数字（1～12）付き、秒針ON/OFF、針の太さ、サイズ
• 天気：日本の都道府県/市区町村に対応。未入力orミス時は都道府県の代表地点で表示
• 全画面：ワンクリックでフルスクリーン表示、時計と天気を縦並びで見やすく
• BGMループ：複数のプリセットから選択、次の“秒”に同期して開始、音量調整

クイックスタート（最短手順）

1. 都道府県/市区町村を入力（例：東京都 / 渋谷区）
2. 全画面ボタンで大きく表示
3. 表示切替：アナログ/デジタル、秒表示、サイズ、テーマを調整
4. BGMループ：音源を選択 → 音量を上げる →（必要なら）秒に同期をON

メモ：市区町村が空or見つからない場合は、都道府県の代表地点で表示します。ガイド文も自動で表示。

主要設定の説明（UIの並び順）

時計（共通）

• 表示：デジタル / アナログ
• フォント：System / 明朝 / 丸ゴ / Monospace / Serif
• テーマ：Light / Dark / OLED（背景色・文字色も自動最適化）
• 色：文字色 / 背景色

デジタル

• 秒表示：ON/OFF
• 12時間表記：ON/OFF
• サイズ：S / M / L / XL

アナログ

• 秒針：ON/OFF
• 針の太さ：薄い / 標準 / 太い
• サイズ：S / M / L / XL（SVGの最大幅）

天気

• 都道府県（選択）＋市区町村（テキスト）
• 更新：⟲ ボタンで手動更新（自動更新も実装／一定間隔で再取得）
• メッセージ：条件に応じて案内文を表示（未入力/該当なしなど）

BGMループ

• 音源：複数から選択 / OFF
• 音量：0–100
• 秒に同期：ONで次の秒境界に合わせて再生開始（聴覚と視覚の一体感UP）

埋め込み方法（WordPressショートコード）

下記を記事や固定ページに貼るだけでOK。

[smart_clock_jp default_pref="東京都" default_city="渋谷区" open="0"]

• default_pref：初期の都道府県（例：東京都）
• default_city：初期の市区町村（例：渋谷区）
• open：読み込み時に全画面を開くなら 1（通常は 0）

例：大阪府の代表地点を初期表示 →

よくある質問（FAQ）

市区町村を空にしたらどうなりますか？

都道府県の代表地点で天気を表示し、案内文を出します。詳細表示にしたい場合は市区町村を入力してください。

地名で「見つかりません」と出ます。

表記ゆれ（全角/半角スペース、末尾の「市/区/町/村」）を確認してください。ヒットしない場合は都道府県のみで表示に切り替わります。

音が出ません。

ブラウザの自動再生制限のため、ボタン操作（全画面や音源選択など）後に再生されます。音量も上げてください。

アナログの秒針と音のタイミングは合いますか？

BGMは秒境界に合わせて開始できます。ピッタリの感覚が必要なら「秒に同期」をONにしてください。

注意事項・データソース

• 天気は Open-Meteo API を利用（無料・要クレジット不要）。表示は簡易版（現在天気＋気温）。
• 音源は Pixabay のライセンスに準拠。CREDITS.txt に収録情報とURLを記載。
• 音量・再生可否はユーザー環境（端末/ブラウザ/OSの省電力設定）に影響します。
• 一部の古いブラウザでは、フォントやコンテナクエリの挙動が異なる場合があります。

更新履歴

• v0.9.1：BGMループ（秒同期）、Figma風UI、天気フォーム統合、全画面で縦レイアウト
• v0.9.0：アナログ時計（目盛り・数字・秒針ON/OFF）、天気の都道府県フォールバック

クレジット

• Weather: Open-Meteo
• Sound: Pixabay（詳細は同梱 CREDITS.txt 参照）

まとめ（CTA）

• まずはお試し：デフォルトの「東京都 / 渋谷区」で動作を確認
• 自分色にカスタム：フォント/テーマ/アナログ設定/BGMで雰囲気づくり
• 設置は簡単：ショートコード1行で埋め込みOK

使い心地や要望（例：週間予報・湿度・降水確率など）があれば、コメントで教えてください。順次アップデートに反映します！