見出し画像

【賢威8.0カスタマイズ】コピーライト部修正と続きを読むにnofollowをつけた


WordPress(以降WPと表現します)には、有料、無料いろいろなテーマがあります。

私がお仕事で管理しているブログはライダーストアーの「賢威」というテーマを使っています。

この賢威ですが、先日8.0という最新バージョンが公開されました。
さっそく、お仕事ブログの賢威も8.0にバージョンアップさせたのですが、ちょっと改良したいなぁ、という点がありカスタマイズさせていただきました。

今回行ったカスタマイズは

コピーライト表示の変更
続きを読むにnofollowを入れる

という2点です。

カスタマイズをするのに、テーマのコードを修正するのではなく、子テーマを使ってカスタマイズするのが一般的で、今回も子テーマを使ったカスタマイズを行っています。

今回はWPテーマカスタマイズの基本である子テーマについてと、上記2点のカスタマイズ方法について解説していきます。


子テーマについて

それでは、まずWPカスタマイズの基本、子テーマについて説明します。

子テーマとは

子テーマとは、WPのテーマデザインをカスタマイズするときに使うカスタム専用のテーマです。
実際は、元のテーマと子テーマをインストールして使います。


なぜ子テーマを使うのか

なぜ直接テーマをカスタマイズしないで、子テーマを使うのか、以下2つの理由があります。

「カスタマイズが失敗したとき元に戻せる」

テーマをカスタマイズする場合は、テーマをいじるのではなく、子テーマをいじります。
もし、カスタマイズが失敗したら、子テーマを消してやれば、元の状態に戻ります。
ですので、安心してカスタマイズができるのです。

「テーマのバージョンアップに対応できる」

テーマは時々バージョンアップします。
賢威も現在は8.0ですが、将来8.1とか8.2になる可能性があります。

バージョンアップをすると、テーマのコードはすべて上書きされます。
そうなると、せっかくカスタマイズしたコードも上書きされてしまうのです。

しかし、子テーマでカスタマイズしておくと、テーマがバージョンアップしてもカスタマイズされた部分は上書きされずに残るのです。


以上、2つの理由からWPのカスタマイズには子テーマを使うのが一般的となっています。
注意)テーマやカスタマイズ内容によっては子テーマが使えないとか、使わない方が良いといった場合もあります。


子テーマの有効化

では、テーマと子テーマをインストールして有効化しましょう

テーマと子テーマのインストール

テーマと子テーマを通常のテーマ新規追加の方法でWPにインストールします。

インストール方法は以下のサイトに詳しく載っているので参考にしてください。
(すみません、手抜きです)

WordPressのテーマをインストールする方法/バズ部


テーマのファイル名を修正

本来であれば、管理画面にあるインストール済みのテーマ一覧から「賢威8.0子テーマ」を有効化すれば、ブログが賢威8.0テーマになるはずです。

しかし、「テーマがありません」というエラーが出ます。

なぜかというと、賢威8.0のフォルダ名が
keni80_WP_Standard_*******
という名前になっているからです。
(*******部は購入者のID番号になっているようです。)
そのため、子テーマが元テーマを探せない状況になっています。

そこで、元テーマのファイル名を「keni8」に修正します。

FFFTPなどのFTPソフトを使ってWPがインストールされているサーバー内にアクセスしてください。

画像1

「wp-content>themes」のフォルダを開けると、上図のようにインストールされているテーマのフォルダが表示されています。
この中から、元テーマ(賢威8.0)のフォルダ名を「keni8」に修正します。


子テーマを有効化

またWPの管理画面から「外観→テーマ」に移動しましょう。

インストール済みのテーマ一覧が表示されますので、その中から「賢威8.0子テーマ」をクリックして有効化します。
これで子テーマが有効化されたはずです。

もし、まだエラーが出るようなら、元テーマのフォルダ名を再度確認してください。
また、一度管理画面からログアウトした方がよい場合もあります。


子テーマを使ったカスタマイズ方法

それでは、子テーマを使ってのカスタマイズ方法を説明します。

標準のカスタマイズ(設定変更)

標準のカスタマイズ(設定変更)はWP管理画面の「外観→カスタマイズ」で行えます。
ここで行った設定変更は、テーマのバージョンアップや有効化テーマの変更をしてもそのまま残りますので、設定変更でできることは設定変更でやっておいた方がいいです。

また、CSS(スタイル)の追加ですが、「外観→カスタマイズ」の中に「追加CSS」という項目があります。
この項目で追加したCSSはテーマを変えても残りますので、スタイルシートの追加はなるべくこの機能を使うようにしましょう。


ソース変更をするカスタマイズ

標準のカスタマイズ(設定変更)やCSSの追加では対応できないカスタマイズはソースを修正します。
直接テーマのコードをいじるのではなく、子テーマ内に修正するファイルをコピーして子テーマでコードをいじります。
具体的には次の手順で行います。

変更するソースファイルのコピー

まず、元テーマにある変更したいファイルを子テーマにコピーします。
コピーするには、FFFTPなどのFTPソフトを使ってください。

コピーする際、子テーマ内に元テーマと同じフォルダ階層を作ってください。

テーマエディタでコード修正

WP管理画面で「外観→テーマエディタ」をクリックしてテーマエディタを表示します。

画像2

こんな画面が出てきます。

右側のテーマファイルに表示されているフォルダが修正できるフォルダです。
必要なフォルダが表示されていなければ、正しく子テーマにコピーされていないという事です。

このテーマファイルの中から、修正したいファイルをクリックすると中央部にそのコードが表示されます。
必要な修正を行ったら「ファイルを更新」をクリックします。

子テーマが有効化されていれば、WPは子テーマのファイルを優先させます。
子テーマ内にないファイルは元テーマを参照します。
ですので、子テーマでファイルを修正したら、WPの表示も修正されるという事です。

万一、WPの動作がおかしくなったら、子テーマを無効化すれば元に戻ります。
また、修正した子テーマ内のファイルを消去して、改めて元テーマからコピーすれば修正前の状態に戻ります。


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

それでは、賢威8.0のコピーライト部と続きを読む部のカスタマイズ方法を紹介します。

コピーライト部

賢威テーマでは、各ページの最下部に以下のようなコピーライトが入るようになっています。

「©2016(ブログ名)」

2016というのは、ブログを開始年であり、そのあとにブログ名が来ます。

このブログ開始年は、WPがインストールされた年ですが、ブログによってはWPインストール年より前から公開しているものもあります。
例えば、以前ははてなブログなど別ブログで運用してきて、WPに引っ越してきた場合は、ブログ開始年はWPインストール年ではありません。

そこで、以下のような表示に修正しました

「©2014-2019(ブログ名)」

年表示はブログ開始年-現在となるようにしました。
では、このカスタマイズ方法について説明します。

ファイルのコピー

修正するファイルは「footer.php」です。

画像3

このファイルはkeni8のトップフォルダにありますので、FTPソフトを使って子テーマのトップフォルダ内にコピーします。
移動ではなく、コピーですのでお間違えなく。


コードの修正

WP管理画面の「外観→テーマエディタ」を開けて、右カラムにある「テーマフッター」をクリックします。
中央にこのファイルのコードが表示されます。

画像4

コードの51行目付近に次のようなコードがあります。

<small>&copy; <?php echo get_installed_year() . ' ' . get_bloginfo( 'name' ); ?></small>

このコードを次のように書き換えます。

<small>&copy;2014-<?php echo date('Y').' '.get_bloginfo('name'); ?></small>

もとのコードのあった「get_installed_year()」とは、WPをインストールした年をかえすこまんどです。
これを「date('Y')」に変えてやると、現在の年が表示されます。


これで、ページ下部のコピーライト部が「©2014-2019(ブログ名)」となります。


「続きを読む」をnofollowにする

賢威テーマのトップページは、記事の一覧が並んでいます。
各記事には、サムネイル写真と記事タイトル、要約そして「続きを読む」ボタンがあります。

ここで問題になるのは「続きを読む」ボタンです。

このボタンには記事への内部リンクが張ってあり、アンカーテキストは「続きを読む」です。

トップページには複数の記事があり、そのすべての記事に「続きを読む」というアンカーテキストのリンクが付いているのです。

1つのページに同一のアンカーテキストのリンクが複数(5個以上という説もあります)があるのは、SEO上よくない。
という説があり、賢威のテーマはこれに引っかかっています。

この説は、あまりSEOには関係ないという説もありますが、念のため「続きを読む」リンクにはnofollowを付けます。


ファイルのコピー

ここでカスタマイズするファイルは「template-parts/content-archive.php」です。
これを元テーマから子テーマにコピーします。

画像5

ここで注意してほしいのは、フォルダ構造を合わせなくてはいけないという事です。

つまり、子テーマにも元テーマ同様「template-parts」というフォルダを作り、そのフォルダ内にcontent-archive.phpをコピーします。
フォルダ構造が違うと子テーマで反映できなくなります。


コードの修正

画像6

テーマファイルの「template-parts」内に「content-archive.php」があるはずですので、クリックしてコードを表示させます。

31行目付近の以下のコード

<a href="<?php the_permalink(); ?>" class="btn dir-arw_r"><span class="icon_arrow_s_right"></span><?php _e( 'Read More', 'keni' ); ?></a>

このココードにrel="nofollow"を追加します。

<a href="<?php thepermalink(); ?>" class="btn dir-arw_r" rel="nofollow"><span class="icon_arrow_s_right"></span><?php _e( 'Read More', 'keni' ); ?></a>

これで「続きを読む」のリンクにnofollowが追加されました。

ブログの表示上は変化がないので、ソースコードを読んで確認してください。


まとめ

今回は、WordPressの子テーマを使ってカスタマイズをする方法をご紹介しました。

WPはかなりカスタマイズ度が高いので、いろいろ勉強してオリジナルテーマを作ると楽しいです。
HTML、CSS、PHPの知識があれば、テーマのカスタマイズや新規テーマの作成はできますので、ぜひチャレンジしてみてください。

 

この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

明日もいい一日でありますように
1
バリ島ウブド在住のもんぶぅです。1961年生まれ。大阪の某一流企業を20年勤め、なぜかスキー場のプロモーション会社に転職。そこを5年でやめてバリ島に移住してきました。今は、ECサイト関連会社勤務。仕事の他に個人ブログを運用し、小金を稼ごうと画策中です。
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。