Simplicity20140918公開。完全レスポンシブ機能追加。

Simplicity20140918にバージョンアップしました。

今回の主な変更点は以下。

1. 「完全レスポンシブデザイン」にできる機能を追加
2. 固定ページにパンくずリストを表示できる機能を追加
3. WordPressテンプレートチェッカーのスコアが100に戻る
4. Theme Checkで警告なし（※デバックモードではない）
5. iframeのレスポンシブ化は、YouTubeとInstagram以外はしないようにした
6. functions.phpが長すぎるので、あまりユーザーが変更しないようなところを切り分けた
7. [修正a]端末の幅に応じて「パソコン用シェアボタン」と「モバイル用シェアボタン」を切り替える機能はカスタマイズ時ややこしくなるので取り止め（9/18 18:48）
8. [修正b]サイドバーを336px設定にした時にモバイルのヘッダーの高さに関するCSSの不具合修正（9/18 20:17）

今回の一応の目玉の機能はレスポンシブ機能です。

完全レスポンシブ化機能追加

前からやりたかった「完全レスポンシブ化機能」を実装しました。

Simplicityはこれまで、パソコン、スマホ合わせて4つのデザインからなる準レスポンシブデザインでした。

ただ今回のバージョンアップで、完全レスポンシブデザインにできるようにしました。

「外観→カスタマイズ→レイアウトの設定」から変更できます。

注意点として、完全レスポンシブにすると、広告位置の選択幅は、狭くなります。例えば記事下のダブルレクタングルとかはできなくなります。

これは、アドセンスのポリシー違反にならないためです。詳しくは以下を参照してください。

Simplicityが「ファイルを生成するキャッシュプラグイン」と相性が悪い理由

表示例

Responsive Design Testingで表示チェックをするとこんな感じになります。

240～480px幅の端末。

少し広め、768ピクセル幅の端末。

広い幅の端末は、パソコンを使ってみてください。

Responsive Checkerでの表示テスト結果は以下。

固定ページにパンくずリスト機能追加

フォーラムにて固定提示パンくずリストの要望をいただいたのでつけてみました。

固定ページを階層化している場合未利用すると、ユーザーの利便性が上がるかもしれません。

設定は「外観→カスタマイズ→レイアウトの設定」から行ってください。

見た目はこんな感じです。（サンプル）

実装は以下を参照してください。

「WordPress固定ページ」にリッチスニペットを用いたパンくずリストの作り方

各種テーマチェッカーで警告が出ないようにした

スキン機能を実装してから、WordPressテンプレートチェッカーのスコアが80まで落ちていたんですが、100に戻すことができました。

これは、スキン機能を実装したことにより、ファイルを直接呼び出すfile_get_contents()関数を使ったのが推奨されている方法じゃなかったようです。これを、WP_Filesystemを使用することで回避することができました。

あと、それを修正したらTheme Checkでも警告がなくなりました。

その他

あとあフォーラムにてiframeに不要なdivがついてしまうという不具合を修正しました。

これは、iframeをレスポンシブ対応するためなんですが、今まではiframeすべてにdivラッパーを取り付けていたのを、必要なものにだけ（YouTubeや、Instagramなど）のみに取り付けるようにしました。

あと、functions.phpが長すぎて、コード編集が少し面倒なことになっていました。そこで、ユーザーがあまり変更しないような関数は、切り分けて外部ファイル化したことでfunctions.phpがかなり短くなりました。これで、かなりfunctions.phpの編集がしやすくなったと思います。

まとめ

前回に続き、今回も結構大きな変更を行いました。

ですのでもしかしたら不具合などあるかもしれません。もし不具合がある場合は、不具合報告フォーラムなどで報告していただけると助かります。

とりあえず今回のバージョンアップで、現時点までのやりたいことは全て実装したので、これからしばらくは、不具合の修正とスキンの追加くらいの更新になるかもしれません。