ビジネス向けウェブサイト構築運営、ウェブサービス・アプリの企画開発

ワンソース・マルチデバイスが実現する WordPress プラグイン「Multi Device Switcher」

2012年2月 1日 16:20 コメント(0)

デバイス毎にテーマを切り替える WordPress プラグイン「Multi Device Switcher」をリリースしました。

デバイスの多様化が進んでいます。スマートフォンの急激な普及や携帯端末ゲームがインターネットに繋がったり、パソコンに変わりタブレット型端末を手に取ったり、そして近い将来テレビがネットに繋がるスマートテレビが実現と大小さまざまな大きさのモニターでインターネットを使うようになってきました。

その変化に対応してウェブサイトもあらゆるデバイスで見られるように最適化を図る必要に迫られています。

WordPress プラグイン「Multi Device Switcher」は WordPress のコンテンツマネジメントシステムを活かしてワンソース・マルチデバイスが実現するプラグインです。デバイス (現在 スマートフォン、タブレット端末、携帯モバイル、ゲームの 4 つに対応) によって自動的にテーマが切り替わります。

インストール

  1. WordPress のプラグインページから zip ファイルをダウンロード
  2. zip ファイルを解凍
  3. "multi-device-switcher" をプラグインディレクトリ "/wp-content/plugins/" にアップロード
  4. WordPress メニュー「プラグイン」で「Multi Device Switcher」を有効化
  5. デバイスのテーマをディレクトリ "/wp-content/themes/" にアップロード
  6. WordPress メニュー「外観 > マルチデバイス」へ
  7. 設定
  8. 完了

または、WordPress メニュー「プラグイン > 新規追加」から「Multi Device Switcher」で検索してインストール、有効化。

設定

オプションは「テーマ」と「ユーザーエージェント」の2つです。タブで切り替えて設定できます。

テーマ

デバイス毎のテーマを選択します。テーマは前もって用意してください。

ユーザーエージェント

デバイス毎のユーザーエージェントを必要に応じて追加修正できます。新しいユーザーエージェントが出たときに追加してください。

以上でデバイス毎にテーマが切り替わります。

ちょっとした活用法

テーマオプションを「None」にするとテーマは切り替わりません。CSS3 の Media Queries (メディアクエリ) を採用してレイアウトがデバイスに最適化しているテーマはテーマの切り替えが必要ありません。その場合に設定します。他のプラグインと組み合わせた柔軟な運営もできます。スマートフォンの表示にプラグイン「WPtouch」や携帯電話端末の表示にプラグイン「Ktai Style」に任せることができます。

=== Multi Device Switcher ===

This WordPress plugin allows you to set a separate theme for device (Smart Phone, Tablet PC, Mobile Phone, Game).

== Description ==

This WordPress plugin allows you to set a separate theme for device (Smart Phone, Tablet PC, Mobile Phone, Game). This plugin detects if your site is being viewed by UserAgent and switches to selected theme.

== Installation ==

  1. Unzip files.
  2. Upload "multi-device-switcher" to the "/wp-content/plugins/" directory.
  3. Activate the plugin through the 'Plugins' menu in WordPress
  4. Upload a separate theme to the "/wp-content/themes/" directory.
  5. Go to the "Multi Device Switcher" options page through the 'Appearance' menu in WordPress.
  6. Configure settings to your needs. Select Theme by Theme option. Add and fix UserAgent by UserAgent option if necessary.
  7. Have fun!

Download:

WordPress のプラグインページからどうぞ。

Licenses:

Licensed under GPL version 2.0

GitHub:

thingsym / multi-device-switcher

Donationware:

よろしければ、開発とメンテナンスのために寄付していただければうれしいです。

If you like this plugin, please donate to support development and maintenance.

Donationware

JavaScriptを圧縮するツール「Minify JavaScript」

2011年10月17日 15:42 コメント(0)

スタイルシートを圧縮するツール「Minify CSS」に続いて、JavaScriptを圧縮するツール「Minify JavaScript」もつくってみた。

ファイルをアップロードするか、ソースを貼り付けるだけで圧縮してくれます。ファイルは複数アップロード可能でソースをまとめて圧縮、出力してくれます。ソースを符号化する Packer には未対応です。

スタイルシートを圧縮するツール「Minify CSS」

2011年10月15日 18:07 コメント(0)

ウェブサイトやウェブアプリの表示の最適化を求められている昨今。Google の検索エンジンもウェブページの表示の高速化を考慮に入れたり、ウェブサイトのパフォーマンス如何でアクセス数やコンバージョン率、売上に影響を与えつつあり、パフォーマンス向上のため、最適化の必要性が高まっている。

スタイルシートは、HTML5 の普及につれて表現が豊かになりつつあるが、その反面スタイルシートの記述が複雑になり、ファイルサイズも大きくなりつつある。

まず、スタイルシートの最適化に大きく期待できる、2つのポイントを押さえておきたい。

  • 複数の外部ファイルをまとめて HTTP リクエスト数を減らす
  • スタイルシートファイルを圧縮してダウンロードサイズを減らす

ということで、スタイルシートを圧縮するツールをつくってみた。ファイルをアップロードするか、ソースを貼り付けるだけでスタイルシートを圧縮してくれます。ファイルは複数アップロード可能。

MySQLをバージョン5.5.xにアップデート

2011年8月30日 17:10 コメント(0)

yum 経由で MySQL をアップデートした備忘録。

MySQL がバージョン 5.5.3 なってからコマンドやサーバオプション、変数に大幅な変更や廃止が加えられている。グーグルで検索すると今回の変更のことで MySQL が起動しないことがたくさんヒットする。この機会に古い設定を見直しておきたい。

バージョン5.5.x のインストールは無事に済んだが、データベースに繋がらず。

Can't connect to local MySQL server through socket '/var/lib/mysql/mysql.sock' (2)

再起動しても失敗。ログを見ると、いくつかエラーが見られる。

tail -50 /var/log/mysqld.log

...
110830 12:39:45 [ERROR] Can't open the mysql.plugin table. Please run mysql_upgrade to create it.
...
110830 12:39:46 [ERROR] /usr/libexec/mysqld: unknown variable 'default-character-set=utf8'
110830 12:39:46 [ERROR] Aborting
...
110830 12:39:47 [Note] /usr/libexec/mysqld: Shutdown complete

一つ一つ解決。

まずは、デフォルトで文字コードを設定しているが、文字コードの設定の方法が変わったみたいだ。それで MySQL が起動せずにシャットダウン。

my.cnf の設定を変更。[mysqld] ディレクティブにある default-char-set を

default-character-set=utf8

から

character-set-server=utf8

に変更。

再起動ができるようになった。

そしてつぎは、アップグレードの度に実行する mysql_upgrade コマンドでテーブルの互換性をチェック、修正を施す。

mysql_upgrade -u root -p

無事アップグレードが済んで、データベースに繋がった。

関連サイト

PHPでHTML上にエラー表示/非表示する php.ini 設定

2011年7月23日 16:27 コメント(0)

PHP でのエラー表示は php.ini にある

display_errors = On

で HTML 上にエラーが表示される。

display_errors = Off

で HTML 上に表示されなくなる。

さらにエラーレポートレベルによってエラーの種類を設定する必要がある。

PHP 4 と PHP 5 のデフォルトは

error_reporting = E_ALL & ~E_NOTICE

他は、全てのエラー出力をオフにする

error_reporting = 0

全てのエラーを出力する

error_reporting = E_ALL

など定義済み定数で細かく設定できる。

php.ini にあるサンプルには

error_reporting
 Default Value: E_ALL & ~E_NOTICE
 Development Value: E_ALL | E_STRICT
 Production Value: E_ALL & ~E_DEPRECATED

とある。

開発環境には以下の設定を。

error_reporting = E_ALL | E_STRICT

E_ALL には PHP5 から追加された E_STRICT が含まれていないため、E_STRICT で互換性がない推奨されていないコードの警告とスクリプトのチェックをしたい。

Webサービスとして運営する時には、

error_reporting = E_ALL & ~E_DEPRECATED

PHP 5.3.0 で新しく加わった E_DEPRECATED で特定の機能が将来のPHPバージョンで推奨されない場合に警告が表示されるので、回避策として。

さらに

display_errors = Off

でエラー表示をなくしたい。

関連サイト

[an error occurred while processing this directive]
ページの先頭へ
[an error occurred while processing this directive]