レスポンシブ、スライダー、SNSボタン標準装備のイケてるテーマi-MAX

八王子で婚活や女性を応援する「所縁の会」のWebサイトを作らせていただきました。そのときに色々なテーマを試した結果、i-MAXというちょっとかっこいいテーマを見つけました。
レスポンシブデザインやスライダー、ぱんくず機能も付いていて機能も充実しています。このi-MAXについてご紹介します。

i-MAXをインストールする

i-MAXの基本的なカスタマイズ方法について書きたいと思います。まず、インストールから。

ダッシュボード 外観>テーマ 新規登録で

i-max と入力してリターン

i-MAXテーマが表示されるので、インストール をクリックします。

有効化 をクリック

テーマ一覧ページの上部にこのように表示されます。i-MAXには必要なプラグインがあるようなので、

Begin Installing plugins をクリック

必要なプラグインは2つあるので一つずつ、Install をクリックして

Activate します。

これで準備が出来ましたので、表画面を見ると

このようにi-MAXテーマで表示されました(^^)/

スライダー部分をカスタマイズしてみる

このテーマで一番目に付くのは4枚あるスライダーです。この部分をカスタマイズしてみます。

ダッシュボード 外観>カスタマイズ をクリック。

表示されたメニューから Slider をクリック

スライダーは4つあります。まず Slide 1 をクリックしてみます。

入力欄がこのようにありますがこれは、

このように対応しています。試しにちょっと変更してみます。

こんな感じに入力すると

右側にプレビューでどのようになるか表示されるので分かりやすいです。

これで良ければ、

保存して公開 をクリックします。

表画面を見ると、

変更されていました。

  • 写真は ぱくたそさんのものを使わせていただきましたm(_ _)m

電話番号、メールアドレス、サイトのロゴ、基本色、SNSボタンのカスタマイズ

電話番号、メールアドレス、サイトのロゴ、基本色、SNSボタンのカスタマイズをします。

ダッシュボード 外観>カスタマイズ をクリック。

Basic Settings をクリック。ここで電話番号、メールアドレス、サイトのロゴを指定します。



Layout Options
をクリック。ここで基本的な色を指定します。


Social Links をクリック。ここで各種SNSボタンなどの設定をします。

何か文字が入っているとボタンが表示される仕組みです。ここでFacebookページのURLやTwitterのURLなどを入力します。特にリンクすべきページが無ければ # を削除します。

変更を行った場合は、

保存して公開 をクリックして保存することを忘れないようにします。

テーマ i-MAXを使ってつくったサイト「所縁の会」

このような感じで実際につくったサイトがこちらになります。

所縁(ゆかり)の会

i-MAXの子テーマを作ってCSSで色を変えたり、blog「WordPress wp-content/languages/ja.po で翻訳されている日本語を変えたいとき」に書いた方法で文字を置き換えたりしました。

Jetpackを入れているのですがFacebookでシェアしたときに画像が空白になってしまう場合があったので、子テーマのfunctions.php

以前参考にさせてもらったfunctionをちょっと改造した、こんな記述を入れました。

i-MAXで作ったWebサイト 所縁(ゆかり)の会 も是非ご覧くださいm(_ _)m

兎本美佳
ブログを見た人がそのままできたらいいなと思って、できるだけ丁寧に書いています。blogに書いたようなネタの有償対応のご相談は「ゆうそうと」へいただければと思います(^^)/ 無償での対応をご希望の場合は、コメントをいただけましたら可能な場合はコメントを返させていただきます。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク
スポンサー広告
トップへ戻る