各VPSの設定

WordPressの利用法/設定/有用プラグイン/テーマ/開発法まとめ

Contents

WordPressとは&世界のWebサイトでのシェアとその価値

WordPressは世界で1番のシェアを占めるCGM(コンテンツマネジメント)の無料ソフトです。

機能をプラグインというもので手軽に拡張できるので、ブログやニュースサイトに使われるだけでなく、○○データベースみたいなサービスにも使われています。
VpsHikaku.comもWordPressをCGM部分については基盤として活用しています。

CGMだけでなく、Webサイト全体で見ても、その1/3以上がWordPressで作られているという調査結果が出ており、またそのシェアも伸び続けているので、WordPressを使う事はWebサイト運営を運営する(Web技術者になる)為の第一歩になります。

ここではWordPressを使えるようになる方法について
・サービスを利用する方法
・VPSのテンプレートを使って構築する方法
・自分でゼロからインストールする方法(公式のやり方とよりエンジニア向きのやり方)
について、説明させて頂きます。


利用開始方法1(初心者向): サービスを利用してWordPressを使う方法

こちらは基本そもそもサーバーへのターミナルログインが必要ない、WordPressの管理画面だけで完結するサービスになります。
初心者の方&サーバー管理は全くやる気がない方にお勧めです。
但し、ただの箱でない分、サービス提供会社毎にかなり特徴に差があるので、よく検討して選ぶ事をお勧めします。

Conoha Wing ドメインは全プラン無制限

共有型

1200円 200GB 2.5TB 60
2400円 300GB 3TB 80
4800円 400GB 3.5TB 100

リソース保証型

1500円 1GB 2 200GB 2.5TB 60
3000円 2GB 3 300GB 3TB 80
6000円 4GB 4 400GB 3.5TB 100

・時間課金なので気に入らなければ止める等色々やり易い
・共有サーバ課題解決するリソース保障型ある
・リソース保障型はオートスケール可能
・14日間の試用期間あり

COREPRESS Cloud
500円 3 10GB 150GB 1.5万 45万
1000円 6 20GB 300GB 3万 90万
2000円 12 40GB 600GB 6万 180万
4000円 24 80GB 1200GB 12万 360万
8000円 48 160GB 2400GB 24万 720万
16000円 96 320GB 4800GB 48万 1440万

・ステージングサーバーも提供
・アクセス増大時に自動スケールアウト
・WP自動アップデート対応
・訪問者数/月ベースで課金変わるので注意
・10日間の試用期間有り

Kagoya WordPress
440円 1 1 2 20GB
990円 1.5 1 2 40GB
2200円 2 1 2 60GB
4400円 4 2 4 100GB
9900円 8 4 8 200GB
30800円 16 8 16 300GB
52800円 32 16 32 500GB

・1契約1サイトである事に注意
・他社からのサーバー乗換安心お任せパック提供

WebARENA SuiteX 支払いは口座振替ではなく、クレジットで支払うものとする(クレジット支払いの方が月額支払い時安い&初期費用がスタンダードで0円になる)。

年払い(スタンダードはSSD量が月払いと異なる)

17967円
(月換算1497円)
0円 Web+メール1台相乗 300GB
59136円
(月換算4928円)
5500円 Web+メール別々 450GB
118272円
(月換算9856円)
5500円 Web+メール別々 500GB

月払い

3200円 0円 Web+メール1台相乗 300GB
4980円 5500円 Web+メール別々 450GB
9960円 5500円 Web+メール別々 500GB

・NTT系らしく回線速度が速い(1GB共有回線)
・データ転送料課金なし
・SLA(サービス稼働保証率)が100%で実績も実際高い
信頼度高いサービスを求めるのなら
・共有ファイヤーウォール有(ルールカスタマイズ不可)
・IPS(不正侵入防止システム)有

wpX Speed
1200 2 2 200GB 2.5TB
2400 3 4 300GB 3TB
4800 4 8 400GB 3.5TB
10000 5 12 500GB 4TB
30000 7 24 700GB 4.5TB
50000 10 38 1TB 5TB
80000 12 56 1TB 5.5TB

・NVMe高速SSD
・ドメイン:無制限
・RAID10
・1日1回バックアップ
・過去7日分保持
・オートスケール対応

上位サーバのスペックが大きい上に
オートスケール対応なので
負荷に対しかなり安心出来る


利用開始方法2(中級者向): WordPressのインストールテンプレートを用意しているVPS

使うサーバーのスペックを選んで、後はWordPressがインストールされた状態のサーバーとして起動する事を選ぶと、WordPressがインストールされた状態のVPSサーバが使えるサービスになります。

但し、自分で管理するVPSサーバーとして提供されてくるものなので、VPSサーバー自体の運用は自分でしていく必要が出てきます。

その代わり、簡単にWordPressを利用出来るという事と、WordPressに対する自由度の最大化と、サーバの独立性を兼ねれる選択になります。
逆に言えばWordPress本体の更新等も自分でやっていかなくてはいけませんが。

どのVPSが良いかは、VPS性能比較表お勧めVPS選択フローチャート、そしてそれぞれのVPSの特徴解説ページを見て決めて頂ければと。

AWS Lightsail WordPressアイコンをクリックしてインスタンス作成
ConoHa アプリケーションタブをクリックして「かんたんKUSANAGI」を選べば良い。但しメモリ1GB以上のインスタンでないと選べない
DigitalOcean MarketplaceタブをクリックしWordPressを選択。OSはUbuntuになる
Linode サーバを追加する時にOne ClickタブをクリックしてWordPressを選択
Vultr サーバを追加する時にApplicationタブをクリックしてWordPressを選択(OSはUbuntu)

利用開始方法3(上級者向): 自分で0からWordPressをインストール

前準備

  1. VPS選び
  2. OS設定
  3. Webサーバー設定(Apache等)
  4. PHP7.x
  5. データベース(MariaDB)

のインストールを済ましてからこの作業を行います。


WordPress運営の公式のマニュアルに従ったインストール

流れとしては、https://wordpress.org/download/からWordPressのソースファイルをダウンロードし、圧縮されたファイルを解凍し、必要な設定をしていく事になります。

そこからの詳しい手順については、公式の手順に従う場合には、こちらの外部文章をご参照下さい。


エンジニア向きのcomposerでバージョン管理しdockerで開発環境構築する方法

・composer(WP本体/Plugin/テーマの管理は全てcomposer経由でする)
・ローカルの開発環境はdockerで簡単に立ち上げられる
という構成として、テンプレレポジトリを
https://github.com/hikarine3/docker-bedrock-wordpress
で提供させて頂いております。

Composerの仕組みについてはhttps://roots.io/bedrock/をベースにしています。

肝はPHPのcomposerでWordpressの全ての更新を管理する事ですが、Dockerもセットになっているので、ローカルPCでの開発も手軽にする事ができる構成になっており、便利かと思います。

composerとdockerの使い方が分かる方はお試し下さい。


WordPressをインストールした後の設定

役立ちプラグインのインストール

https://wordpress.org/plugins/
から自分の用途に合いそうなプラグインを検索してインストールしていく事になります。
インストールしたら、Activateする事で使えるようになります。
プラグインによってはそこから更なる設定が必要になったりするので、Activateしたらそのプラグインの設定画面も確認してみましょう。

以下のプラグインはどのサービスにでも役立つ局面があるでしょう。


All In One SEO Pack

https://wordpress.org/plugins/all-in-one-seo-pack/
SEOの設定用。meta descriptionとかが設定できるようになります。


All-in-One WP Migration

https://wordpress.org/plugins/all-in-one-wp-migration/
WPのデータベースの中身の異なるドメイン等のサーバー間の移動に使えます。


Classic Editor

https://wordpress.org/plugins/classic-editor/
新エディターに慣れれない&整合性が維持できない&コードを簡単に直接書きたいという方向け
使う事も使わない事も出来るので、インストールして有効にしても問題ない。


Contact Form 7

https://ja.wordpress.org/plugins/contact-form-7/
フォーム機能を実現する定番プラグイン
スパム申込を避ける為、Contact > Integration > reCAPTCHAで、Site KeyとSecret Keyを設定して、スパム投稿防止対策をした方が良い


Contact Form 7 Redirection

https://ja.wordpress.org/plugins/contact-form-7/
Contact Form 7でフォームの申し込みボタンが押されたら別のページに遷移させるプラグイン。
成果の計測等に役立つ


Contact Form CFDB7

https://ja.wordpress.org/plugins/contact-form-cfdb7/
Contact Form 7経由で申し込まれたデータを、専用のテーブルに保存出来る。
そうでないとPost用テーブルに保存され、DBの中身としては滅茶苦茶になってしまうので。


CookieMonster

https://ja.wordpress.org/plugins/cookiemonster/
Cookieの値を埋め込めるようになる。
広告経由等でユーザを誘導した場合、この機能を使って経路情報をCookieに保存していた場合、この機能を使って成果と経路を結びつける事ができる。
上級者向けの機能


Disable Author Pages

https://wordpress.org/plugins/disable-author-pages/
ID漏れとかでセキュリティホールになり易いAuthor Pageの機能をオフにする。


Disable Comments

https://ja.wordpress.org/plugins/disable-comments/
コメントスパムとかばかりだしそもそも使わないしという事でコメント機能は止めたい、というケースに役立つ。


Disable Rest API

https://ja.wordpress.org/plugins/disable-json-api/
REST APIなんて使わないし、という場合に、セキュリティホールとなる可能性を消す為に、REST APIを無効にするプラグイン


Disable XML RPC

https://ja.wordpress.org/plugins/disable-xml-rpc/
XML RPCなんて使わないし、という場合に、セキュリティホールとなる可能性を消す為に、XML RPCを無効にするプラグイン


Duplicate Post

https://wordpress.org/plugins/duplicate-post/
ある記事をベースにに別の記事を作るのに使う


iThemes Security

https://wordpress.org/plugins/better-wp-security/
WordPressのセキュリティの底上げに使う


Newsletter

https://wordpress.org/plugins/newsletter/
メルマガ登録から発行にまで使える


Polylang

https://wordpress.org/plugins/polylang/
Wordpressの同じ記事について、別の言語に翻訳して管理する時に役立ちます。


Post Snippets

https://ja.wordpress.org/plugins/post-snippets/
「…….」
というHTMLコードを管理画面で登録する事で、
[code1]
と書くだけで埋め込むことが出来る。
同じ事を別ページで書く時に活用でき、HP作りの「部品化」の一助になる。


Schema

https://wordpress.org/plugins/schema/
検索エンジン用ページ内容構造化に使える


Shortpixel Image Optimiser

https://wordpress.org/plugins/shortpixel-image-optimiser/
アップロードする画像を最適化してくれ、ファイルサイズを小さくしてくれる


Show modified Date in admin lists

https://ja.wordpress.org/plugins/show-modified-date-in-admin-lists/
管理画面の投稿記事リストには作成日は表示されますが、更新日は表示されません。
このプラグインを入れる事で、更新日の追加表示を行う事ができます。


Simple Author Box

https://wordpress.org/plugins/simple-author-box/
各記事の下への著者情報掲載


Simple Header Footer HTML

https://wordpress.org/plugins/simple-header-footer-html/
全ページの開始(headタグ内)・終了部分(body閉じ前)に任意のコードを挿入できる


Simple History

https://wordpress.org/plugins/simple-history/
WordPress管理画面での操作履歴を記録し、内部監査等に役立てれる


SyntaxHighlighter Evolved

https://ja.wordpress.org/plugins/syntaxhighlighter/
プログラムのコードを行番号付きで表示できる。
他プラグインだと中身によっては適切に表示できなかったが、これは問題なかったので、このプラグインを選択


Table of Contents Plus

https://ja.wordpress.org/plugins/table-of-contents-plus/
Hタグから自動的にメニューリスト&ページ内移動リンクを作ってくれる


WP Mail SMTP

https://wordpress.org/plugins/wp-mail-smtp/
WordPressからのメールを、Gmail等のSMTPサーバ経由で送れるようになる。
WordPress自体のインスタンスからのメール送信は正常に作動しない事が多いので、便利なプラグイン


WP-Optimize

https://wordpress.org/plugins/wp-optimize/
WPを使っていると使われない余計なデータがDBに溜まっていったりするのですが、それを綺麗に一掃するのを助けてくれるプラグイン


WPS Hide Login

https://ja.wordpress.org/plugins/wps-hide-login/
WordPressの管理画面のログインページがデフォルトのままにしておくのは、自動的にアタックされ最大のセキュリティホールになりますが、ログインページのURLを任意のURLに変更する事が出来ます。


自分のサイトに合ったテーマのインストール

https://ja.wordpress.org/themes/
から自分に合うテーマを探して、インストール&カスタマイズ設定をします。

尚、上記公式サイト以外で配布しているテーマもありますが、そうしたものはテストの保障がされないので、基本的には手を出さず、上記公式サイトから見つかるテーマをご使用される事をお勧めします。

また、インストールした後に、使いたいテーマを選んでActivateする必要があります。


SEO用の最低限の設定

URLの形式

Settings > Pemalink > Common Settings

でURLのパスの形としては、Post nameを選ぶ。

Google Analyticsタグの設定

https://analytics.google.com/analytics/web/
からトラッキングコードをコピーして持ってきて、

Settings > Header Footer HTML

に行って(Simple Header Footerプラグインがインストールされている事前提)、Headerのどちらかにトラッキングコードを挿入する。


Settings > Generalで設定

・”Just another WordPress site”という値が入っているTaglineの内容は空にするか適切な値を入れる。
・TimezoneをUTC+0からUTC+9に変更する(日本の時間)
・Dateformatを2019-01-04の形式に変更
・Timeformatを6:42 AMの形式に変更
して保存


余計なページの削除

デフォルトでのサンプルページが出来ているので削除する。
PagesからはSample Page、PostsからはHello World!を選んで、Move to TrashをApplyで削除。


WordPressの機能の自力での拡張&便利な技法

WordPressはプラグインで機能を拡張できますが、機能不足の場合、本体やプラグインのソースを弄りたくなってしまうと思います。
但し、可能な限り、それは避けるべきです。
何故なら、自分が編集してしまった第三者のファイルは、第三者がアップデートした時に、それで上書きされる=それを避ける為に、自動アップデートは不可能になってしまう為です。

それよりはPost SnipetsやSimple Header Footerプラグインの設定画面にJavaScript(jQuery/Vue/React等)/CSSを書き、それで解決できる事はJSで解決させて、本体・プラグインのアップデート可を担保した方が良いでしょう。
そのJS自体は別途ソースコードとしてgitのレポジトリの中で管理して、更新したらコピペして管理画面から反映という方法は、かなり無難な運用かと思います。

例えばjQueryの場合

jQuery("$指定エレメント").html("書き換える中身");
jQuery("$指定エレメント").prepend("要素の前に加える中身");
jQuery("$指定エレメント").prepend("要素の後に加える中身");
// 消し去る
jQuery("$指定エレメント").remove();

を駆使する事で、テーマ元々のコードを触らなくても、自由自在に書き換える事が出来ます。

特定のURLだけで条件で処理を発動したい場合は

if(location.href.indexOf("/...../URL.html" >= 0)) {
// 処理
}

とif文で囲めば実現する事が出来ます。

ただ、結果、それなりのJavaScript寄りの技術の発揮を求められる事にはなりますが、アップデートの運用負荷等を考えると、PHPを直接触ってしまうよりかは、結果として楽な運用が出来るでしょう。