タイトル、場所、日時、タイムゾーン、繰り返し、招待者、通知、メモを入力し、.ics ファイルをダウンロードするかカレンダーで直接開きます。日程を貼り付けたり、文書や写真を添付したりして、複数の予定をまとめて作成することもできます。
カレンダー追加ボタンやイベント作成ツールを自分のサイトに設置するにはどうすればよいですか？
ICS Makerの作成ツールは単体スクリプトとして提供されます。空の要素を1つ、event-creator.jsを指すスクリプトタグを1つ、そしてEventCreator.mount()の呼び出しを1つ用意するだけです ― ビルド作業も、フレームワークも、アカウント登録も、キーも、表示回数の上限も必要ありません。バンドルはレンダリングライブラリを含めてgzip圧縮後85kB未満の、自己完結型の単一IIFEであり、ネットワークリクエストを一切行いません。アナリティクスもフォントもCDNも使用しないため、コンテンツセキュリティポリシーに新たなオリジンを追加する必要もなく、プライバシーポリシーに新たな項目を加える必要もありません。あらゆる色、角丸、フォントは.ec-root配下のCSSカスタムプロパティとして定義されており、ダークモードは訪問者自身の設定に従い、Reactサイトであればバンドルを読み込む代わりにコンポーネントを直接レンダリングできます。
スクリプトタグ1つで
<div id="event-creator"></div>
<script src="https://icsmaker.com/event-creator.js"></script>
<script>
EventCreator.mount('#event-creator', { showPreview: false });
</script>このバンドルは独自のレンダリング処理とスタイルを備えており、インストールが必要な依存関係はありません。どこにも通信を行いません ― アナリティクスもフォントもCDNも使用しないため、サイトのプライバシーポリシーに新たな項目を追加する必要も、厳格なコンテンツセキュリティポリシーに新たなオリジンを追加する必要もありません。
自分のサイトの見た目に合わせる
あらゆる色、角丸、フォントは.ec-root配下のCSSカスタムプロパティとして定義されているため、--ec-accentを上書きするだけで、たいていのテーマ設定は完了します。ダークモードは訪問者の設定に自動的に従い、スペースに余裕がない場合はshowPreview: falseでプレビューパネルを非表示にできます。
すでにReactを使っていますか？
バンドルを使わずにコンポーネントを直接レンダリングできます。フォームのロジックは同じままで、ページ上のレンダリングライブラリの重複を1つ減らせます。
よくある質問
- この埋め込みは何かをサーバーに送信しますか？
- いいえ。これは訪問者のブラウザ内で完全に動作する静的ファイルです。アナリティクスもテレメトリーも、外部への通信も一切ありません。このドメインから読み込みたくない場合は、バンドルを自分でホストすることもできます。
- サイズはどのくらいですか？
- レンダリングライブラリを含めてgzip圧縮後85kB未満で、ページの読み込みをブロックせず、ページの後に読み込まれます。ビルドはバンドルがこのサイズを超えると失敗するため、このページに記載された数字がいつの間にか事実でなくなることはありません。
- 訪問者がダウンロードできる形式を制限できますか？
- mount呼び出しはオプションを受け取ります ― デフォルトの形式、デフォルトの日付、あらかじめ入力された下書き、プレビューを表示するかどうかなどです。そしてReactコンポーネントも同じ項目をpropsとして受け取ります。