TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

今回は、TCDテンプレート『IZM(tcd034)』の初期設定の第3回目ですが、何をするかと言うと、テーマオプションの設定をしていきます。テーマオプションとは簡単に言えば、ブログの見栄えのカスタマイズですね。

当ブログの今現在のテーマはSimplicityですが、テーマオプションという項目は見当たりませんね。かわりに管理画面の「サイトをカスタマイズ」をクリックすると、ズラリとカスタマイズ出来る項目が現れます。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

沢山の項目が現れました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

一方で、今回使用するTCDテンプレート『IZM(tcd034)』では、カスタマイズの項目が少ないです。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

たったこれだけ? 無料テーマよりもかなり少ない様な・・・。

実は、IZMのカスタマイズ画面は、「外観」➝「テーマオプション」から行えます。これは最初にロゴを設定した場所と同じですね(笑)。

スポンサーリンク

IZM(tcd034)のテーマオプションの設定

ここでは8つの項目があります。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

この中で「ロゴの設定」「トップページ」は過去記事で解説済みなので、残りを1つずつ設定して行きましょう。

TCDテンプレート『IZM(tcd034)』~初期設定編ロゴ&ヘッダースライダー
TCDテンプレート『IZM(tcd034)』の初期設定編として、ブログのロゴやヘッダースライダーを変更する方法を紹介していきます。 『...

基本設定

いちばん初めは基本設定になります。

色の設定

ここはとりあえずデフォルトのままで。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

レイアウトの設定

ブログのレイアウト設定は4種類選択可能です。

  • 2カラム右サイドバー
  • 2カラム左サイドバー
  • 3カラム左右サイドバー
  • 3カラム右サイドバー2つ

デフォルトでは3カラムになってたので、そのままにしておきました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

ところが、ブログの右サイドバーには何もありません(笑)。ウィジエットで追加するのでしょうか?

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

追記 レイアウトを3カラムに設定する場合、ウィジェットを追加する必要があります。

基本的に『IZM(tcd034)』では、4つの表示ページがあります。なので、ブログのサイドバーを常に同じ状態にする場合、4種類のウィジェットに同じ設定を行う必要があります。

  • トップページ
  • アーカイブページ
  • 記事ページ
  • 固定ページ

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

カスタムCSS

こちらに書き込むことで、テーマファイルをいじる事なくデザインをカスタマイズする事が出来ます。例えば、カエレバをカスタマイズする場合、普通ならスタイルシート(CSS)にコードを挿入しますが、『IZM(tcd034)』では、カスタムCSSにコードを追加するだけで安全にブログのカスタマイズが可能になります。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

icon-check-square-o 挿入前

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

icon-check-square-o 挿入後

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

絵文字の設定

記事に絵文字は使わないのでチェックを外します。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

レスポンシブデザインの設定

ここは当然、レスポンシブデザインを利用します。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

ロゴの設定

ロゴの設定は先日の記事で解説しています。

TCDテンプレート『IZM(tcd034)』~初期設定編ロゴ&ヘッダースライダー
TCDテンプレート『IZM(tcd034)』の初期設定編として、ブログのロゴやヘッダースライダーを変更する方法を紹介していきます。 『...

トップページ

3段目のトップページの項目です。

ヘッダースライダーの設定

ロゴの設定と同じ記事で解説しています。

記事一覧の設定

記事一覧の設定とは何の事かと言うと、デフォルトでは「記事一覧1の設定」だけにチェックが入っています。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

こんな感じのトップページでした。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

残りの3つを設定してチェックを入れてやります。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

すると先ほどの「新着記事」の横に、設定した3つの記事が現れました。クリック1つで切り替えが出来る優れものですね。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

アーカイブページ

アーカイブページとは、例えば12月に書いたページや、IZMのカテゴリーページなど、いくつかのページをまとめて紹介するページの事です。

記事一覧の設定

アーカイブページの表示に、日付とカテゴリを入れるかどうか選択できます。更に文字の大きさも変更できます。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

ここでは、14pX➝16pXに変更しました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

記事ページ

記事ページとは、投稿・固定ページの事ですね。

フォントサイズ

ここでは、記事タイトルと本文記事の文字の大きさを変更する事が出来ます。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

記事タイトルを21pX➝28pXへ変更。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

本文の文字を14pX➝18pXに変更しました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

項目の表示設定

IZMにテーマを変更してから、記事の最初に貼り付けていた写真が2枚に増えていたのでおかしいなと思っていたのですが、ようやく原因が分かりました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

「サムネイルを本文の前に表示する」にチェックが入っていて、画像が2枚表示されていたので、このチェックを外してやりました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

すると、2枚表示されていた画像が1枚になりました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

ソーシャルボタンの設定

SNSシェアボタンは大きいタイプに変更しました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

いちばん下のTwitterボタンの設定では、@(アットマーク)なしのアカウント名を記入すればOKです。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

記事ページの広告設定1(関連記事上)

将来的にGoogle アドセンスの広告を貼る予定なので、広告の設定は大事になります。そこで、Google アドセンスのバナーと同じ336×280サイズのサンプルを作りました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

このサンプルバナーを右左両方の広告に設定してみました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

しかし、なぜか縦に表示されました(笑)。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

推奨サイズが300×250となっているので、336×280では大きすぎるのでしょうか?今度は推奨サイズ300×250に縮小して、もう一度チャレンジしてみました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

今度は横に2つ並びました。しかし、記事の終わりと離れているためにクリックされる確率は低い気がしますね。

記事ページの広告設定2

記事中の任意の場所にも広告を挿入できます。ショートコードをコピーして広告を入れたい所に貼り付けます。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

すると、記事の終わりのSNSボタンの上に表示されました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

ヘッダー

お次はヘッダー関係です。

ヘッダーバーの表示位置

ヘッダーバーというのは、要するにグローバルナビゲーションの事ですね。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

最初の設定では上になっていましたが、下に変更してみました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

すると、ブログを下にスクロールした時に、一緒にヘッダーバーが追尾して来ました(笑)。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

ヘッダーカルーセルの設定

なにやら初めて聞く名前が出てきましたが、カルーセルとはどういった物なのでしょうか? 調べてみると、どうやら左右にスライドする広告ですね。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

とくに変更すべき個所はありませんが、記事タイプは選べるようになっています。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

フッター

フッターにもカルーセルがありました。

フッターカルーセルの設定

フッターにはヘッダーと違う記事タイプを選ぶのが良いですね。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

フッターの広告設定

フッターにも広告を貼ることが可能です。こちらの広告ユニットの推奨サイズは、横幅728px縦幅90pxという事で、横長のバナーになりますね。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

こんな感じになりました。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

SNSボタンの設定

TwitterやFacebookのURLを挿入すると、アイコンが表示されます。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

あまり目立つ感じではないですね。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

その他

ここはデフォルトのままにしておきます。

TCDテンプレート『IZM(tcd034)』の初期設定~テーマオプション設定

以上でテーマオプション設定の完了です。

TCD最新テンプレート

IZM(TCD34)関連記事
スポンサーリンク

フォローする

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)