埋め込みバッジジェネレーター
ウェブサイト用の動的な作業ステータスバッジを作成して、訪問者にサービスの利用可能性を知らせます
基本設定
スタイル設定
ライブプレビュー
プレビュー設定
使用方法
Content-Security-Policy: frame-ancestors 'self' isworkingnow.com; よくある質問
埋め込みステータスバッジの使用方法は？
1. 基本情報の設定: 勤務時間、営業時間、勤務日を設定します
2. スタイルの設定: プリセットスタイルを選択するか、色、レイアウトなどをカスタマイズします
3. バッジの生成: 「バッジを生成」ボタンをクリックして埋め込みコードを取得します
4. サイトへの埋め込み: 生成されたiframeコードをあなたのサイトにコピーします
バッジの効果は何ですか？
リアルタイムステータス表示: 設定された勤務時間に基づいて「勤務中」または「オフライン」ステータスを自動表示
複数スタイルサポート: クラシック、カプセル、スクエア、グラデーションなど10種類のプリセットスタイルを提供
レスポンシブデザイン: 様々なデバイスや画面サイズに自動適応
祝日認識: 祝日設定をサポートし、祝日に自動的に「オフライン」ステータスを表示
タイムゾーン対応: 訪問者のタイムゾーンに基づいて正確な勤務ステータスを自動表示
CSPセキュリティポリシーの設定が必要な場合は？
サイトでCSP（Content Security Policy）が有効になっている場合:
• バッジが表示されない、または正しく読み込まれない場合
• ブラウザコンソールにCSP関連のエラーが表示される場合
• サイトに厳格なセキュリティポリシー要件がある場合
解決方法: CSPポリシーに以下の設定を追加してください：
バッジがサポートする技術機能は？
クロスドメインサポート: クロスドメイン制限なしに任意のサイトに埋め込み可能
軽量: 高速読み込み、サイトパフォーマンスに影響なし
依存関係なし: 純粋なHTML/CSS実装、追加のJavaScriptライブラリ不要
SEOフレンドリー: 検索エンジンのクロールとインデックスに影響なし
HTTPS対応: HTTPSサイトと完全互換
設定可能なオプションは？
時間設定: 勤務時間、タイムゾーン、勤務日、祝日
テキスト内容: 勤務中とオフラインステータスの表示テキスト
視覚スタイル: 色、フォントサイズ、パディング、境界線の半径、レイアウト
ステータスインジケーター: カラードットステータスインジケーターの表示オプション
現地時間: 現在の現地時間表示オプション