WordPressの埋め込みYoutubeが、Lightboxと重なる不具合を修正

WordPressには、YoutubeのURLを貼付けるだけで、自動的に埋め込みが可能ですが、Lightboxを同時に使用すると、Chromeなどのブラウザで、ポップアップ画像が、Youtubeの下に重なるという不具合があります。
それを修正する方法を考えてみました。というか探しました。

<script type="text/javascript">
jQuery(function($){
$('iframe').each(function(){
$(this).attr('src',$(this).attr('src')+'&wmode=transparent');
});
});
</script>

結果的に、上記のコードをheader.phpに挿入しました。
これは、iframeタグすべてに &wmode=transparent を追加せよというjQueryです。
WordPressで自作jQueryを呼び出すので、このような書き方になっています。

今回、参考にさせて頂いたのは、 http://blog.dskymd.com/2011/11/lightbox%E3%81%A8youtube%E3%81%AE%E9%87%8D%E3%81%AA%E3%82%8A%E3%81%AE%E4%BF%AE%E6%AD%A3%E3%81%A8youtube%E8%87%AA%E5%8B%95%E5%9F%8B%E3%82%81%E8%BE%BC%E3%81%BF.html

is_mobile 条件分岐タグの作成

WordPress の条件分岐タグ (Conditional Tag) は、特定の条件によって表示させる内容を決める事ができて、カスタマイズには欠かせないものですが、あったら良いのにと思うものがあります。 
たとえば、モバイルを判別できるような、is_mobile とか。USER-AGENTで判別するなら意外と簡単に実装できそうです。 テーマの function.php に以下を追加するだけです。

/*is_mobile*/
  function is_mobile () {
    $useragents = array(
      'iPad',
      'iPhone',
      'iPod',
      'Android',
    );
    $pattern = '/'.implode('|', $useragents).'/i';
    return preg_match($pattern, $_SERVER['HTTP_USER_AGENT']);
  }

使う時は、

<?php if (is_mobile()) { ?>
モバイルでのみ表示したい内容
<?php } ?>

以上。

参考にさせて頂いたのは、
http://terkel.jp/archives/2010/08/optimizing-websites-for-smartphones-with-ua-detection/

WordPressをSSLに対応する

（通常はこんな感じ）

（送信フォームなどを設置したSSLが有効なページ）

（ログイン画面でもSSL）

（管理画面はすべてSSL）

最近のWordPressには、標準で管理画面をSSLで管理するAdministration Over SSLという機能があるようです。（2.6以降はすべてに実装されていたみたいで、知りませんでした。）
やり方は、

define('FORCE_SSL_ADMIN', true);

という記述を、wp-config.php に書き込んで、管理画面の一般設定にある「WordPress のアドレス (URL)」をhttps://に変更すればOKです。

しかし、このままだと強制的なhttp://とhttps://の切り替えがないため、相対パスで遷移した場合、全部https://で遷移されてしまいますので、上記の例では「WordPress HTTPS」というプラグインを使って、必要なページのみSSLを有効にし、それ以外では強制的にSSLが外れるようになっています。このプラグインでの設定方法は、必要なページのチェックボックスに印を入れるだけです。

できてしまえば簡単な事なんですが、いろいろ試行錯誤しているとおかしくなる事がありますので、キャッシュやクッキーを削除したりブラウザを変えたりして、なにがおかしいのか検証する事で解決できると思います。

また同じディレクトリで独自SSLが使える固定IPのサーバーも必要になると思いますが、この例で紹介した環境は次の通りです。

• URL：http://www.iwks.co.jp/
• WordPress：http://www.iwks.co.jp/wp/wp-admin/
• サーバー：さくらマネージドサーバー（atomプラン）
• SSL：RapidSSL

facebookページのお知らせ

最近は新しく個人facebookページを、ブログのように更新しています。
よければそちらもご覧ください。
http://www.facebook.com/pages/今井剛/152089194847739

CORESERVERで送信フォームから、Google Apps グループ宛のメールが送信できない

Google Apps のグループで作成したメールアドレスに、送信フォームからメールが送れないというトラブル事例がありました。

たとえば、info@ やsupport@ などの代表メールアドレスなどは、Google Apps ならグループで作成していろんな個々のメールアドレスを登録するというが一般的だと思います。
そして、そんな代表メールアドレスは、送信フォームの宛先に設定されることでしょう。

XREA系、CORESERVER は、Google Apps が低価格で便利に使える貴重なサーバーですが、そんな CORESERVER で上記のケースを利用している際、送信フォームからグループ宛のメールだけが送信できない事例がいくつかありました。
正確には、内部のメールボックスに取り込んでしまって、外部に送信されない状況です。

そんなトラブルには、まずDNSの設定を疑ってみますが、そこを再確認して問題なければ、手の打ちようもない訳です。

そんな時は CORESERVER を移動してみましょう。サーバーを移動するだけで解決できます。
CORESERVER は同じプランのサーバー間でなんども移動ができる為、これを利用します。
原因が特定できないのは残念なんですが、少なくとも今はこの方法以外に見つかっていません。

メールでもわかりやすいサイトマップの書き方

1. すべて箇条書きであること
2. 記号を適切に使いこなすこと
3. インデントを適切につかうこと
4. ページのタイトルを微妙に変えないこと
5. 必要最小限にまとめること
6. プレーンなテキスト形式を使うこと

WordPress携帯サイトにPCと携帯それぞれのコンテンツを

Ktai Style などを使って、WordPress サイトを構築していると、どう考えてもPC専用のコンテンツを記事に書いている事があって、携帯からアクセスすると、意味が分からない事にもなる。そんな時にはその部分だけを非表示にできればと思うわけです。

これまでは、CSSで display:none; になるようclassを忍ばせる方法を取ってきましたが、しかしそれよりもっといい方法を思いついた。ショートコードでPC用と携帯用のコンテンツを用意すれば良いじゃないかと。

実際には、すでにプラグインを作成されている方がいらっしゃいましたので、今回はそちらをご紹介させていただきます。

PC Ktai content selecter
http://musilog.net/webdesign/wordpress/pc-ktai-content-selecter.php