WordPressのプラグインや設定

はじめに

WordPressの初期設定をした後、追加で使用したくなったプラグインや設定を逐次、記録しておく

各プラグイン

Font Awesome

メニュー文字の左側にアイコンをつけたくなったので、無料版でも種類の豊富なFont Awesomeを追加することにした。WordPress内にインストールせずとも利用できるのだが、プラグインの方がheaderを編集したりせずに楽に済みそうなのでプラグインをインストールすることにした。

(2020/5/12追記)Cocoonをいれると、もれなく付いてくる事を知らなかった。なのでCocoonを入れているならプラグインをインストールせずとも使える。

インストール方法

「プラグイン」「新規追加」からawesomeを検索して追加し、有効化する。設定はデフォルトのままでよさそうだ。

使い方

例えばメニューの横にアイコンを表示させたい場合、「外観」「メニュー」から「ナビゲーションラベル」に以下のようなタグを記載する。タグはfont awesomeのサイトで検索できる。

Cocoon

インストール方法

インストールについてはこちらを参照のこと。以下、目的に応じた変更方法について記載しておく。

hightlight.jsにて使う言語を指定

ソースがたまに意図しない配色になることがある。コードのプロパティを開いて、「ブロック」の「言語」を選択すれば固定される。

リストにない場合は「高度な設定」に直接クラスを指定すればよい。どのクラスがどのような表示になるかは、hightligt.jsのデモサイトで確認することができる。リストをカスタマイズする方法はcocoonのサイトに記載がある。

コンテンツをSSL化

通常はフロント側でhttpアクセスをすべてhttpsに変えてしまうのが楽なのだろうが、途中からSSL化した場合など、cocoon側でもいくつか修正が必要であった。

「その他」から「内部URLをSSL対応」をチェックする。

意図しない画像がhttpのままのようなので、クリアするかhttpsにする。

OGPタグにもhttpリンクがあるので、クリアするかhttpsでアップロードする。

本文にアイキャッチ画像を表示しない

「画像」タブから、「本文上にアイキャッチを表示する」のチェックを外して保存する。

AdSenceの登録申請時にコードを貼り付ける

申請時にコードを貼り付ける場所に迷ったので記載しておく。

まずは、AdSenseのコードをコピーする。

Cocoon設定の「アクセス解析・認証」のヘッド用コードに、先ほどコピーしたコードを貼り付け、保存する。

AdSense申請に戻って、「サイトにコードを貼り付けました」にチェックを付けて「完了」ボタンを押す。

通常はこれで完了となるはずなのだが、私はサイトをサブドメインで立ててしまっていたため完了とならなかった。

どうやらサブドメインでは登録できず、トップドメインを指定する(名前解決できる)必要がある。私はこの状態で何度もチェックボタンを押してしまい、以下のようなメッセージが出てしまった。

ちなみに、このあとコンテンツをトップドメインへ移行し、DNS変更も伝搬して、約24時間後に再びアクセスしたら、以下のように審査が開始されていた。よかった。

Contact Form

お問い合わせフォームを設置したく、検索上位に出てくるContact Formプラグインをインストールすることにした。

インストール方法

プラグインの新規追加より、以下のようにcontact formを検索し、「今すぐインストール」ボタンをクリックします。

数秒すると追加が終わるので、「有効化」ボタンをクリックします。

使い方

そのまま使えるサンプルが用意されているので利用します。1か所変更したいので、「編集」をクリックします。

「メール」タブから「送信先」を自分が受け取りたいメールアドレスを記入し「保存」をクリックします。

次に、作成したお問い合わせフォームの固定ページを作りますが、以下のコードをコピーしておきます。

ページを作成するため、メニューの「固定ページ」から「新規追加」をクリックします。

直前にコピーしていたコードを本文に貼り付けして保存します。

あとはこの作成した固定ページを表示させたいメニューやフッターなどにリンクを掲載すれば終わりです。

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