【OBS用/HTML/MacOS対応】チェックリスト 配信者向けOBSウィジェット
- Digital580 JPY
OBS配信チェックリスト ウィジェット（かわいい配色＆アイコン選択つき） 配信前の確認事項や、配信中のTODO管理にぴったり！ チェック付きのかわいいリストをOBS画面にそのまま表示できる便利ツールです🌸 💡 特徴 ✅ シンプルなチェックリスト形式（1列表示） ✅チェックマークをFont Awesomeアイコンから選べる ✔️ / ⭐ / 💗 / 🎵 / ⚡ / ☁️ など多数！ ✅色のカスタマイズも自由自在（背景色・文字色・アイコン色） ✅タイトル入力可能（「今日のやること」など） ✅LocalStorage自動保存で再読み込みしても安心 📂 内容物 panel.html：チェック項目や色、アイコンなどを設定するためのパネル display.html：実際にOBSなどで表示する用の画面（ブラウザソースに設定）
🧷 使い方・設定方法
本商品は「操作用パネル（panel.html）」と「配信用ディスプレイ（display.html）」の2つのファイルを使用します。 【⚠️ 設定時の重要ポイント】 OBSでブラウザソースを追加する際、「ローカルファイル」のチェックを外して、URL欄に直接ファイルパス（file:///...）を貼り付けてください。 （※Macユーザー様がタイトルや項目を設定するために必要な手順です） 【推奨サイズ】 操作用パネル (panel.html)：幅 550px、高さ 750px 以上 配信用ディスプレイ (display.html)：幅 450px、高さ 600px 以上 ━━━━━━━━━━━━━━━━━ 🟦 【Windows をご利用の方】 ━━━━━━━━━━━━━━━━━ 1. OBSに「ブラウザソース」を2つ追加し、それぞれのURL欄に【panel.html】と【display.html】のファイルパスを貼り付けます。 2. 操作用パネル（panel.html）のソースを右クリックし、「対話（Interact）」を選択します。 3. 表示されたパネルから直接文字を入力し、リスト作成やカラー・アイコンの調整を行ってください。 （※パネルでの操作は、配信画面用の display.html 側に自動で反映・保存されます✨） ━━━━━━━━━━━━━━━━━ 🍎 【Mac をご利用の方（重要！）】 ━━━━━━━━━━━━━━━━━ Mac版OBSの仕様上、パネル内での文字入力ができない制限がございます。そのため、URLの末尾に設定用の文字を書き加えて設定を行います。 ▼ 設定手順 1. OBSに「ブラウザソース」を2つ追加し、それぞれのURL欄に各ファイルのパスを貼り付けます。 2. 操作用パネル（panel.html）のURLの末尾に、以下のように設定を追加して「OK」を押してください。 ✅ 入力例： .../panel.html?title=配信準備&items=マイク確認,BGM準備,ツイート 💡 URLの書き方ルール ?title= チェックリストのタイトル &items= 項目リスト（「、」または「,」で区切って入力） 🎮 配信中の操作について 設定を読み込んだ後は、通常通り「対話」ウィンドウを開き、【マウスクリック】で「完了」チェックを付けたり、カラーやアイコンを変更したりする操作は正常に行えます✨
📝 利用規約
- 収益化された動画・配信での使用OK - 色変更OK - クレジット表記：不要（ご記載いただけたらとても嬉しいです！） ※ 記載される場合は「X（旧Twitter）: @skrm_sozaiya」と表記ください - 自作発言・再配布・転売は禁止 - 素材再配布、商標登録、公序良俗に反する用途での利用は禁止 ※ 著作権は放棄しておりません
🔄 更新履歴 / Update Log
【2026.04.12 アップデート】 ✨ Mac環境への完全対応と、同期システムの強化 ・Mac版OBSでのリスト作成に対応 操作パネル（panel.html）のURL欄にパラメータ（?title=...&items=...）を追加することで、Mac環境でも自由にチェックリストを作成できるようになりました。 ・「ローカルファイル」チェック不要のURL直接入力方式へ移行 文字入力制限を回避するため、ブラウザソースのURL欄に直接パスを入力する方式にマニュアルを改訂いたしました。 ・チェック状態の記憶（保持）機能を強化 設定変更などでURLを再読み込みした場合でも、すでに「完了（チェック済み）」になっている項目の状態がリセットされず、進行状況がそのまま保持されるように改良しました。 ・リアルタイム同期の安定性向上 操作用パネル（panel.html）で行ったカラー変更やチェック操作が、配信用ディスプレイ（display.html）へよりスムーズかつ確実に即時反映されるようプログラムを最適化しました。