HTMLとCSSが問題なく出来るようになってきたのでPHPのコーディングを進めていたのですが、
エラーを連発してしまい、自分で解決出来なくなってしまいました。。
もう1度初めから、1個1個の過程を理解しながら進める為にもブログに記録していきます。
※ここでは作りたいページのHTML・CSSが完成しているところから進めます
#1.wordpressがどのように構成されているのか
HTML・CSS・PHPなどのファイルや画像フォルダ、データベースにはMySQLを利用している。
このファイルやフォルダ群とデーターベースの間で、データを取得し、データを返す、と言う作業を行っており、サーバーへ表示されている。
#2.wordpressのディレクトリ構成
wordpressをインストールしてみると、たくさんのフォルダやファイルが！
wp-content
wordpressのテーマやプラグイン、画像などのデータが入っているフォルダ。
オリジナルテーマ作り(私のような初心者)はこのフォルダ内で主に作業します。
※wp-contentの中のthemeフォルダにテーマが入っています。
このthemeフォルダ内にオリジナルテーマを配置していきます！
wp-admin
wordpressの管理画面に関するファイルなどのデータが入っているフォルダ
wp-includes
wordpressシステム全体に関するデータフォルダ
wp-config.php
wordpressの設定ファイル。
wp-login.php
ログイン画面に関するフォルダ
wp-load.php
動作に必要なプログラム類のフォルダ
index.php
サイトにアクセスされた時に最初に表示されるファイル
その他にもいろいろなファイルやフォルダがあります〜
#3.環境構築
①wordpressのインストール
②データベースのインストール
データベースMySQLを使えるようにするため、ローカル環境としてMAMPをインストールし、その上でwordpressをインストールしました。
そのほかにもLocalやXAMPP、Dockerなど、使用する方の環境（macなのかwindowsなのか）にあったものをインストールしてください。
データベースについてまた詳しく調べてまとめ次第、ブログに書こうと思います。
とりあえず今ここではオリジナルテーマ作成を進めていきましょう。
#4.テーマフォルダを作成
上記にもあるように
wordpress
∟wp-content
∟theme
このthemeフォルダの中にテーマフォルダを作っていきます。
ここではmario_themeとします(私の名前のテーマ！)
最小構成としてmario_themeフォルダ内には
①index.php
index.htmlをindex.phpにリネームすればOK
②style.css
index.htmlに対してのCSSファイル。
これはテーマフォルダの直下ではないといけないルールがあるそうです。
↓
そしてこのCSSファイル内にテーマについての記述をする
Theme name : テーマの名前(必須) ここではmario_themeとします
Theme URI : テーマのURI(URL)
Description : テーマの説明 例）オリジナルテーマ、など
Version : バージョン 初めは1.0でいいんじゃないんですかね
Author: 作った人の名前
Author URI: 作った人の URL
License: ライセンス
License URI: ライセンスの URL
などですが、全て記入しなくてもいい
/*
Theme name : mario_theme
Theme URL :
Description : オリジナルテーマ
Version : 1.0
*/
こんな感じでCSSファイルの一番上に挿入。
これでひとまずwordpress上にテーマとして表示出来るようになる…
といろいろなサイトで見かけましたが、私の場合はこれで出来ず、
ここで時間がかかったものです泣
このオリジナルテーマフォルダmario_themeを圧縮しなければいけなかったのです！
圧縮するって当たり前のことなんですかね？私は全然知らなかったです。
index.phpとstyle.cssがあればページは表示されますが、
テーマを選択する際に、どのテーマなのかわかりやすいように、
そのページのスクリーンショットをサムネイルとして表示させますので、
スクリーンショットをテーマフォルダに保存します。
この時、screenshot.pngとしておくと、自動的にテーマ選択時のサムネイル画像となります。
#5.wordpressの管理画面からオリジナルテーマをインストールする
管理画面(ダッシュボード)
↓
外観
↓
テーマ
↓
新規追加 or 新しいテーマを追加
↓
テーマのアップロード
↓
ファイルを選択
ここで圧縮したZIP形式のテーマファイルを選択
↓
いますぐアップロード
をするとこんな感じになります
もともと入っているテーマもありますが、アップロードしたオリジナルテーマmario_themeにカーソルを合わせると
”有効化”と言うボタンが出てくるので、クリックするとオリジナルテーマが適応されます。
これでHTMLとCSSで構成した内容と同じものが、ホーム画面として表示されるはずです。
##ちょっと番外編
管理画面から、とさらっと書きましたが、
私はその管理画面の出し方さえわからずググりました笑
むしろワイのwordpressのページはどこじゃ、状態でした。
https://bazubu.com/how-to-login-to-wordpress-22995.html
こちらを参考にしてみてください。
wordpressの構造を理解した今なので、
ログイン画面はホームのアドレスの後にwp-login.phpをつけることや、
管理画面はwp-adminだってことがわかりました。
バッチバチの初心者だと、本当にわからないことだらけです。
ちなみにスクリーンショットのやり方も知りませんでした笑
そんなこともわからない初心者の私ではありますが、
次の記事では具体的にファイルを作っていきます！！
参考にさせていただきましたのはこちら
https://webst8.com/blog/wordpress-theme-howto-make/
こちらとってもわかりやすいです。神様。。