カウントダウンタイマー作成(埋め込み対応)
タイトルと目標日時を入れるだけで、キャンペーン終了・イベント開始・提出締切までのカウントダウンタイマーを作成できる無料ツール。iframeの埋め込みコードで自社サイト・ブログ・社内ポータルにそのまま設置できます。
使い方
- タイトルと目標の日時を入力する
- プレビューで表示を確認し、必要ならテーマ(ライト/ダーク)を切り替える
- 共有URLまたはiframe埋め込みコードをコピーして、サイトや社内ページに貼る
タイトルと日時を入力すると、埋め込みコードを生成します。
🔒 入力内容はブラウザ内だけで計算・保存され、サーバーには送信されません。「条件のURL」も入力値を#以降に載せるためサーバーへは送られませんが、URLを共有した相手は入力値を見られます。無料・登録不要で使えます。
こんな場面で使える
- キャンペーンLP「終了まであと◯日」を埋め込んで訴求力を上げる
- ウェビナー・展示会の告知ページ開始までのカウントダウンで参加を後押しする
- 社内の締切共有ポータルやNotionに埋め込んで提出期限を意識づける
計算式・仕組みと根拠
- 残り時間 = 目標日時 − 現在時刻(閲覧者の端末の時計基準。1秒ごとに自動更新)
- 埋め込みコード = iframeタグ+パラメータ(タイトル・日時・テーマ)つきURL
- 根拠: タイマーはブラウザ内のJavaScriptだけで動作します。埋め込みページはサーバーへのデータ送信・閲覧データの収集を行いません。
入力例と結果の読み方
タイトル「夏季キャンペーン終了まで」・目標2026年8月31日23:59と設定すると、プレビューに残り日数・時間・分・秒のカウントダウンが表示され、コピー用のiframe埋め込みコードが生成されます。これをLPやブログのHTML編集画面に貼ると、訪問者の画面でリアルタイムに残り時間が減っていきます。締切訴求はCVRに直結するため、キャンペーンLPの定番パーツとして使えます。
よくある間違い
- 過去の日時を設定してしまう(「終了しました」と表示されます)
- 海外ユーザーも見るページで使う(表示は閲覧者の端末時刻基準のため、日本時間の締切とはずれて見える場合があります)
- 埋め込み先で高さを詰めすぎて表示が切れる(コードのheightを調整してください)
境界条件・注意点
- カウントダウンは閲覧者の端末の時計に依存します(端末の時計がずれていれば表示もずれます)
- タイトルと日時はURLパラメータに含まれるため、社外秘の情報は書かないでください
- 埋め込みページは検索エンジンに登録されないよう設定(noindex)しており、アクセス解析タグも含みません
よくある質問
カウントダウンタイマーはどういう仕組みで動いていますか？
URLパラメータに埋め込んだ目標日時と、閲覧者の端末時刻との差を1秒ごとに計算して表示しています。サーバーとの通信は発生せず、登録も不要です。
ブログやLPに埋め込むにはどうすればいいですか？
生成されたiframeコードをコピーして、HTML編集画面に貼り付けるだけです。WordPressなら「カスタムHTML」ブロック、Notionなら「埋め込み」に共有URLを貼ると表示できます。
商用サイトでも無料で使えますか？
無料で、商用サイトでも利用できます。タイマー下部の「Digital Sales」クレジット表記は外さずにご利用ください。改変せずそのまま埋め込む限り、リンク許可の連絡は不要です。
🔖 このツールをよく使う方は、ブックマーク(⌘D / Ctrl+D)しておくと次回すぐ開けます。