WordPress初心者がcocoonと共に導入するべき 厳選 プラグイン8選

Wordpress
OLYMPUS DIGITAL CAMERA

自分が導入したWordPressのおすすめプラグインです。

紹介するプラグインは絶対入れなくてもいいけど

導入するべきと思える便利なプラグインです。

プラグインには、似てる機能、種類さまざまあります。

プラグインなので入れなくても支障はないですが

参考にしてみてください

  • Contact form7(問い合わせ作成)
  • wp multibyte patch(不具合予防)
  • Broken Link Checker(リンクエラー修正)
  • Revision Control(パフォーマンス最適化)
  • EWWW Image Optimizer(画像圧縮)
  • Jetpack(ツイッター連携)
  • Child Theme Configurator(子テーマ作成)
  • Redirection(エラーページを自動転送リダイレクト)
スポンサーリンク

結論:厳選 wordPressおすすめプラグイン8選

実際wordPressに入れているプラグインです。

  • Contact form7(問い合わせ作成)
  • wp multibyte patch(不具合予防)
  • Broken Link Checker(リンクエラー修正)
  • Revision Control(パフォーマンス最適化)
  • EWWW Image Optimizer(画像圧縮)
  • Jetpack(ツイッター連携)
  • Child Theme Configurator(子テーマ作成)
  • Redirection(エラーページを自動転送リダイレクト)

Child Theme Configuratorは子テーマを自分で作らなければならない

子テーマの作り方がわからない場合におススメです

8種類の他にも

  • キャッシュ設定
    サイトページ速度が上がる
  • サイトマップ設定
    サイト管理しやすくなる
  • バックアップ設定
    大切なブログが守られます 

があれば安心です

contact form 7 必須

Contact form7はWordPressに問い合わせページを

作ることができるプラグインです。

自分で問い合わせページを作成する場合には

プログラム言語、HTMLやCSSの知識が必要になります。

しかし、Contact form7を使えばHTMLやCSSの知識がなくても

簡単に設定できます

日本だけでなく、海外でも広く使われています。

Contact Form 7のメリットは、

  1. 導入や設定が簡単
  2. 自動返信メールの設定もできる
  3. 利用者が多いので、設定がわからない場合でも
    ネットで検索することができる

の3つです

Googleアドセンスはご存じですか?

Googleアドセンス審査には

Contact form7などで問い合わせフォームを作成しないと

Googleアドセンス審査に受かりにくいです

Googleアドセンス審査申し込みはこちら

これから、ブログ運営をしていくと考えている方には

Contact form7は必須です

wordpress 固定 ページ 追加

WordPressには、問い合わせフォームがないので

プラグインを使って作成していきます。

お問い合わせフォームは、カテゴリーに属していないので

固定ページに設置していきます。

まず固定ページを作成します。

固定ページ→新規追加をクリックします。

タイトルを お問い合わせ と入力して下書きにします。

これで固定ページに お問い合わせ ページができました。

まだこの段階ではホームページ上に表示されていません

プラグインインストール

WordPressには、問い合わせ機能が存在していないので

プラグインを使って機能を追加していきます。

プラグイン→新規追加→プラグインの検索にcontactform7と入力します。

富士山のマークです。

今すぐインストールをクリックして→有効化をクリックします。

有効化をするとwordPress管理画面左側のメニューに

 お問い合わせ が追加されています。

メニュー お問い合わせ をクリックします。

コンタクトフォーム1をクリックします。

タイトルのコンタクトフォーム1を お問い合わせ に変更します。

お問い合わせに変更後 保存をクリックします。

 



contact form 7 ショート コード

緑枠のショートコードをクリックするとコードが選択されるので

右クリック→コピーでショートコードのコピーをします。

下書きにした固定ページに移動してショートコードを貼り付けます。

貼り付けたら公開をクリックします。

wordpress 固定 ページ 表示

wordPress管理画面に戻り

外観→メニューをクリックします。

メニュー項目を追加からすべて表示タブ→

お問い合わせ にチェックを入れてメニューに追加をクリック

メニュ構造にお問い合わせがあるのを確認をして   

メニューを保存をクリックします

固定 ページ 確認

サイト トップページ上部にある固定ページに

お問い合わせ が

表示されているのでクリックします。

クリックすると

お問い合わせフォームが表示されます

フォーム 修正

表示された お問い合わせ の中身を修正していきます。

デフォルトでは、フォームに 題名 が入っています。

題名 はいらなので消去していきます。

wordPress管理画面→お問い合わせ→お問い合わせをクリックします。

フォームの赤枠で囲った 題名 部分を消します。

電話番号 フォーム

題名 を消去したので空白ができました。

ここに 電話番号 を入れていきます。

テンプレート 青枠の電話番号では

全角入力するとエラーが出てきてしまうので

どの文字でも使える赤枠 テキストを使って作ります。

テキストをクリックします。

電話番号は任意にしたいので必須項目にチェックは入れません。

項目タイプ名前 に tel と入力します。

項目タイプ デフォルト値は

固定ページ お問い合わせ をクリックした時に

入力されている値なので空白にします。

「タグを挿入」をクリックします。

メールアドレスとメッセージ本文の間に

[text tel]

フォームが追加されます。

画像に alt 属性が指定されていません。ファイル名: 2020-10-29_14h16_39-1.png

このままだとフォームだけなのでラベルを作っていきます。

 

ラベル 作成

ラベルは、メールアドレスに似せて修正していきます。

先ほど作った[text tel]

を<label></label>で挟みます。

コード

<label> 電話番号  [text tel] </label>

これでラベルが完成しました。

保存をクリックします。

contact form 7 メール設定

続いてメールの設定をしていきます。

メッセージ本文以外はデフォルトのままで問題ありません。

送信先を変えたい場合には送信先を変更しておきます。

メッセージ本文はメールで送られてくる内容になります。

メッセージ本文を変更していきます。

差出人:[your-name]など項目はフォームと連動しています。

先ほどフォームで消した題名:[your-subject]が

メッセージ本文に入っているので消します。

フォームで作成した電話番号を追加していきます。

電話番号:[tel] と入力します。

保存をクリックします。

contact form 7 自動 返信

メッセージ本文 下にあるメール(2)に入力すると

問い合わせをした相手に

送信完了メールを自動 返信することができます。

メッセージには、あらかじめ相手に送りたいメッセージを

デフォルト値として設定しておけば

設定した内容で送信されます。

設定完了後 保存をクリックします。

contact form 7 確認 メール

設定完了後、設定が合っているか

実際送信してみてテストしてみてください。

設定が思っていたものと違うこともあります

確認メールを送り必ずチェックしましょう。

 



wp multibyte patch とは

wp multibyte patch(ダブリュピー マルチバイトパッチ)とは

もともとWordPressは英語で作られたシステムです

英語のアルファベットは

シングルバイト文字(半角文字  aの幅が1バイト で1バイト文字)になります。

日本語のひらがなや漢字等はシングルバイト文字ではなく

マルチバイト文字(1文字に2バイト使う文字)になります

シングルバイト文字のところにマルチバイト文字が入力されると

ファイル名の変換バグが起きたり、文字化けしたり文字数が正しく拾えくなるなど

不具合が生じる可能性があります。

この不具合を防いでくれるプラグインがWP Multibyte Patchです。

WordPress5.0以降からWP Multibyte Patchプラグインが

標準搭載されなくなりました。

過去に標準搭載していたもなので日本語環境で正しく作動させるために

入れておけば間違いないので有効化しておきましょう。

wp multibyte patch 設定

wordPress管理画面→プラグイン→新規追加→

プラグインの検索にWP Multibyte Patchと入力します。

表示されたら今すぐインストールをクリックします。

インストールが完了したら有効化をクリックします。

WP Multibyte Patchを有効化をすれば設定完了です。

broken link checker

Broken Link Checkerは

リンクの記載ミス

サイトのリンク切れをチェックをしたり

お知らせをしてくれます

ブログを作成していくと

リンク切れを常に監視していくのは不可能です。

リンク切れがあると、読者満足度が高くならず

ガッカリさせてしまいます

同時にSEOも好ましくありません。

ブログの記事数が増えてくれば

リンクも増えてくるので

必須のプラグインです

このプラグインを導入することでリンク切れを

一括チェックをしてくれるので

監視がとても楽になります。

  1. リンク切れのチェック
  2. メールでリンク切れを通知してくれる機能
  3. リンクエラーに自動で装飾(打ち消し線など)を適用したり
  4. 検索エンジンがリンクエラーを認識しないようnofollowを付与したり
  5. サーバーの負担の制限もしてくれます

5つの機能があるので入れておきましょう。

Broken Link Checker 設定

wordPress管理画面→プラグイン→新規追加をクリックします。

プラグインの検索にBroken Link Checkerと入力します。

表示されたら今すぐインストールをクリックした後

有効化をクリックします。

有効化するとwordPress管理画面の下側に

Broken Link Checkerの項目が出てくるので確認してみてください。

リンクを貼り付けたばだとエラーは無いと思います。

wordPress管理画面からツール→リンクエラーを選択します。

リンクエラーの一覧画面で、表示されているエラーにマウスを合わせていくと

  • 「URLを編集」
  • 「リンク解除」
  • 「リンクエラーではない」
  • 「リンク切れから解除」
  • 「再確認」

の5つのメニューが表示されます。

5つのメニューから選択して修正していきましょう

 

revision control

リビジョンとは、Wordpressに標準搭載された

自動バックアップ機能のことです。

WordPressは投稿画面で記事を書いていると

作成途中で下書き保存してくれます。

何も設定をしていないと

リビジョンの数が

どんどん増えていきます

リビジョンは以前の状態に戻すことが

できるのでとても便利なんですが・・・

WordPressの初期設定では

リビジョンが無限に保存される状態になっています。

何回も保存更新しているとリビジョンが増えすぎてデータベースが肥大化

ブログの表示速度が遅くなりパフォーマンスに悪影響を及ぼします。

便利なんですが、厄介な機能がリビジョンです。

そんなリビジョンを、調整してくれるのがRevision Controlです。

Revision Controlを使えば好きな数に設定が

できますのでプラグインを入れておきましょう

Revision Control 設定

wordPress管理画面→プラグイン→新規追加をクリックします。

プラグインの検索にRevision Controlと入力して検索します。

検索表示されたら→今すぐインストール→有効化をクリックします。

有効化されたらwordPress管理画面の設定からリビジョンをクリックします。

リビジョンをクリックするとデフォルトの状態では

リビジョン最大保存数:無制限になっています。

お好きな数に変更してください。

自分は最大保存数:3に変更しました。

リビジョン保存数を変更したら

変更を保存をクリックします。

以上で設定は完了です

とても簡単です

ブログを立ち上げた初期にリビジョンを最適化しておきましょう。

画像 圧縮 プラグ イン

EWWW Image Optimizerとは、画像を劣化させることなく

アップロード時に自動で画像サイズを圧縮調整してくれるプラグインです。

画像のファイルサイズを小さくすることでサイトの表示速度が速くなり

ユーザーの離脱率も低くなります。

また、メタデータの削除もしてくれます。

メタデータとは、撮影場所やカメラ情報などを含む情報が記載されているデータのことです。

EWWW Image Optimizerを導入することで

  • 画像を軽くして
  • 表示速度を上げる
  • 個人情報保護

ができるので設定したいプラグインです

ewww image optimizer 設定

wordPress管理画面→プラグイン→新規追加→

プラグインの検索にEWWW Image Optimizerと入力して検索します。

表示されたら今すぐインストールをクリックして→有効化をクリックします。

wordPress管理画面の設定からEWWW Image Optimizerをクリックします。

設定するところは少なくほぼデフォルト値で大丈夫ですが

2カ所 確認してください。

 



ewww image optimizer 設定 基本タブ

基本タブは、メタデータを削除のみチェックを入れましょう。

てあとはデフォルト設定で大丈夫です。

メタデータとは、撮影場所やカメラ情報などを含む情報が

記載されているデータのことです。

ewww image optimizer 設定 変換タブ

変換タブは、変換リンクを非表示にチェックは入れておきましょう。

他の項目はデフォルトのままで大丈夫です。

変換リンクとは画像形式の変換を意図的あるいは

間違ってできないようにする設定です。

2か所確認が完了したら

変更を保存をクリックします。

jetpack Twitter 連携

JetPackは、WordPress公式の高機能プラグインです。

WordPress公式のプラグインですが

WordPressにプリインストールされていません。

高機能すぎて、使いこなせません・・・

JetPackは「WordPress.com」向けに提供されていた機能を

インストール型のWordPressでも使えるようにしたプラグインです。

WordPressでのサイト運営に必要な機能が揃っています。

管理画面も日本語に対応しているので

わかりやすいのでぜひ設定してみてください。

WordPressのアカウントには

  • サイトにログインするためのアカウント
  • WordPress.comが作ったサービスを使う

2種類アカウントがあります。

かなり迷うと思いますが

ツイッターと連携を考えている人はとても便利ですので

設定してみてください。

プラグインのインストール

ワードプレス管理画面を開いて

プラグイン→新規追加→プラグインの検索にjetpack-wpと入力して検索します。

表示されたら右上に表示されている「今すぐインストール」をクリックして

インストールされたら有効化をクリックします。

jetpack 設定

「jetpackを設定」をクリックしていきます。

WordPress.comで続ける Googleで続けると表示されるので選択。

どちらでも大丈夫です。

おススメ

WordPress.comで続けるをクリックするとサイトからのアカウント情報を持ってきてくれますので設定は簡単になります。

Googleで続けるをクリックしました。

途中でよくわからなくなったので一度無効化をして

再度「wordpressで続ける」をクリックしてみましたが

Googleのアカウントを使っていたので

結局どちらでも変わりませんでした。

Googleがわかりやすいんですが

自動で長いユーザー名が割り当てされます。

気になる人はWordpress.comで続けることをおススメします。

自動で作成されたユーザー名も後で変更できます。

注意

WordPressのアカウントは自分のサイトにログインするためのアカウント

今回作るアカウントはWordpress.comが作ったサービスを使うアカウント

別物になるのでご注意ください。

Googleアカウントでログインしていきます。

GoogleでログインするとGmailにメールが送られてくるので

メールを確認してクリックします。

送られてきたメールをクリックすると

Jetpackのプランの選択画面になります。

下にある

Jetpack Frer Start for freeをクリックしてください。

これでjetpackの設定ができました。

英語・・・

英語になっていた場合はFreeと書いてあるところをクリックします

 



Jetpack 共有

ワードプレスの管理画面に戻ります。

左上に→jetpackが表示されるので→設定をクリックします。

上のタブから共有を選択します。

共有→投稿をソーシャルネットワークに自動共有をスライドさせてオンにします。

ソーシャルメディアアカウントに接続するをクリックします。

WordPress.comのサイトに飛びます

英語表記になっていました

先に日本語化をしていきます。

 

WordPress.com 日本語 化

WordPress.comのサイト 右上にあるアイコンをクリックします。

アイコンをクリックすると画面が変わり

左側に歯車のマークをクリックします。

(日本語に変換後スクリーンショットなので日本語化されてます。)

下の方に Englishと書いてあるのでクリックします。

日本語に変更します。

日本語を選択した後 右下のSelect Languageをクリックします。

再度、WordPress.comサイト 

wordPress管理画面からjetpack→設定に行けば日本語化されています。

Jetpack 共有 ツイッター

jackpackでFacebook、Twitterなどの連携ができます。

ツイッターのみ連携させていきます。

投稿を共有したいメディアが出てくるのでツイッターを選択します。

ツイッターのアカウント設定画面が出てくるので

連携させるアカウントとパスワードを入力します。

1つしかない場合は自動で入力されています。

設定が完了するとツイッターアイコン下に

登録したアカウントが表示されます。

すべての管理者、編集者、作成者が利用できる

接続にチェックを入れます。

これで設定が完了しました。

twitter 投稿 テスト

JetpackがインストールされるとwordPress投稿画面の

右側にJetpackの緑マークが入っています。

jackpackの緑のマークをクリックすると

連携させたメディアが表示されています。

もし、jackpack緑のマークを押しても

ツイッター表示がされていない場合は、

連携がされていないのでもう一度

Jetpackの設定から→ソーシャルメディアアカウントに

接続するをクリックして

ツイッターを選択し直してみてください

 

Child Theme Configurator 

wordPressに新しいテーマを導入したけど

子テーマの作り方がいまいちわからない時は

プラグイン「Child Theme Configurator」を

導入すれば子テーマが簡単に作れてしまいます。

WordPressのテーマCocoonには

子テーマが用意されていたのでそれを使えば問題ないのですが

その他のテーマを選んだ場合は

子テーマが用意されていものもあります。

その場合、自分で子テーマを作成する必要があります。

調べてみると子テーマ作成に最低限必要なテーマファイルは

function.php と style.css の2つが必要で

これに親テーマ呼び出し用のコードなどを記載します。

初心者には、子テーマの作り方がよくわかりません・・・・

テーマに直接、追記や修正、カスタマイズをすることは可能なのですが

直接カスタマイズした場合は

テーマ更新によってすべて上書きされて消えてしまいます。

テーマは、脆弱性が発見されたり

、機能の追加や修正などでテーマの更新が行われます。

更新を行うことで新しい機能を追加したり

セキュリティの強化をします。

テーマ更新がいつ来るかわかりません

そのたびにカスタマイズし直すのは大変です。

プラグインをインストール

Child Theme Configurator をインストールします。

wordPressメニューから「プラグイン」→「新規追加」

右上の検索窓に「Child Theme Configurator」と入力します。

プラグインが表示されたら「今すぐインストール」→「有効化」をクリックします。

これでChild Theme Configuratorがインストールされました。

子テーマ 作成

ダッシュボード左側から「ツール」→「Child Theme」に進むと

Child Theme Configurator の設定画面が表示されます。

メニューの一番左のタブParent/ Childから

  • ①「Selectan action:」から一番上の
    CREATE a new Child Themeを選択します。
  • ②子テーマを作成したいテーマを選択します
    「Select a Parent Theme:」でテーマ名をクリックすると
    プルダウンメニューが開くので
    子テーマを作成したいテーマを選んで
    「Analyze」をクリックします。

子テーマが作成可能であれば

「This theme appears OK to use as a Child theme.」

と表示されるので、④以降の項目を設定していきます。

  • ④「Verify Child Theme directory:」は子テーマのファイル名になります
      変更しなくて大丈夫です
  • ⑤「Select where to save new styles:」は
    子テーマ用のスタイルシートを設定します
    「Primary Stylesheet (style.css) 」変更しなくて大丈夫です。

  • ⑥「Select Parent Theme stylesheet handling:」
      親テーマのスタイルシート呼び出し方法を設定します。
      ここは下手にいじると正しく表示されないので、一番上の
      「Use the WordPress style queue.」のままで大丈夫です。
  • ⑦「Customize the Child Theme Name, Description, Author, Version, etc.:」
      子テーマの詳細です。「Show/Hide Child Theme Attributes」
    をクリックすると子テーマの詳細が表示されます。
    ここもそのままで大丈夫です。
  • ⑧「Copy Menus, Widgets and other Customizer Settings
       from the Parent Theme to the Child Theme:」
      ここにチェックを入れると、親テーマで設定していたメニューや
      ウィジェット、カスタマイザーの内容を
    子テーマに引き継ぐことができますので
    チェックを入れましょう

⑨ 「Click to run the Configurator: の「Create New Child Theme
   をクリックして、子テーマを作成します。

子テーマ 作成方法

  • ①一番上のCREATE a new Child Themeを選択
  • ②子テーマを作成したいテーマを選択
  • ④ ⑤ は変更なし
  • ⑥一番上の「Use the WordPress style queue.」
    が選択されているか確認
  • ⑦は変更なし
  • ⑧チェックを入れる
  • 「Create New Child Theme」をクリックして
    子テーマを作成します。

php header footer

子テーマを作成すると

テーマファイル function.php と style.css の2つが

子テーマに追加されます。

後々 header.php と footer.phpが使えるように

タブから「files」を選択します。

「files」タブからheader.php と footer.php の2か所にチェックを入れます

2か所チェックを入れて

「Copy Selected to Child Theme」をクリックすると設定は完了です。

ダッシュボード左メニュー「外観」→「テーマ」から

作成した子テーマを確認し有効化しましょう。

 



redirection プラグ イン 使い方

ブログ記事をたくさん書いていくと、記事の書き直しや

記事の統廃合をした場合

Googleに登録されたページが「404 NOT FOUND」

表示になります

Googleに登録されているか確認方法はこちらから

Googleに登録されているページが「404 NOT FOUND」

ではページに興味を持ってくれた方が記事にたどり着けません

とても、もったいないので修正したページへのリンクに修正しましょう

これを「301リダイレクト」と言います

Redirection設定

Redirection をインストールします。

wordPressメニューから「プラグイン」→「新規追加」

右上の検索窓に「Redirection」と入力します。

プラグインが表示されたら「今すぐインストール」→「有効化」をクリックします。

ダッシュボード左側から「ツール」→「Redirection」に進むと

初期画面が出てくるので「セットアップ開始」をクリックします。

基本セットアップはチェックを入れなくてもOK

「セットアップを続行」をクリックします。

「セットアップ完了」をクリックします。

「完了」をクリックします

初めて開くと「オプションタブ」になっているので

「転送ルールタブ」をクリックします。

  • ソースURLには、検索表示された「404 NOT FOUND」
    ページを入力します
    相対URLと書いてありますが検索表示されたURLでも大丈夫です
  • ターゲットURLには、修正したページへのURLを入力します。

転送ルール追加をクリックすると設定は完了します。

モバイル対応記事について

  • Cocoonでは自動でモバイル対応記事を作成してくれます
    記事修正などした場合PC画面では301リダイレクトされますが
    Twitter連携させたページはそのままでは
    リダイレクトされず404が表示されます

    ドメイン○○.com/?p=○○&amp=1

    で修正すればモバイル対応記事にリダイレクトされます。

まとめっくす

実際wordPressに入れているプラグインです。

  • Contact form7
  • wp multibyte patch
  • Broken Link Checker
  • Revision Control
  • EWWW Image Optimizer
  • Jetpack
  • Child Theme Configurator
  • Redirection

たくさんありますが、入れておいて損はないです

Child Theme Configuratorは

子テーマが用意されていない

子テーマを作ることができない場合に使ってください

WordPressは、なるべく最小限のプラグインで

運用した方がいいです

厳選した8種類おすすめです

8種類の他にも

  • キャッシュ設定
    サイトページ速度が上がる
  • サイトマップ設定
    サイト管理しやすくなる
  • バックアップ設定
    大切なブログが守られます 

があれば安心です

ぜひ設定してみてください

最後まで読んでいただきありがとうございました

コメント

タイトルとURLをコピーしました