WordPressテーマのカスタマイズ

目的をもってテーマ選びをしよう

このサイトを運営している当社は、ウェブサイト制作が本業の一つです。

現在、お受けしている仕事は、とある第三セクターの鉄道会社の公式サイトリニューアルと、リクルートサイトの新規制作という二つを頂いています。

まもなく、公開の予定です。

鉄道会社の公式ページについては、公開からけっこうな年月が経過しており、スマホ対応になっておらず、今回、プラットホームをWordPressに変更して作り変えています。

公式サイトのコンテンツは独自なものが多く、カスタマイズで対応するしかないので「UnderStrap」という海外テーマをベースにお作りしています。

新規のリクルートサイトは、トップページ、先輩社員紹介、会社について、仕事内容について、お問い合せ、そして募集掲載とエントリーページというとてもシンプルなご要望で、公開以降もコンテンツの変更は極めて少ないと思われることから、TCDの「AGENT」をご購入いただき、それをベースにお作りしました。

 

 

カスタマイズは、会社ロゴとグローバルメニューの表示位置との調整を行ったくらいで、ほぼテーマの標準機能でご要望を実現できました。

お客様のご要望とのマッチングもありますが、このように、目的に沿った完成度の高いテーマを選べば、労力を少なくして、品質の良いものができ、その分、サイトの記事などのコンテンツに時間を割くことができますし、制作スピードも驚くほど早く、機能的にもバグの少ないものがご提供できます。

このように、個人でも、ブログでの情報発信が目的か? アフィリが目的か? によって選択するテーマも違ってきますし、アフィリエイトでも、ポータルサイトで行うのか、ペラサイトで行うのか、もしくはブログで行うのかというアフィリエイトのやり方によっても、テーマ選択の考え方が変わってきます。

いずれにしても、アフィリエイトが目的であれば、サイト制作にあまり時間のかからない完成されたテーマを選ぶのが、サイト公開までの時間を短くするために大切なことです。

渾身の力を込めて、サイト制作に多くの作業時間を費やし、結果、ほとんど報酬が発生しなかったというのは、悲しい限りです。

私自身がWordPressテーマを選ぶ際の基準にするのは、自分がやりたいことが、イメージどおりに最短で実現できるかどうかで選択をします。

なので、カスタマイズを極力しなくてもいいテーマを選択します。

賢威や、無料の「Simplicity」や「twentyfifteen」は使いません。

カスタマイズに時間をかけて、モノづくりの喜びはあるかもしれませんが、お金は生んではくれませんから。

スポンサーリンク

TCD「MAG」の固定ページにアイキャッチ画像を表示する

TCDのWordPressテーマは、私が好んで使っているテーマの一つになりますが、その中でも、ブログアフィリエイトで人気の高い「MAG」というテーマに関して、カスタマイズを一つ投稿しておきます。

「MAG」は非常に完成されたテーマです。

PCだけでなく、モバイルでのユーザビリティも高く、ブログアフィリエイトにはとてもお勧めのテーマだと言えます。

ただ、私も、購入したあとになってわかったのですが、固定ページにアイキャッチ画像を登録しても、表示されません。

サポートに聞いてみると、そういう仕様なのだそうです。

 

 

このように、アイキャッチ画像を登録しているにも関わらず、記事しか表示されません。

固定ページでも、ブログ記事と同様にアイキャッチ画像を表示させるには、カスタマイズが必要です。

カスタマイズ後は、このようになります。

 

 

TCDさんにも意図があっての仕様なのでしょうが、私自身はサイトのデザインに統一感がないような気がして、どうしても表示させたかったのです。

WordPressテーマ「MAG(TCD036)」

カスタマイズの具体的な方法

page.phpファイルのバックアップ

phpファイルを書き換えますので、万が一の場合を考えて、次のいずれかの方法で書き換え前のバックアップ取っておいて下さい。

  • page.phpを表示させ、書き換える前の状態で全てを範囲選択してコピーし、テキストファイルとして保存しておく。
  • FFFTPを使って、書き換える前のpage.phpファイルをバックアップとして、ダウンロードしておく。(※何かあった場合は、FFFTPを使って、バックアップファイルで上書きして元に戻す。)
  • 最悪の場合は、テーマファイルを自分のPC内で解凍し、page.phpだけをFFFTPで上書きすれば良い。(※既にpage.phpをカスタマイズしている場合は、その状態には戻りません。テーマファイルを初めてインストールした状態の時と同じpage.phpに戻ります。)
豆知識
【page.phpファイルがある場所】
◆エックスサーバーの場合
自分のドメイン名 ⇒ public_html ⇒  wp-content ⇒ themes ⇒ mag_tcd036の中
※wp-content以降のフォルダ構成は、何れのレンタルサーバーも同じです。

 

page.phpの書き換え

1.ダッシュボードメニューの外観から、テーマの編集を選択

 

 

2.個別投稿ページ(page.php)を選択して表示させる

 

3.17行目にある下記の記述を探す

<div id="article">
<h2 id="page_title"><?php the_title(); ?></h2>
<div class="post_content clearfix">

この記述部分が、書き換えの対象になります。

 

4.記述を書き変える

17行目~19行目を、下記の記述に書き変えて下さい。

一文字ずつ入力しなくても、下記の記述をマウスでコピーした状態のまま、書き換える対象部分を範囲選択して、そのまま貼り付けすれば置き換わります。

このままコピーで使える
<div id="article">
<h2 id="page_title"><?php the_title(); ?></h2>
<?php if(has_post_thumbnail()) { ?>
<div id="post_image">
<?php the_post_thumbnail('size3'); ?>
</div>
<?php }; ?>
<div class="post_content clearfix">

 

 

5.「ファイルを更新」のボタンをクリック

「ファイルの編集に成功しました。」のメッセージが表示されればOKです。

固定ページのカスタムCSSに追記

page.phpの書き換えだけでは、記事タイトルとアイキャッチの間に隙間が空いてしまうため、その隙間をなくすために、固定ページのカスタムCSSに書きのとおり追記します。

固定ページを作成する都度、追記が必要です。

このままコピーで使える
#page_title{ margin-bottom:0; }

TCD「MAG」のアイキャッチ画像サイズ

「MAG」のアイキャッチ画像は、若干、大きめに設定されています。

横幅753px × 高さ460pxが、最もぴったりくるサイズになります。

スポンサーリンク

この記事が気に入ったら
フォローしよう

最新情報をお届けします

おすすめの記事