WordPressでサイトを作成するときの手順-最短編

WordPressのインストール WordPress

WordPressでWebサイトを作成するときの手順をこのページで完結できるよう説明します。XserverでWordpressのダウンロードからインストール、インストール後の設定、初期プラグイン設定などのやり方を順番に説明します。

サーバーでのデータベース作成

現在、当サイトSoricity | ソリシティで使用しているサーバーはXserver(エックスサーバー)です。このサイトではXserver画面でのインストール方法で説明していきます。

Xserverにログインした画面で「データベース」→「MySQL設定」を選択します。MySQL一覧画面が出ますので、MySQL追加して、MySQLユーザーを追加します。

この時のMySQLユーザーIDとパスワード、「MySQL●.● ホスト名」はのちほど使いますので、テキストエディタにコピペをしておいてください。

WordPressダウンロード

wordpressで検索をすると【日本語 — WordPress 「https://ja.wordpress.org/」】がすぐに出てきます。画面右下に「WordPress●.●.●をダウンロード」とあるのでクリックしてダウンロードします。

WordPressファイルを解凍して編集

解凍するとバージョン名フォルダの中に「wordpress」フォルダが作成されるので右クリック→名前を変更で好きな名前に短縮しましょう。画面ではwpとしています。

wp-config.phpの編集

解凍したwordpressフォルダの中にファイルが並んでいますが、この中の「wp-config-sample.php」というファイルを右クリック→名前を変更で「wp-config.php」にします。

名称変更ができたら実際にファイルの中身の編集に入ります。このサイトでは3点のポイントで説明します。

  • データベース情報
  • シークレットキー
  • おまじない

名称変更した「wp-config.php」ファイルを「Mery」などのテキストエディタで開きます。

データベース情報

中には下記のような場所があるのでそちらを作成したデータベースと合わせていきます。

// ** MySQL 設定 - この情報はホスティング先から入手してください。 ** //
/** WordPress のためのデータベース名 */
define('DB_NAME', 'database_name_here');

/** MySQL データベースのユーザー名 */
define('DB_USER', 'username_here');

/** MySQL データベースのパスワード */
define('DB_PASSWORD', 'password_here');

/** MySQL のホスト名 */
define('DB_HOST', 'localhost');

/** データベースのテーブルを作成する際のデータベースの文字セット */
define('DB_CHARSET', 'utf8');

/** データベースの照合順序 (ほとんどの場合変更する必要はありません) */
define('DB_COLLATE', '');

データベースを作成した際にデータベース名と、そのデータベースに紐づけた、データベースユーザーのユーザーIDとパスワード、「MySQL●.● ホスト名」をコピペします。

シークレットキー

下の方に下がっていきますと認証用ユニークキーという項目があります。オンラインでランダムの文字を作ってくれるページがありますので(オンラインジェネレータ)、そちらをコピーして、貼り付けて下さい。

リビジョン回数の制限をして、無駄を減らす

wp-config.phpの編集時におまじないみたいなものですが、以下を入れています。

/** リビジョン回数変更 */
define('WP_POST_REVISIONS', 3);

上記は、WordPressの投稿をしているときに、下書きなどの保存をするたびにバックアップを取るリビジョン機能に制限(3回)をかけています。

以上が終わりましたら、wp-config.phpの編集は完了です。保存をすること、UTF-8のBOMなし(UTF-8N)を忘れずにして下さい。

サーバーにアップロード

FileZillaを準備

FTPソフトでは扱いやすいフリー(無料)のソフト「FileZilla」を使用します。

アップロード

編集したwordpressフォルダを丸ごとアップロードします。

Xserverでアップロードする場所ですが、ルートフォルダにそのまま上げる場合は「 /ドメイン名/public_html/ 」に解凍したときの「wordpress」フォルダ(名前を変更している場合は変更した名前)の中身をすべてあげます。

WordPressインストールのやり方

アップロードが完了したら。インストール作業に入ります。ここではwordpressのIDとPassとメールアドレスを用意しておきます。

ブラウザでインストール画面へ移動

ドメインのルートフォルダにアップした場合はhttps://example.com/wp-admin/install.phpにアクセスします。(example.com部分を使用するドメインに変更してください)

idとパスワード

これからwordpressにログインするときのIDとパスワードを設定します。

パスワード作成(文字をランダムに抽出)
http://www.cityjp.com/javascript/etc/password.html

上記のようなサイトで強固なIDとパスワードを作ることをおススメします。

最近のバージョンではパスワードは自動で作成するプログラムが表示されるので、そちらを使用する場合は忘れずにメモをしてください。

メールアドレス

ドメインを取得していればメールアドレスが作れるようになっていると思いますので、そちらを使いましょう。

ブラウザ上での作業はこれで終わりです。正常にインストールできていると、メールが届いているので確認をしておきましょう。

WordPressインストール後の設定

ここではwordpressのインストールが出来た後に、セキュリティ面などを考えた初期設定のおすすめ情報を説明します。

wordpressのログイン画面は以下のURLになります。
ルートディレクトリにインストールした場合
https://example.com/wp-admin/wp-login.php
(example.com部分を使用するドメインに変更してください)

WordPressプラグインの初期設定

テーマによって有効なおススメプラグインが分かれますがおススメで使えるものを記述しておきます。

  1. Broken Link Checker
  2. Contact Form 7
  3. EWWW Image Optimizer
  4. Flamingo
  5. Google XML Sitemaps
  6. Jetpack by WordPress.com
  7. PubSubHubbub
  8. AddQuicktag
  9. Auto Post Thumbnai
  10. Invisible reCaptcha for WordPress
  11. Table of Contents Plus
  12. WordPress Popular Posts

テーマの選択

無料で使えるおススメのテーマを説明します。

function.phpの編集

テーマが決まったら、function.phpの編集をして自分の使いやすいようにカスタマイズをしていきます。

なおfunction.php編集をして記述を間違えると、WordPressが停止して真っ白画面になるなどのリスクがありますので、このタイミングで必ずバックアップを取ることを意識してください、

自動保存の間隔の調整

以前はwp-config.phpに記述をしていたのですが、インストール時にエラーを吐きましたのでfunction.phpに変更しました。

add_filter( 'block_editor_settings', 'custom_autosave_interval' ); function custom_autosave_interval( $editor_settings ) { $editor_settings['autosaveInterval'] = 300; return $editor_settings; }

WordPress:Gutenberg使用時の自動保存時間を変更する方法より

https://www.nxworld.net/wordpress/wp-gutenberg-custom-autosave-interval.html

Twitterアカウントの作成

wordpressと紐づけるTwitterアカウントの作成と紐づけの仕方を説明します。

Google アナリティクスの設定

アクセス解析として有能かつ無料で使えるGoogleアナリティクスをアカウント作成とコードの取得、wordpressへの設置を説明します。

Search Consoleの設定

検索用のgoogleロボットから自分のサイトがどのように見えているのか?問題はないか?を確認するためのSearch Consoleの設定方法を説明します。

xserver

使用サーバー

http://www.xserver.ne.jp/

”Jetpack Open Graph Tags”がテーマのOGPとぶつかってしまったときの対応方法

使用WordpressテーマのOGPを止める? OR ”Jetpack”のOGPが表示されないように対応する。
https://soricity.com/jetpack-ogp-duplication/