WordPressテーマMinimalの便利な設定【人気記事表示・ブログ高速化など】

WordPressテーマMinimalの便利な設定【人気記事表示・ブログ高速化など】
テーマ購入を検討している方へ

2019年現在ではCocoonまたはSnow Monkeyを推奨しています

この記事は以前使っていたテーマのメモです

【ミニマリスト向けのシンプルなテーマ】Minimalの編集方法で初期設定はすべて完了したかと思います。

この記事では便利な設定についてまとめました。

少し難しい内容もありますが、基本的にコピペで対応可能です。特にプラグインも必要ないのでご安心を。

必ずFTPソフトを使って元ファイルと編集するファイルを分けておいてください。

1. プラグインなしで便利な設定

プラグインなし!便利な設定

1-1. 人気記事をサイドバーに表示

まずはfunctions.phpの編集。
『プラグインなし』で人気記事一覧を出力する方法【WordPress】からそのまま貼り付けてください。

デフォルトではサイドバーには「新着記事(Recent Post)」が表示されるようになっています。これを人気記事にするにはsidebar.php

この部分を

このように置き換えるだけ。「よく読まれている記事」の部分はご自由に変えてくださいね。あとは見た目をCSSで整えたらおわりです。

1-2. h2見出し前にアドセンスを自動表示

functions.phpは重要なファイルです。繰り返しになりますが、必ず元ファイルと途中まで設定完了したファイルは事前に保存しておいてください。

WordPressで記事中にアドセンスを自動挿入する方法【ツール不要】の通りです。コードをコピペして、ご自身のアドセンスコードを貼り付けるだけ。これだけでh2見出し前にアドセンスが自動で表示されるようになります。

同時に、記事下にアドセンスを表示させておきましょう。最初の頃は関連コンテンツユニットが利用できませんから。

single.php(個別投稿)を開きます。

ここに~の部分を取得したコードにするだけ。また、初期設定時にタグ余白用のCSSを設定しているのでタグ出力箇所を<div class="tag"></div>で囲っています。

おすすめ広告ユニットは【初心者向け】アドセンス承認後にやるべき3つの設定にまとめています。

1-3. 関連コンテンツユニットの設置

related.phpを開きます。次のようになっているはず。

これを、まるっと置き換えます。

これでOK。「RELATED」の部分はお好きな文言に変更できます。

自分はデフォルトの設定で関連コンテンツユニットを使っていますが、表示形式を変えたい場合は公式ヘルプが参考になります。

ここに書かれている内容を変更してもポリシー違反とはなりません。安心してくださいね。
» レスポンシブ対応の関連コンテンツ ユニットをカスタマイズする方法 – AdSense ヘルプ

ちなみに、当ブログで関連コンテンツユニットが利用できるようになったのが2018年10月です。約7,000PV、60記事ほどでした。

このあたりはアドセンス側がどのように判断しているかがわからないので、あくまでこのブログの場合です。参考までに。

2. 重要な設定とブログ高速化

重要な設定とブログ高速化

2-1. リダイレクト設定【重要】

ここでも事前に元の内容をコピーしておくことをお忘れなく。

エックスサーバーでWPをSSL化した際のリダイレクト設定(.htaccess)中の、まとめると下記の感じですの部分をサーバーから.htaccessに貼り付けるだけ。

エックスサーバーの場合
「サーバーパネル」→「ホームページ」内の.htaccess編集で行います。
ここでキャッシュ設定も兼ねているのでXアクセラレータはオフ、Expiresヘッダの付加はしなくて大丈夫です

リダイレクト設定がなぜ必要か。.htaccessなど、サーバー側でリダイレクトが利用できない場合どのように対処すれば良いですか? | SEO対策Q&A [SEO HACKS]を読むとよくわかります。

2-2. キャッシュ有効化と非同期読み込み

キャッシュ有効化についてはリダイレクト設定の際に一緒に設定できています。

また、プラグインなしでWordPressサイトを高速化する方法【JS・CSS・キャッシュ設定】を参考にして非同期読み込みの設定をするとかなりの高速化につながるようですが、初心者には難しい(私もやっていなかった)のでスルーしてもOK。

2-3. YouTube埋め込みページの高速化

【WordPress】Youtubeを埋め込みの高速化テクニック【プラグインなし】の通りですね。記事ごとに行う必要があるのでそこだけ注意。

また、動画が多いときは【WordPress】Youtubeの多い記事をプラグインなしで高速化する方法を参考に。

2-4. リビジョン無効化

wp-config.phpに以下を追加してください。最下部など、わかりやすいところがおすすめです。

たったこれだけ。リビジョンについての説明は[C]WordPressのリビジョンを停止・制限・削除する方法がとてもわかりやすかったです。自動保存は無効化していません。

2018年はTeraPadで下書き→テキストエディタに貼付→清書…という形をとっていたのでリビジョンを無効化してました。今はGutenbergなので無理に設定しなくても大丈夫ですね。

また、バックアップ設定後にWP-Optimize – データベースを自動クリーンアップ&最適化するWordPressプラグインを参考にリビジョンをまとめて削除しておくとベストです。一度リビジョン無効にすると溜まることもなくなります。その場合このプラグインはいったん消しちゃっても大丈夫です。

3. その他設定

その他設定

3-1. バックアップ設定

【とても簡単】WordPressのバックアップ方法【基本的に不要です】画像付きで解説されています。神。画像の通りに設定しておけば問題ないです。私も【初心者向け】Wordpressに必要なプラグインは6個+αだけで少しだけ触れています。

3-2. アプリーチCSS

こちらの記事を参考にしました。
【コピペで完成】アプリーチのデザインCSS配布!全7種類用意したのでお好みをどうぞ

デザインパターン3がシンプルで好きなので使ってみました。自分が使ってる二段階認証アプリです。CSSをそのままコピペしただけ。

IIJ SmartKey

IIJ SmartKey

Internet Initiative Japan Inc.無料posted withアプリーチ

後はお好みでCSSを調整してください。

3-3. トップに戻るボタンを設置

ブログの右下に、プラグインなしで「トップに戻るボタン」を設置します。

①CSSを追加

ボタンのサイズ、形、色やFont Awesomeのアイコンはご自由に変えてください。CSSだけで実装できるボタンアニメーション(マテリアルデザイン用)を参考にしました。

クラス名はわかりやすいものに変更して大丈夫です。

②footer.phpに追記

<!-- /パンくずリスト -->の下に入れてください。

③page-top.jsを作成

WordPressで使える、jQueryで「トップへ戻る」ボタンの作り方を参考に、page-top.jsというファイルを作成します(私はそのまま使わせてもらいました)。保存形式は.jsで。ファイル名は何でも大丈夫です。

public_htmlwp-contentthemesminimalscriptsに作成したファイルをコピーします。

④header.phpに追記

最後に、header.phpに以下を追記します。自分の場合はわかりやすいようにファビコン、Font Awesomeの真下に追加しました。

page-top.jsは任意のファイル名に変更可能です。入力ミスには注意を。
これで画面右下にPC、スマホいずれも「トップに戻るボタン」が追加されます。細かい部分はお好みで調整を。

以上!

この記事を書いた人

ホシタニ