プラグインなしでカスタムメニューに動きを付ける

ちょっと前にも書いたが、この方法が探してもなかなか見つからない。
あったとしてもマルチレベルに対応していなかったり、動きがおかしかったりで
納得がいかないままになっていた。
プラグインがあったとしても、既にできあがっているカスタムメニューに対応できないと意味がない。
今回はスライドダウンとアップだけの動きだけだが、読み込み済みのjQueryを利用して
一応満足できる結果を得ることができた。
参考にさせて頂いたサイトのURLを載せておきます。
benhartlenn.com/jquery-sliding-drop-down-navigation/
マルチレベルの場合、サンプルのソースのままだとマウスアウトしたときに
一瞬下の階層のメニューが表示されてしまいます。
なお、この投稿はスパムコメントが多いので、コメントの投稿を許可しないようにしました。

Puffin Web Browserの印象

iOSでフラッシュコンテンツが見られるというアプリ。
レイアウトを確認する意味でインストールしてみました。
はっきり言って無いよりましかなって感じですね。
PCと同じ動きを求めては駄目です。
カクカクって感じの動きをします。
javascriptに関しても、PCと同じ効果を求めるには無理があります。
あくまでも補助ブラウザと捉えるべきでしょう。
しかし、既定のブラウザとして使う人のことも考えると、
ウェブページを制作する側にとってはマイナス面が大きいのではないか、
というのが筆者の率直な印象です。

カスタムメニューに動きを付けたくて・・・

ちょっと調べてみても、これがまたなかなか載っていない。
探せないのであれば自分でスクリプトを書けば良いのだが、
残念ながら知識がないので他人様の力をお借りするしかない。
既にメニュー自体はできているのだから、プラグインなんて使いたくないのだ。
やっと見つけたものは、jQueryを利用したものでスクリプトの行数も5,6行と
簡単なものであった。
イベントにはmouseenterとmouseleaveが使ってあり、
そのせいかどうか分からないが、メニューバーの上で何回か
マウスを動かさないと反応しないものであった。
マルチレベルに対応していないことも問題であったが、
このブログでは今のところ2階層下までのメニューなので、
ここは属性のfirst指定をulに施して何とか乗り切った。
あとはマウスhoverのときに直ぐに反応してくれるスクリプトを探して、
両方の良いところを合体させて何とかお茶を濁すことができたようだ。
jQueryは思い通りに動かせると非常に面白い。

その後、もっと良いスクリプトを見つけましたので、加筆しています。
この記事を最初にご覧になられた方は、1/17の記事もご覧下さい。

Jcode.pmを別のファルダに置いて使う場合

すみません、2015/12/04に加筆しております。
Jcode.pmを利用する場合、以前は下の通りに設定すれば問題なく動いていました。
しかし、ロリポップのサーバー移転を申し込んだところ、急に機能しなくなりました。
まさか、このことが原因だとは思わなかったので、相当はまりました。
試しに use lib ‘../’ の行を削除したところ、無事に動くようになりました。
なお、jcode.pmのファイルはcgiと同じフォルダに置く必要はないようです。

------------ 以下、以前までの投稿 ------------

jcode.plの場合は、例えば直ぐ上のディレクトリに置くのであれば下のように指定が簡単だが、
Jcode.pmの場合はちょっとややこしい。

require '../jcode.pl';

Jcodeをいくつかのcgiで使う場合は、直ぐ上のディレクトリに置けば
それだけサーバーにアップするファイルの量が減って、容量の節約になる。
まあ、ちょっとしたことだが、整然としたソースを書くことにも
つながると思うので覚えておいて損はないと思う。
余談はさておき肝心な指定コードだが、下の通りだ。

use lib '../';
use Jcode;

これが、調べてもなかなか見つからないから不思議だ。

前の記事の続きです。

セキュアとそうでない接続でそれぞれ別のフォルダにデータを置いている場合は、
レイアウトの確認が重要です。
確認をする場合は、より厳格なブラウザで行うべきです。
IEやFirefoxで問題なく表示されていても、Google ChromeではNGということも。
何に一番注意しなければならないかというと、CSSにパスが通っているかということです。
Google Chromeの場合、httpで通っていても駄目です。
httpsで直接読み込めるところに置いて下さい。
イメージファイルはhttpでも大丈夫です。
まあ、色々と決まりごとが多く、確認作業が大変です。
昨日のニュースで一人に一つのWEBサイトまたはショッピングサイトの時代がくる
なんて言ってましたが、それをSNSにまで対応させることは容易なことではないと思います。
結構大きな企業でも地図の設定が正しくなかったり、
それこそタブページがちゃんと表示されていなかったりという
話をときどき聞きます。

Facebookのタブページについて

プラグインでFacebook Tab Managerなる便利なものがあり、
これを使えば他のアプリなど必要がないとさえ思わせる。
何しろWPで編集したものが、そのままFacebookのタブページとして表示できるのだから。
ただ、思わぬ落とし穴があって、セキュアな接続になっている場合は
共有SSLではちょっと厳しいかと。
筆者の勘違いかもしれないが、httpsで始まるURLでは
サーバーの深い階層へのアクセスは無理ではないだろうか。
逆を言えば、目的のファイルはルートディレクトリまたはその一つ下のディレクトリに
置いておかなければならないような気がする。
それにWPのように、実際にフォルダとしては存在しないディレクトリを
URLで疑似的に表示させている場合は、尚更難しいのではないか。
苦肉の策として、出来上がったページをhtmlファイルとして保存しておき、
それをFTPソフトを使って任意のフォルダにアップすれば済むことだが、
これをクライアントさんに自ら実行してもらうのは決して望ましいことではない。
独自のSSLが使えるプランに切り替えれば何の苦労もないことは分かっているが、
それだけお金がかかるのも事実だ。
まあ、この件はもっと簡単に解決できる良い方法を考えるとして、
しばらくはセキュアをOFFにして接続することにしよう・・・、と言っても
これは閲覧する側の問題ではないのかな?
何れにせよ二パターン用意しておけということだよね。

本当だろうか?

このブログのフッターウィジェットに取り付けている「名言集および格言集」を見ていると
モンテスキューの言葉として以下のように出ていた。

“自由とは、法の許す限りにおいて、すべてのことをなす権利である。”

これを日本の政治家は真に受けて行動しているに違いない。
良い言葉かもしれないが、自由には責任を伴うということが抜けているように思う。
まあ、政治家だけではないが、好き勝手なことをやっておいて
責任を取ることができない大人が日本には多すぎる。

キャプチャの効果

先日、スパムコメントの多さに閉口して取り付けたキャプチャですが、
効果はかなりあるようです。
スパムコメントがまったく無くなった訳ではありませんが、
激減したことは確かです。
スパムコメントに悩まされている方には導入をお勧めします。
ただし、メインのスクリプトとスタイルシートを少しいじらないと
好みのデザインにはなりません。
テーマがtwentyelevenの場合は特にそう感じます。

サイドバー用のプラグインをコンテント内に表示させる方法

説明の前にサンプルを示しておきます。
それはフロントページの「営業日カレンダー」です。
これはサイドバーに表示させるために作られたプラグインです。
ダウンロードファイルは下のサイトにあります。
www.is-p.cc/wordpress/plug-in/business-calendar/700
有効化されたプラグインをウィジェットエリアにドラッグ&ドロップする前に、
目的のウィジェットエリアができていなければなりません。
それには先ずテーマフォルダ内のfunctions.phpに
widgetを登録するところがあるので、他のID名と重複しないように注意して
新しいwidgetを書き加えます。
次はスタイルを調整するためにセレクターを決めます。
この場合のタグはdivで良いでしょう。
この段階でfunctions.phpファイルをアップしてダッシュボードから
ウィジェットエリアがちゃんとできているか確認しましょう。
筆者の場合はついでに日本語に直しています。(下図)

次にやるべきことは貼り付ける場所に次のコードを挿入します。

			<?php if ( ! dynamic_sidebar( 'sidebar-n' ) ) : ?>
			<?php endif; // end sidebar widget area ?>

sidebar-nの“n”はfunctions.phpで指定した数字に書き換えて下さい。
あとはスタイルシートを書き換えるか書き加えるなりすれば、
思い通りのデザインになるはずです。

最近遭遇したトラブル

FirefoxでWPのLightboxが開かないという現象。
調べてみると同じようなトラブルに見舞われている人もいるようだが、
数として少ないようだ。
アドバイスとして最新のLightboxにしてみては、とか
Jqueryをグーグルからロードしろだとか色々と書かれている。
だが、トラブルを解決するのに一番有効な手段というか
真っ先にやるべきことが意外と見当たらない。
それは何かというと、Firefoxを初期状態に戻すということだ。
これは、ちゃんとワンクリックで済むようにボタンも用意されている。
筆者の場合はこの処置により、一発で直った。
あれこれやってみる前に是非とも試してみて欲しい対処法だ。