下からポップアップして注意喚起する一行メッセージ【無料】

下からポップアップして注意喚起する一行メッセージ【無料】

ホームページで、緊急のお知らせや期間限定情報などを流したいとき、トップページの新着情報のセクションにタイトルを掲示するだけではインパクトが足りません。そもそも新着情報は別の情報が出てくると、新着ではなくなってしまいます。大事な情報は、ユーザーにしっかりと注意喚起したいところです。

一行メッセージは、特定のページにアクセスすると、一呼吸おいて、下から半透明のカラーエリアがポップアップして、ユーザーに注意喚起するWebツールです。

一行メッセージのサンプル

当ページの下に半透明のグリーンのカラーエリアにメッセージが出ています。リンクを張れば、ユーザーを詳細ページに誘導することができます。リンクを張らなくてもOK。その場合は、メッセージにアンダーラインが付きません。

見る人のデバイスの画面サイズによって、メッセージのフォントサイズや左右の余白が調整され、メッセージがいつも真ん中に表示されるようになっています。
右の × ボタンを押すとカラーエリアごと消えます。

当然、メッセージの内容など設定を変えれば、何度でも使い回しができます。

一行メッセージ ダウンロードページ

一行メッセージの特長

  1. 設定設置が簡単
  2. 色面が 5 種類から選べる
  3. 商用でも無料で使え、許諾不要

1. 設定設置が簡単

メッセージを読み込みたいページに3つのファイルを読み込み、ページのどこかに決められた書式にしたがって、リンク先アドレスと一行メッセージを書き込めば OK です。
なお、ダウンロードページにコードサンプル付きで解説していますので、ご参照ください。

2. カラーエリアが 5 種類から選べる

カラーエリアは、赤、オレンジ、緑、青、紫の 5 色から、CSS クラスを指定することで選ぶことができます。CSS クラスを指定しない場合は、黒になります。

カラーエリアクラス指定
class="red"
オレンジclass="orange"
class="green"
class="blue"
class="purple"
クラス設定なし

3. 商用でも無料で使え、許諾不要

一行メッセージは、デジタルエイドが開発し、CC(クリエイティブ コモンズ)ライセンスの 表示 + 継承 で配布しています。
ですから、商用/非商用関係なく、無料でお使いいただけますし、許可を取る必要もありません。
また、プログラムを改変することもできます。ただし、改変したプログラムを利用または配布する場合は、オリジナルと同様に、CCライセンスの 表示 + 継承 を踏襲しなければなりません。
この場合、表示とは、ホームページ上にプログラムの著作権者を表示するのではなく、one-line.css や jquery.one-line.js の冒頭の著作権表示を消さないで残しておくだけで結構です。

まとめ

一行メッセージは、ホームページ上で、緊急のお知らせや期限限定の情報を伝え、注意喚起するWebツールです。下からポップアップする半透明のカラーエリアをバックにしているため、 たった一行のテキストだけのシンプルなものですが、 しっかりに目立ちます。
カラーエリアは、5色の中から選ぶことができ、CSSで指定することができます。
一行メッセージは無料でダウンロードできます。

一行メッセージ ダウンロードページ


コメントを残す