【配信画面】Neumorphism
- ダウンロード商品¥ 0

こちらは配信画面です。 報告不要・クレジット表記不要で個人・法人・商用問わず使用いただけます。 表記いただける場合には「ももちょこの素材部屋」と記載していただけると嬉しいです。 YouTubeやTwitch等での動画・配信(収益化における制限もございません)など様々な用途でご自由に使用可能です。 二次配布や公序良俗に反する行為・違法行為に利用することはお控えください。 編集や加工は自由に行えますが加工の有無による著作権の譲渡や移動はありません。 ※配布物の著作権は放棄しておりません。 このツールを利用したことでトラブルが生じても一切の責任を負いません。 ------------------------------- ファイル一覧 ------------------------------- |-index.html |-style.css |-script.js |-momochoco.png |-README.txt ------------------------------- 使い方 ------------------------------- |1.基本設定| OBS等の配信ソフトで「ブラウザソース」として使用することを想定しています。 1. OBSを起動し、「ソース」パネルの「+」から「ブラウザ」を選択して新しいブラウザソースを追加します。 2. プロパティ画面で「ローカルファイル」にチェックを入れ、「参照」ボタンからこのフォルダにある「index.html」ファイルを選択します。 3. 「幅」を「1920」、「高さ」を「1080」に設定し、「カスタムCSS」の欄を空欄にして「OK」をクリックします。 |2.配信情報のカスタマイズ| 「index.html」ファイルをメモ帳などのテキストエディタで開いて、ご自身の情報に書き換えます。 変更を保存すると、OBSの画面に自動で反映されます。(反映されない場合は、ブラウザソースのプロパティで「現在のページを再表示」をクリックしてください) ▼ 配信者アイコンの変更 (19行目あたり) <img src="momochoco.png" ...> の "momochoco.png" を、ご自身のアイコン画像ファイル名に変更します。 画像ファイルは index.html と同じフォルダに置いてください。 画像は1:1の正方形サイズの画像を使用してください。 ▼ 配信タイトル・配信者名の変更 (21-22行目あたり) <input ... value="..."> の "..." の部分を、ご自身の配信タイトルや名前に書き換えます。 この部分はOBSの「ブラウザソースの対話(操作)」機能で配信中に変更することも可能です。 ▼ SNS情報の変更 (28行目あたり) <a href="#" aria-label="X" ...>@momochoco_wld</a> のようになっている各行を編集します。 ・`@momochoco_wld` の部分を、ご自身のアカウントIDに書き換えます。 ・不要なSNSは行ごと削除したり、行をコピーして追加したりできます。 ・アイコンの種類は「aria-label」の箇所をご確認ください。 ▼ ハッシュタグの変更 (37行目あたり) <span class="hashtag">#ももちょこ</span> の `#ももちょこ` の部分を、ご自身の配信タグなどに書き換えます。 タグの数を増やしたり減らしたりすることも可能です。 |その他の設定| SNS情報やハッシュタグがスクロールするアニメーションの速度などを変更したい場合は、「script.js」ファイルを開いて調整できます。 ・`createScroller(".sns .scrolling-content", { delay: 0, pause: 3 });` ・`createScroller(".tag .scrolling-content", { delay: 1.5, pause: 4 });` `pause: 3` の数字を大きくすると、次の項目に切り替わるまでの停止時間が長くなります。 ※コメントは別途読み込みをして表示するようお願い致します。 設定がうまくできない場合はお問い合わせください。 対応いたします。 ------------------------------- お問い合わせ ------------------------------- ご不明な点などがありましたら、XのDMやホームページからお問い合わせください。 ・X https://x.com/momochoco_wld ・ももちょこの素材部屋(ホームページ) https://www.momochoco.net