WordPressテーマthe THOR(ザ・トール)のカスタマイズを画像で詳しく【ヘッダー/テーマカラー/見出し/リストのデザイン設定編】

WordPressテーマthe THOR(ザ・トール)のカスタマイズ、色々ありすぎて困ってしまいますよね。どこをどうしたら何が変わるのか、触っているうちにブログ書く時間が…なんてこともしばしば。

そんな方に、まずはヘッダーエリアやメインカラーの設定からやっていきましょう!変更する項目さえわかってしまえば、あっという間に自分だけのブログデザインができますよ。

こんな人におすすめ↓

  • WordPressテーマthe THOR(ザ・トール)を購入してカスタマイズしたい
  • ブログトップページ(ヘッダー部分)のカスタマイズをしたい
  • 見出しのデザイン変更をしたい
  • リスト表示のデザイン変更をしたい
  • 時間をかけずにブログページの目的のところをカスタマイズしたい

抜群に上位表示されやすい WP テーマ 【ザ・トール】

WordPressテーマthe THOR(ザ・トール)のカスタマイズ【ヘッダー編】

最初にブログの顔とも言えるヘッダーエリアのカスタマイズをしていきましょう。

ヘッダーエリア及びその付近の設定はダッシュボードから、外観→カスタマイズ→基本設定[THE] / 共通エリア設定 [THE] / TOPページ設定から変更ができます。
共通エリア設定[THE]から進むと「ヘッダーエリア設定」とあるのですが、ここで全部完了するわけではなかったです。

ヘッダーカラーの設定方法①

画像の通り、基本設定[THE]→基本スタイル設定と進むと、「テーマカラー設定」というものがあります。こちらで色を変えるとヘッダーの色が変わります。
また、この方法でカラーを変えると、カテゴリーのラベルカラーも変わります。

ヘッダーカラーの設定方法②

共通エリア設定[THE]→ヘッダー設定と進んでも変更が可能です。この場合は、ヘッダーだけのカラーを変更したいときに使います。自分のブログのデザインイメージに合わせて使い分けましょう。

サイトロゴ設定の方法

サイトの顔であるブログタイトル、こちらをロゴに差し替える方法です。
基本設定[THE]→サイトロゴ設定と進むと、サイトロゴの貼り付け場所があるのでお持ちのサイトロゴ画像を貼り付けましょう。

ヘッダーボトムの設定方法

ヘッダーボトムとは、ヘッダーと記事一覧の間のところを指します。
このあたりもヘッダーの一部として考えれられ、読者のユーザビリティやサイトイメージに影響するので意外と重要です。

ヘッダーボトムエリアの設定は、共通エリア設定[THE]→ヘッダーボトムエリアの設定に進みます。

「注目キーワード」部分の設定方法

WordPressテーマ the THOR(ザ・トール)の着せ替えが終わったあと、ヘッダー付近に「注目キーワード」というところがあります。AMPやSEOなどが書いてあるんですが、自分のブログテーマと関係ない人が大半でしょう。この辺りを設定変更していきましょう。

基本設定[THE]→検索機能設定と進みます。下の方にスクロールすると「注目ーワードを設定」とあるので、そこから自由にキーワードのタイトルを変更できます。

スクロールすると…

5個まで注目キーワードを設定できます。ブログのメインキーワードを並べておけば、ブログの概要をわかってもらえるので、入念に選別しましょう。

「注目キーワード」というところも好きなように変更できます。

画像の通り、共通エリア設定[THE]→ヘッダーボトムエリア設定と進みます。背景色も変更ができ、そもそも表示しないこともできます。自分のブログレイアウトに合わせて表示設定をしましょう。

メインビジュアルの設定方法

メインビジュアルは、ヘッダーボトムの下と記事一覧の間の部分を指し、動画や静止画を差し込むことができます。デフォルトでは非表示になっているはずですが、必要であれば「表示」に変更して、画像や動画を入れましょう。

外観→カスタマイズ→TOPページ設定[THE]→メインビジュアル設定と進みます。

このように、サイズは選べますが結構縦幅が取られます。記事一覧が下まで追いやられるので、Googleアドセンス広告を付けている方は設定を調整した方が良いかもしれません。
しかしGoogleアドセンス広告は、トップページの最初のところがクリック率が高いので、全体のバランスをみて表示するかどうかを決めましょう。

WordPressテーマthe THOR(ザ・トール)のカスタマイズ【見出しデザイン編】

見出しのデザインを変更する方法を紹介します。外観→カスタマイズ→パーツスタイル設定[THE]→見出し設定(個別ページ用)と進みます。

H2からH5まで細かく設定できます。
閲覧数が多そうなブログをみた傾向は、テーマの色は同系色で統一して、大見出し、中見出しと一目でわかるようにしています。色々デザインがあるので迷いますが、全体感が混雑しないようにシンプルにまとめる方が良いと思います。

WordPressテーマthe THOR(ザ・トール)のカスタマイズ【リストデザイン編】

外観→カスタマイズ→パーツスタイル設定[THE]→リスト設定(個別ページ用)と進みます。番号なしリスト、番号ありリスト別々に設定できるので、好みによって変更しましょう。

わたしのサイトのリスト表示は黒板っぽくしたかったので、画像のように緑のペーパー×白文字にしています。

目的のカスタマイズはできましたでしょうか。
ブログはあくまで良コンテンツがあるかどうかが肝心ですが、見た目もそれなりに大切だと思います。特に見やすさ、読みやすさの改善をするためならば、今回紹介したカスタマイズは優先的にやった方が良いでしょう。ぜひ試してみてください!

WordPressテーマTHE THOR(ザ・トール)関連の他の記事も合わせてご覧ください。

カスタマイズ前にすること

おすすめカスタマイズについて

タグ管理機能について

SEO設定について

表示速度抜群!WordPress有料テーマTHE THOR(ザ・トール)
4

サイトの表示速度が早くSEO対策になる!
9種類の着せ替え機能があり、デザインの幅広さが特徴のザ・トール。

ブログの個性を出したい、本格的にブログ運営をしたい方におすすめのWordPress有料テーマです。

最新情報をチェックしよう!