管理人はブログやWebサイトを制作するときにWordPressを利用することが多いのですが、先日書いた記事「2016年版!個人がWordPressでブログやサイトを制作するときに検討したいSEOに強い無料テーマ5+2選」でも紹介した「Simplicity」というSEOに最適化された無料テーマはよく利用させてもらってる愛用テーマです。
このSimplicityというテーマは使い勝手が良いのでとても重宝するのですが一つだけ管理人的に困った点があります。それは「3カラムのテーマがない」ということです。いや細かく言うと「ない」わけではなくて「あるけどレスポンシブに対応していない」ということになのですが。
Simplicityを3カラムでレスポンシブ対応する方法
3カラムのデザインにするには「子テーマ」というものを活用するのですが、公式サイトから配布されている3カラムの子テーマはレスポンシブに対応していなくてしかもノーサポートなので、カスタマイズは自己責任で行うということになっています。ブログの内容によっては3カラムのデザインを使いたい&レスポンシブにも対応してほしい管理人としては少々困ってしまいました。
そんなこんなで困ったときのGoogleさんでいろいろとググって調べてみたところ参考になりそうな記事を見つけました。
この記事ではSimplicityを3カラムにして尚且つレスポンシブ対応しているのですが、その方法は3カラムの子テーマを使わずに普通の子テーマをカスタマイズしてレスポンシブ対応するという少しばかりレベルが高いものになっています。
ちなみに管理人はこの方法を自分なりに解釈して試してみたのですが、知識不足なのか下手くそ?なのか結果的にはうまくいきませんでした。
そんなこんなでさらにGoogleさんに頼りつつググって調べてみたところ何とかなりそうな方法を見つけました。その方法はあるプラグインを使う方法です。
この「Any Mobile Theme Switcher」というプラグインはスマホやタブレットからWebサイトにアクセスしたときにPC用のテーマとは別のテーマを適用できるというものなのですが、今回はそれを少ーしだけ応用して活用してみました。
要するに、Simplicityの3カラムの子テーマはレスポンシブ対応されていませんが親テーマはレスポンシブ対応されているのでスマホやタブレットからアクセスがあると子テーマではなく親テーマを表示させる、という方法です。
Any Mobile Theme Switcherの管理画面で、
↓↓↓
という感じで設定します。これでスマホやタブレットからアクセスがあると子テーマ(3カラム・レスポンシブ非対応)ではなくて親テーマ(レスポンシブ対応)が表示されるようになります。
WordPress 仕事の現場でサッと使える! デザイン教科書 (Webデザイナー養成講座)
- 作者: 中島真洋 ,ロクナナワークショップ
- 出版社/メーカー: 技術評論社
- 発売日: 2015/06/23
- メディア: 大型本
- この商品を含むブログ (1件) を見る
WordPressデザインブック HTML5&CSS3準拠 (WordPress DESIGN BOOK)
- 作者: エビスコム
- 出版社/メーカー: ソシム
- 発売日: 2015/09/11
- メディア: 単行本
- この商品を含むブログ (2件) を見る