【WordPress】ポップアップを表示するプラグインをつくってみた

この記事はブログとプログラミングで生計をたてている海外在住ウェブディベロッパーがわかりやすさにこだわって作成しました

jQueryとCSSを使用したポップアップウィンドウ

 

ポップアップウィンドウとは、ウェブサイトのページにアクセスしたり、リンクボタンをクリックしたりしたタイミングで自動的に立ち上がる「別ウィンドウ」のことをいいます。

当サイトトップページにポップアップウィンドウを表示するようにしました。せっかくなので、ここで使用したコードを他でも利用できるように、シンプルなプラグインにしてみました。

ちなみにポップアップウィンドウの実装は、WordPressに標準で組み込まれているjQueryのFadeIn/FadeOut*を使用しました。

 

 

jQueryのFadeIn/FadeOut*

各要素の透明度を操作して、非表示の要素をフェードインまたはフェードアウトさせています。

引数に、”slow”、”normal”、”fast”、もしくは完了までの時間をミリ秒単位で設定することでフェードインまたはフェードアウト時間を指定することができます。

 

 

簡単!ポップアッププラグイン

当サイトのトップページに表示しているポップアップウインドウをプラグインにしてアーカイブしています。

シンプルなポップアップウィンドウプラグインをお探しの方、またWordPressの教材に使ってみたい方、是非お役立てください!

 

簡単!ポップアッププラグイン
はじめにEASY! Popup Plugin(簡単!ポップアップ) は簡単にポップアップ画面が表示できるシンプルなプラグインです。複雑な設定や面倒な操作は一切不要です。 インストールダウンロードの項目から当プラグイ...
PHP/Javascript/WORDPRESS案件全般承ります

オーストラリアで主に日系企業や個人のお客様からのご依頼でお仕事をしております。この記事についてのご質問またはお困りのことがございましたら、お気軽にお問い合わせください。

タイトルとURLをコピーしました