こんにちは。
前回、前々回とサーバーを用意して自作(AI作)サイトを公開するっていうことをしました。HTMLを用意してアップロードする方法でしたが今回はノーコードでサイト作成するっていうことをやります。
ブログの方向性変わってる？あくまで目標はWEBアプリ・ゲーム開発です... (; ･`д･´)
wordpressっていうツールを使うのですが、webサイト作成ならコレっていうくらい有名ですよね。今更かと思われそうですが自分としてはいよいよって感じです。
ブログを始めたころにwordpressってワードを聞くようになって「ブログサイトで満足できなくなった猛者たちがカスタマイズ性を求めて移行していくところ」
ってイメージでした。実際そいういうパターンは多いようです。
ただ、サーバーを用意しなければならなかったりと初心者にとってはハードルもあって、自分には無理かなーと思っていたのですがサーバー用意まではしたからどうにかなるかな？
ってことで導入からwebページの編集画面を開くところまでやってみたいと思います。
※注意書き
とりあえず無料で実験的に使ってみるという企画なので独自ドメインの取得やSSL設定については省略しています。しっかりやりたい！という方は本記事の内容に加えそのあたりの導入が必要になります。
まず導入にはデータベースが必要らしいので作成します。
ここでいうデータベースというのはサーバー上に置く表形式のデータ格納場所みたいなものです。
このあたり(導入時に出てくる用語)も初心者のハードルっぽいですよね(;^ω^)
XREAのコントロールパネルからデータベース→データベースの新規作成
DB名とパスワード、文字コードを設定します。文字コードはデフォルトのUTF-8にしておきます。
入力したら下のデータベースを新規作成するボタンを押下。
作成できたらコントロールパネルのデータベース→作成したDB名選択
で接続情報が表示されるようになります。
これらの情報は後で使います。
データベースが用意できたので次にwordpressをインストールします。
XREAにはwordpressをインストールするためのメニューがあります。
XREAのコントロールパネルからサイト設定→サイト一覧からインストールするドメインを選択→下のほうにあるCMSインストールでwordpressを選択です。
公式のマニュアルがあるのでリンク貼っておきます。
https://help.xrea.com/manual/wp-install/
多くのレンタルサーバーにこのようなwordpressのインストール用メニューがあるようなのでインストールは難しくないでしょう。
ただ今回はXERAキャンペーンにより.shopアカウントにしかメニューを使った導入ができないようになっています。
1年間無料＝１年後に使えなくなる(自動更新ではない)なのであらかじめ.xreaのドメインに導入しておきたいです。
なので用意されたメニューを使わずにインストールを試みます。
手動手順なので他のサーバーでも専用メニューを使わない場合は同じ手順になると思います。
wordpress公式からダウンロードします。
ダウンロードしたデータをすべて公開ディレクトリ直下にアップロードします。
公開ディレクトリとはwebサイトとして公開するindex.htmlを置く場所で、xreaならpublic_htmlフォルダ。
(詳しくは前々回の記事をご参照ください。)
また、中のファイル数が多いのでwordpressフォルダに入れた状態で置くか、中身をそのまま置くかということになりますが、フォルダを置く場合はURLに影響しますのでご留意を(http://ドメイン/wordpress/となります)。
XREAの場合、ファイルを１つずつしかアップロードできないので圧縮ファイルのままアップロードしてサーバー上で展開します。
次にwp-config.phpを編集します。
ここでPHPの登場ですね(;^ω^)
しかしこの段階で特別な知識は必要ありません。
wp-config-sample.phpというのがあるのでこれを選択してファイルの編集画面を開きます。
以下の場所を探します。
/** The name of the database for WordPress */
define( 'DB_NAME', 'database_name_here' );/** Database username */
define( 'DB_USER', 'username_here' );/** Database password */
define( 'DB_PASSWORD', 'password_here' );/** Database hostname */
define( 'DB_HOST', 'localhost' );
〇〇_hereとなっている部分をデータベースを作成した後に確認した接続情報の内容に変えます。
次にセキュリティキーの箇所を探します。
define('AUTH_KEY', 'put your unique phrase here');
define('SECURE_AUTH_KEY', 'put your unique phrase here');
define('LOGGED_IN_KEY', 'put your unique phrase here');
define('NONCE_KEY', 'put your unique phrase here');
define('AUTH_SALT', 'put your unique phrase here');
define('SECURE_AUTH_SALT', 'put your unique phrase here');
define('LOGGED_IN_SALT', 'put your unique phrase here');
define('NONCE_SALT', 'put your unique phrase here');
上記のような場所があるので
https://api.wordpress.org/secret-key/1.1/salt/
にアクセスして表示されたものに置き換えます。
そしてファイル名をwp-config.phpに変えます。
ここまでできたらURLにアクセスします。
私はpublic_htmlにwordpressという名前でフォルダを作成したのでこうなります↓
http://icedtomatobazooka.s323.xrea.com/wordpress
するとインストール画面が表示されるのでタイトル、パスワードなどの情報を入力します。
下のWordPressをインストールボタンをクリックして完了です。
ダッシュボードが開かれました。ここでページを作っていくんですね(゜o゜)
次回以降にダッシュボードを開くときはページURLに/wp-adminを加えてアクセスするとダッシュボードを開けます。
左に表示されているメニューの「投稿」と「固定ページ」から編集するっぽいけど「投稿」はブログのような投稿を積み上げていくページで「固定ページ」はそうではない通常のwebページってことだと思います。
固定ページのほうをちょっと覗いてみます。
ふむ…インストールした時点でサンプルページってやつがすでに公開されている状態になっているようです。
サンプルページと書いてある付近にマウスカーソルを移動すると「編集」と文字がでてくるのでここをクリックした先でページを編集できるようですね。
サンプルの文字が打たれているのでここを編集したら文章を表示できますね。右側でアイキャッチ画像も設定できそうです。カーソルを文字のところに移動するとフォント設定などができるメニューがでてきます。
レイアウトとかを変える場合はやっぱりテーマの選択からでしょうか。
今回はここまでにしますが、なんとなくできそうな雰囲気は出てきましたね。
次回以降に編集をすこしだけやってみたいと思います。ありがとうございました。
背景はAI生成です。 WordPressのロゴが入っていて「これはよくないのでは…」と思ったので誤魔化しておきました。
