静的ページに部分的にWordPressを導入する方法【1.WPインストール編】

本ブログはアフィリエイト広告を利用しています

ブログ・サイト
ブログ・サイト
この記事は約4分で読めます。

とっちゃん@nyanco! です。

今回は静的ページ(HTML)で作られたwebページに部分的にCMS(WordPress)で「お知らせ」を導入する機会があったのでその備忘録です。

肉玉にゃんこ

今回はWordPressインストール編となりますにゃ~

ちなみにレンタルサーバーはKAGOYA(カゴヤ)サーバーでの作業となります。

既存の公開ページに手を加えていく場合、本記事を参考にする場合は自己責任の元、作業を行うようにしてください。また、作業前には必ず元のサイトのバックアップを取っておくことを推奨します。

スポンサーリンク

WordPressをインストール

フォルダを新規作成

まずはWordPressをインストールするディレクトリ(フォルダ)を作成します。

下記のようにwebページデータが格納されているフォルダの第一階層に新規フォルダを作成し、任意の名前をつけます。

フォルダ名などはサイトによって異なるので一例です

今回はWordPressのお知らせ(news)フォルダと分かるように「wp-news」としました。

WordPressをインストールする

今回はKAGOYAサーバーを利用していたので、コントロールパネルの「簡単インストール」機能からWordPressをインストールします。

上部メニュー「簡単インストール」>「CMS」>「WordPress」>「ver x.x.x」からインストールができます。
※バージョン数は時期によって異なります。

肉玉にゃんこ

他のレンタルサーバーでも「簡単インストール」機能は結構ありますにゃ~。
もちろん手動でインストールもアリですにゃ~

インストール先を先ほど新規作成した「wp-news」フォルダに指定して「インストール」をクリックします。

▼あっという間にインストールできました!

「アクセスするためのURL」「初期設定をするためのURL」をそれぞれブックマークしておくと後々便利です。

PHPバージョンが合わない場合の対処法

この時点で「アクセスするためのURL」または「初期設定をするためのURL」にアクセスすると以下のような画面になることがあります。

Your server is running PHP version 5.4.45 but WordPress 5.4.2 requires at least 5.6.20.
Google翻訳:サーバーはPHPバージョン5.4.45を実行していますが、WordPress5.4.2には少なくとも5.6.20が必要です。

要するに「PHPのバージョンが合わない」というメッセージですが、このような場合はディレクトリごとにPHPのバージョンを変更することができるのでそれで対処します。

▼下記記事で詳しく解説しています(カゴヤサーバーでの解説)。

WordPressデータベースの初期設定

続いて「初期設定をするためのURL」からWordPressのデータベースの初期設定を行う必要があります。

設定方法については▼下記サイト様の記事が参考になります。

WordPressの有名な5分間インストールについて
みなさん、こんにちは!ブリュの公式ブログ.netにお越しいただきまして、ありがとうございます。このサイトでは、ITについて特化したサイトを運営しています。今回は、WordPressの5分間インストールについて説明します。WordPressを

「WordPressアドレス」等を独自ドメインに変更

WordPressが無事にインストール完了し管理画面にログインできたら、独自ドメインを使用している場合(ほとんどそうだと思いますが)は「WordPressアドレス」と「サイトアドレス」の変更をしておきます。

今回は下記のように変更しました。

http://aaaaaaaa.kir.jp/bbbbbb/wp-news
↓
https://独自ドメイン/wp-news

「変更を保存」をクリックすると、下記のように「404エラー」の画面に変わって一瞬焦りますが…

落ち着いて「https://独自ドメイン/wp-news/wp-admin」というURLにアクセスし、WordPressの管理ログイン画面が表示され、ログインできたらOKです。

今回はここまでとします。

次回はWordPressカスタマイズ編として、静的ページを元にした独自テーマを作成していきます。

本記事がどなたかの参考になれば幸いです。

今回は以上となります。
最後まで読んでいただきましてありがとうございました!
それではまた〜✧٩(ˊωˋ*)و✧

コメント