月別アーカイブ: 2013年3月

ハネムーン期間は終わりだ！WordPress3.5のメディアアップロードに対する不満

コメントをどうぞ

WordPress3.5を使用していて、それはあまりにもどうかと思う、という現象に出会ったので。

WordPressで投稿にメディアを追加するためには、投稿画面の”メディアを追加”ボタンをクリックし、各種メディアをファイル選択またはドラッグ&ドロップアップロードで登録、必要であれば名称やキャプションなどをつけた上で投稿に挿入するという手順になっている。

このとき、”添付ファイルの表示設定”というセクションで投稿記事中のサムネイルファイルの配置、大きさ、リンク先を指定するようになっている。そして、リンク先の選択肢はサムネイルの元ファイルである”メディアファイル”の他に、”添付ファイルのページ”も選べるようになっている。というか、私がアップデートしたWordPress3.5では、デフォルトで勝手に”添付ファイルのページ”が選ばれていた。

しかも、そのページはThickBoxを使うテクニックを使って、いわゆるlightBox的挙動をするように設定していたページだ。結果、ライトボックスのウィンドウに添付ファイルのページが表示されてしまうという、わけのわからない事態になっていた。

で、記事を投稿するときにつける画像に、いちいちライトボックスが正常に働いているか一つ一つチェックする人は少ないわけじゃない。私にしてもそういう物臭な人間だったため、WordPres3.5にアップデートしてからの投稿記事で、全ての画像のリンク先がページになっていた！

修正作業が面倒くさい。100点ぐらい画像ありますよ？いちいち一つ一つについてリンク先を画像ファイルに変えて、更新。しかもリンクのrel属性に添付ファイルページを識別する名前をつける仕様も好ましくないため、relの部分の指定も削らないといけない。

WordPress3.5にアップデートしてからGooglebotがよくこの添付ファイルのページのクロールエラーを報告してくるのだけど、このサムネイル画像からのrel指定のせいではないですかね。そもそもrel属性はnofollowをつけたりnext、prevなどのクローリングの最適化のために使うべきであって、勝手に謎な識別名の格納場所として使用してしまって良いのですか？

本当にこういう修正作業が空しくなります。やはり、万人のかゆいところに手が届くように作られたソフトウェアというものは、余計なところを掻きむしって使用者の皮膚をボロボロにする定めなのですかね。

そういう例は、本当によく見かけます。

このエントリーをはてなブックマークに追加

PHPとJavaScriptでURLのクエリストリングを評価する

コメントをどうぞ

クエリストリングというのは、ほうぼうのWEBサービスでよく見かける、URLの後ろについた情報を持った文字列です。たとえば、youtubeで動画の検索をするとき、URLの後ろに ?search_query=検索文字列　として、URLにユーザ検索の内容をつけて遷移後のページに渡しています。
このクエリストリングは、search_queryのような普遍的な語でなくても、勝手な語を選んでつけることができます。そもそも、HTMLでフォームを作って送信方法にGETを選ぶと、input要素のユーザが設定したname属性がストリングになっていますね。またinput要素が複数の場合は、&で結ばれています。これもクエリストリングの特徴です。

さて、このクエリストリングをプログラム側でキー値と値の組で取得するにはどうすればよいでしょうか。

PHPでクエリストリング

PHPの場合、大抵の文字列操作は標準の関数として装備されています。本当に。自分で作る前にまず探してみると、大抵便利なのがあります。再発明した車輪はゴミの日にそっと出しましょう。

1.URL文字列からクエリストリングを取り出す場合
//このようなURLがあったとき
$url = "http://akisi.tabiyaku.net/index.php?query1=値1&query2=値2";
 
//クエリ部分を抽出する関数
$query = parse_url($url,PHP_URL_QUERY);
//$queryは"query1=値1&query2=値2"
 
2.現在のページのURLからクエリストリングを取得する場合
$query = urldecode($_SERVER["QUERY_STRING"]);
//urldecodeで、%E3みたいなコードになっているのをデコードする
 
3.取得したクエリストリングをキーと値の組に
parse_str($query,$arr);
 
//$arr["query1"]は値1
//$arr["query2"]は値2

3で$arrを指定しなければ、通常の変数（$query1,$query2）にそれぞれの値が入ります。

JavaScriptでクエリストリング

JavaScriptの場合には、車輪の開発者になる余地が大いにあります。何故PHPのような標準でクエリストリングを扱う関数が無いのでしょう？簡単な話です。JavaScriptは未来の言語だからです。未来の車には、車輪など必要ありません！

1.URL文字列からクエリストリングを取り出す場合
 
//このようなURLがあったとき
var url = "http://akisi.tabiyaku.net/index.php?query1=値1&query2=値2";
 
//クエリ部分を抽出する（処理的には、?を探して以降の文字列をとる）
var query = url.slice(url.indexOf("?")+1);
//queryは"query1=値1&query2=値2"
 
2.現在のページのURLからクエリストリングを取得する場合
var query = decodeURI(location.search);
//decodeURIで、%E3みたいなコードになっているのをデコードする
//ただし、先頭に?を含むところがPHPと異なるので、?なしで取得する場合
var query = decodeURI(location.search).substring(1);
 
3.取得したクエリストリングをキーと値の組に
var arr = new Array();
var qarr = query.split("&");
for(i in qarr){
arr[qarr[i].substr(0,qarr[i].indexOf("="))] = qarr[i].substr(qarr[i].indexOf("=")+1);
}
//arr["query1"]は値1
//arr["query2"]は値2

こういった具合です。

実はJavaScript自体の関数ラインナップはPHPより劣るものの、PHPと同様の充実度を誇るのがjQueryです。確実に世界のどこぞの誰かが、あなたより先に車輪を開発してプラグインにしています。たとえばクエリストリングの評価ならば、jquery.toObject.jsこちらを使えばよろしいでしょう。こんな何某のWEB制作日記とか言う場末ブログのブックマークは、今すぐゴミ箱に放り込みましょう。

このエントリーをはてなブックマークに追加

小ネタ：WordPressがHTML5に対応して、過去記事の見出しに困る

1件のフィードバック

WordPressはそのアップデートの歴史の中で、まさにアップトゥデートな技術を取り込み成長してきました。現在のヴァージョン3.5+Twenty Twelveでの売りはレスポンシブデザインですし、Twenty ElevenではHTML5対応という飛躍がありました。

さて、そうなると過去からずっとWordPressを使い続け、記事を投稿している人間にとっては、過去の投稿資産がアップデートで価値を失ってしまわないかと不安になります。何しろ新技術が過去の資産をラッピングして表示するわけで、何かしらの不具合になってもおかしくありません。

そうしたアップデートに伴い発生する不具合（不都合）の例を挙げましょう。Twenty ElevenでのHTML5対応により、HTML5の大きな特徴であるセクショニング・コンテンツの宣言と、セクション宣言の直後の見出しレベルh1からの使用が可能になりました。

それまで、Twenty Tenおよび他のHTML5未対応テーマでは、投稿記事のタイトルが<h2>から始まっていたため、あえて記事中で見出しをつける際には<h3>タグをルートレベルとせざるを得ませんでした。
ところがHTML5ではセクショニング・コンテンツの開始を宣言すれば、文書中のどの場所でも<h1>タグからの階層構造にする事ができます。そして、Twenty Eleven以降の標準テーマでは、投稿記事を<article>タグで囲んでセクショニングコンテンツとするとともに、記事タイトルを<h1>としているのです。

そこで、Twenty Eleven以降のテーマで過去の記事を表示すると、記事タイトルの<h1>タグの下に”空気を読んで”<h3>に揃えておいた見出しタグが来てしまいます。<h2>タグのない、崩れた構造になってしまいます。

WordPressの売りは、テーマの自由自在な変更に代表される、深く考えなくても良いカスタマイズ性だったはずですが、HTML5へのステップアップを挟む事で、記事本文のテーマからの独立性が保証されなくなったと言えます。いまや、そのテーマが記事でどの見出しタグをルートとしているかあらかじめ知っていないと、無闇にテーマを変更する事ができなくなっているのです。

何が言いたいのかというと、投稿記事の見出しを<h3>タグで始める、手癖がついてしまっているのですよね。困った。

こうしたステップアップを挟んだからか、WordPressのテーマプレビュー（Lorem ipsum…）でサンプル文章中に<h1>、<h2>タグも含まれているのですが、特にこれにスタイルを設定していないテーマもよく見かけます。

誰に腹を立てたら良いのか、怒りのやりどころもわからぬままポチポチ過去記事を修正です
。

このエントリーをはてなブックマークに追加