WordPressテーマ「Responsive」のトップページの表示設定方法

responsive

こんにちは、岡部です。

今日は弊社Webサイトで使用している、WordPressのテーマ「Responsive」について。

先月末、弊社Webサイトをリニューアルするにあたって、手を抜くため一から作り直す時間が取れなかったので、WordPressのテーマをベースに制作することにしました。

「レスポンシブ」
SEO的に。

「公式に配布されている」
安心、安全。野良テーマ怖い。

「会社っぽい」
一応会社のWebサイトなので、ね。

を条件に、使えそうなテーマを捜索することに。

レスポンシブなだけのテーマは割とたくさんあったのですが、日本語にすると違和感があったり、やたらアーティスティックだったり、自由度が低かったり、怪しげな野良テーマだったりと、なかなかコレというものが決められず、消去法で消していった結果、「Responsive」(なんというストレートなネーミング……)というテーマを採用することにしました。

responsive
こんな感じのテーマ
ダウンロードはこちらから

このテーマ、WordPressのテーマ検索のおすすめに出てくるぐらいなのでさぞ人気なのかと思いきや、日本語の情報がほとんど落ちていません……(チョロっと探してみたところ、この会社の記事ぐらい)なので、メモがてらテーマの設定方法やらをまとめておこうと思います。

responsive_costomize01
まず「外観>カスタマイズ」のメニュー。

responsive_costomize02
この辺りを設定します。

1.サイトタイトルとキャッチフレーズはこの場所。
2.背景色の設定。
3.ヘッダー画像。後述の「テーマ設定」でアップしたロゴは、ここで選べます。
4.背景画像はここでアップ。繰り返しや位置の設定ができます。
5.いちばん上の、目立たない感じのメニューはここ。
6.いわゆる、グローバルメニューというやつはここ。
7.グローバルメニュー下のメニューはここ。
8.フッターメニューはここ。

responsive_themes01
次に、「外観>テーマ設定」のメニュー。

responsive_themes02
この辺りの設定です。

1.メインビジュアルの細かい内容は、ここで設定できるようです。できる「よう」というのは、実はこの部分、ハナっから差し替える気マンマンでしたので、少ししか触っていません。これにハマるコンテンツやサービスを持っていればそれなりに使えそうですが、今のところ弊社にそんなサービスはありませんので、まるっと写真とテキストに差し替えました。

2.ソーシャルの設定が12項目ありました(2013年11月現在)。

その他、ロゴのアップロードや、css/jsの記述、解析ツールの仕込みなどが行えます。

responsive_widgets01
最後に、「外観>ウィジェット」のメニュー。

responsive_widgets02
1,2,3.メインビジュアル下の3カラムは、ここにウィジェットを仕込む感じです。
4.ページ右上に、テキストを出せます。

と、今回はここまで。というより、Wordpressの設定で変えられるところはこの辺りまでっぽいです。あとはphpなりcssなりを編集して、自力で頑張るしかなさそうですね。まだまだオリジナルのResponsive臭の強いSSCのWebサイトですが、少しずつ変えていき、その中でまとめられそうなことがあれば、また記事にしようと思います。(需要あるのかなぁ……)

The following two tabs change content below.
岡部 征爾

岡部 征爾

取締役副社長
熊本県出身。SSCのディレクター兼デザイナー。猫飼い、バイク乗り、隙あらばライブに行きたい人。レスポンシブデザイン、WordPressが得意、three.js勉強中。企画提案からデザイン、開発まで、一通り担当してます。