【OBS用/HTML】動く！ふんわり可愛い配信ゴールバー/カウンター（自作イラスト対応）
- ダウンロード商品¥ 580
配信画面をさらに可愛く！✨ VTuberさんや配信者さん向けの、ふんわり動く可愛い目標達成バー（ゴールカウンター）です。 面倒な導入作業は一切不要！ 専用の「設定ジェネレーター」が付属しているので、HTMLやCSSの知識がなくても、ブラウザ上でポチポチと設定するだけであなただけのオリジナル目標バーが作れます🎨 ✨ おすすめポイント ✨ 自分のイラストが使える！ プリセットのアイコン（🍬⭐🐰💖🐾）はもちろん、ご自身のオリジナルイラスト（画像URL）をプログレスバーの先端に設定可能！進捗に合わせてスルスルと滑らかに動きます。 自由な表示切り替えでスッキリ！ 「カウンターのON/OFF」「背景（外枠）のON/OFF」がワンクリックで可能。背景を消せば、バーだけがフワフワ浮いているようなシンプルな配置もできます。 なめらか＆リッチなアニメーション！ 斜めストライプが流れるキャンディデザインに、キラキラ光るシャイニングエフェクトを搭載！ カラーピッカー搭載！ 進捗バーの色、背景、文字色などを自由に変更できます。色に迷った時の「デフォルトに戻す」ボタン付き！ 設定の自動保存対応！ 次回ジェネレーターを開いた時も、前回の設定や色がそのまま読み込まれます。 収益化配信での使用（商用利用）OK！ 📦 内容物 - counter.html (ウィジェット本体 兼 設定パネル) ⚠️ イラストURL設定時のご注意 画像のURLは、必ず最後が .png や .jpg で終わる「直接リンク（ダイレクトリンク）」を入力してください。 （WebページのURLでは表示されません。Discordに画像をアップロードし、右クリックして「リンクをコピー」する方法が一番簡単でおすすめです！） ⚠️ 利用規約・注意事項 - 配信画面への映り込み、動画作品での使用、収益化されているチャンネルでのご使用はすべて【許可】しております。 - 本データの二次配布、販売、自作発言は禁止いたします。 - 「イラストURL」機能を使用する場合、必ずご自身で著作権をお持ちの画像、または利用規約で許可されたフリー素材をご利用ください。 - OBSの仕様変更により、将来的に動作に影響が出る可能性がゼロではないことをあらかじめご了承ください。 不具合や「こんな機能が欲しい！」などのリクエストがありましたら、お気軽にメッセージでお問い合わせください✉️✨
📝 使い方
■ 準備：ファイルのURL（場所）をコピーする ダウンロードした html ファイルを、まずはGoogle Chromeなどのブラウザでダブルクリックして開きます。 画面一番上のアドレスバーにあるURL（ file:///〜 で始まる長い文字列）をコピーしておきます。 1️⃣ OBSに「設定パネル（操作用）」を埋め込む OBSの上部メニューから「表示」＞「ドック」＞「カスタムブラウザドック」をクリックします。 ドック名（例：設定）を入力します。 URL欄に、先ほどコピーしたURLを貼り付け、一番後ろに半角で ?dock=1 と付け足して「適用」を押します。 （例： file:///C:/.../counter.html?dock=1 ） 💡 現れたパネルは、OBSの左側や右側の枠にドラッグすると、ピタッと埋め込むことができます！ 🍎 【Macユーザーの方へ】ドックで文字入力ができない場合の裏ワザ Mac版OBSの仕様により、ドック上で文字入力やコピペができない場合があります。 その場合は、URLの末尾に &title=表示したい文字 を追記することでタイトルを設定できます！ （例： .../counter.html?dock=1&title=耐久配信 ） 数字の変更は、入力欄の右側にある「上下の矢印（▲▼）」をマウスでカチカチとクリックすることでコントロール可能です✨ 2️⃣ OBSに「配信画面（バー）」を表示する OBSのソースの「＋」から「ブラウザ」を追加します。 ⚠️重要：「ローカルファイル」のチェックは【外したまま】にしてください。 URL欄に、先ほどコピーしたURLを貼り付け、一番後ろに半角で ?obs=1 と付け足します。 （例： file:///C:/.../counter.html?obs=1 ） 3️⃣ 完成！ あとはOBSに埋め込んだ「設定パネル」で数字や色を変えるだけ！ 配信画面のバーが、リアルタイムにスルッと可愛く動きます🍬✨