昨日書いた年齢認証の続き



参考サイト

【jQuery】モーダルウィンドウによる年齢認証の作り方

jQueryと他のライブラリのコンフリクトを避ける方法

テストサイトでの作業履歴

1、子テーマのfunction.phpに、必要な物を読み込む設定を書く

if(!is_admin()){
function register_script(){
wp_register_script('modalConfirm', get_bloginfo('template_directory').'/js/modalConfirm.js');
wp_register_script('cookie', get_bloginfo('template_directory').'/js/jquery.cookie.js');
}
function add_script(){
register_script();
wp_enqueue_script('modalConfirm');
wp_enqueue_script('cookie');
}
add_action('wp_print_scripts','add_script',10);
}


2、wordpressのjQueryでも動くように、modalConfirm.jsに手を加える。
jQueryと他のライブラリのコンフリクトを避ける方法を参考に、modalConfirm.jsの中身をぶっこむ。

jQuery.noConflict();

//ここから実行したいスクリプトを書く
(function($) {

$('#sample').click(function() {

//いつもどおり$が使える

});

})(jQuery);


3、JSファイルのアップロード

4、手作業で全ページに反映するのが面倒なので、Header and Footerプラグインを導入して
Code to be added before the end of the pageにモーダル表示用のhtmlを書いて、全てのページに自動挿入
ついでに、スタイルシートも変更。

あとはcookieの保存期間なんかを直せば、思い通りにいける感じ。

仕舞
求人サイトに年齢認証を付けたかったけど、上手に動かなくて困っていたら
こんなの見つけた。

時限ポップアップや、年齢認証のポップアップ(モーダルウィンドウ)を実現できるプラグイン『ITRO Popup Plugin』
http://website-homepage.com/wordpress/plugin/access-up/itro-popup-plugin

テストサイトに入れたら上手に動いたので、これで実装する予定のメモ。


追記

本当は、このやり方にしたかったのだが、動かなかったのだ。

【jQuery】モーダルウィンドウによる年齢認証の作り方
http://klutche.org/archives/1516/

ところが、何気なく三和出版のサイトを見ていたら、上記の方法で実装している。

jqueryを差し替えて動かしているようだが、使っているテンプレートbizvektorが動かなくなると困るので

いろいろ検索したら、こんなやり方も見つけた。

jQueryと他のライブラリのコンフリクトを避ける方法


明日はこの3つめの方法で動くかテストするアル。


仕舞