2018.10.31

WordPress初心者向け 仕組みをざっくり解説

    一般の人向けはネットに記事がたくさんあるので、制作者向けの概要を書きます。
    ざっくりわかりやすさ重視で書くので、細かく言えば違うみたいな突っ込みどころは割愛していきます。

    使えるリンク集

    https://wpdocs.osdn.jp/(超必須 関数逆引きにも使えます)
    http://www.php-labo.net/(PHPについて)
    https://www.postgresql.jp/document/9.4/html/sql.html(MySQLのコマンド ぶっちゃけ無くても全然いけます)

    PHPとHTMLの違い

    いきなりWordpressではなくPHPの話ですが、一応、、、

    HTMLだけで構成されてるサイトは、ブラウザからそのままサイトとして表示できます。

    PHPで構成されているサイトはできません。
    ローカル上でPHPを利用しようと思うなら、PC上でPHPを動かすためのサービスを起動しなければなりません。
    これが巷で言われるWEBサーバーとかいうやつです。(厳密にはちがうのですが、、、)
    制作部ではXAMPPを入れてますが、こいつがWEBサーバーの機能を一つにまとめてくれる優れものというわけです。
    ※ぶっちゃけ、XAMPP起動したPCにIP割り当てて公開すれば、それだけでWEBサーバー完成です。(訳ありでやっちゃだめですが)

    なので、PHPで構成されているサイトをチェックする場合は、XAMPPを起動しておくか、テストサーバーにアップして確認しましょう。

    MYSQLとは

    データベースの一種です。
    EXCELというよりはACCESSです。PHPと連携できるACCESSと考えると早いかも。
    テキストや数値、変数なんかを各テーブルに保管しておいて、PHPで指定して呼び出すことができます。
    いわゆる「動的なWEBサイト」と言われるものは基本これです。(PHPとサーバーの連携だけでも色々できますが)
    (図)

    ここは実際に自分でPHPと連携させるページ一個作ったほうが理解が早いと思います。

    WordPressとは

    PHPで作られた、動的なサイトを作りやすくするWEBサイトのパッケージ、と考えていいです。
    個人的なものをテンプレートだけで作るなら、PHPやHTML、CSS、MYSQLなんかの知識はなくても
    管理画面だけで作れちゃうので、WEBサイト制作の経験がない人に重宝されています。

    ただ、WEBサイト制作者からも重宝されている理由は、PHPで一から作るとなかなか骨の折れる
    ブログサイト、比較サイト、SNS等々の動的なサイト
    で使いやすい関数が作られているからです。

    PHPとWordpress独自の関数をある程度覚えてしまえば、テーマ(Wordpressで簡単にWEBサイトがつくれるテンプレート)
    に頼らず自分の好きなデザインのサイトを作れます。

    また、自分の知識では追っつかないような機能を使いたい場合も、有志の人が作ったテンプレートを利用することで
    比較的簡単に実装できたりします。

    デメリットは、ちゃんと理解して使用しないと
    ・セキュリティ上穴だらけ
    ・修正やサイトが崩れた時にどこを見ればいいかわからない
    ・独自の関数と自分で作った変数がぶつかる
    なんかがありますが、ネット上だけでもナレッジがめっちゃたまってるので、根気よくやればなんとかなります。
    たぶん。

    WordPressの概要

    本題です。
    標準のパッケージインストールした状態では下記状態となっています。

    1.Dir構造と仕組み

    2.MySQLとの連携

    3.管理画面の各機能

    1.Dir構造と仕組み


    基本的にはthemes内しかいじりません。
    themes内では、普通のサイト作成と同じように編集可能です。(.htmlファイルは不可)
    Dirのリンク表記は少々特殊になり、
    1.画像リンクやファイルリンクは実際のDir階層
    例)ドメインURL/wp-contents/themes/img/sozai.jpg
    2.ページリンクは管理画面「設定>パーマリンク設定」を参考に
    例)ドメインURL/飛びたいページURL
    ※直接FTP等でアップしたページはwp-contents/themes/が省かれると思っておけば、基本的には大丈夫です。
    Wordpressから作成した記事等は作成した記事編集画面のパーマリンクを参考に。。。

    2.MySQLとの連携

    どのDBと連携するかは、Wordpressルートディレクトリに入っている「wp-config.php」で指示しています。
    連携するDBを変えたければここの記述を変えればOKです。(サイト引っ越しや、ローカル環境で動作検証等)

    ・MySQLと連携するメリットは?
    1.大規模サイトでも軽い
    ページ数が万を超えるサイトでも、テンプレートが同じならばページファイルは一つ、
    中のテキストだけMySQLに保管し、指定のIDで指定のテキストを表示させることができます。

    2.表示のさせ方を動的に制御可能
    たとえば、一つのテンプレートにテキスト

    普通のサイトをWordpressにするには?

    超ざっくりの超最低限手順です。
    ※用意するもの
    Wordpress環境
    htmlのWebサイト(phpでも可)

    ①phpファイル作成
    htmlファイルをphpにします。(拡張子変えるだけ)

    ②サイト共通化
    indexから共通部分を分解します。
    例)
    header.php → 各ページ共通のheader部分
    index.php → メインコンテンツ
    footer.php → 各ページ共通のfooter部分
    style.css → css

    ③テーマ作成
    style.css の最上部に下記記載
    /*
    Theme Name: kobamemo → テーマの名前です。なんでもよし
    Description: himatsubushi → 説明文です。なくでもよし
    */

    ④include記載
    indexのヘッダーがあった場所、footerがあった場所に下記記載


    ※phpの include と同じで、Wordpressの関数です。詳しくはリファレンスで

    ⑤テーマ適用
    管理画面に入り、「外観>テーマ」から③で作成したテーマを適用

    以上

    とはいえ、これだけだとincludeでヘッダー、フッターを共通化したくらいしかメリットないです。
    MySQLも全く使っていません。
    そのため、各ページの中身をWordpress関数に置き換え、MySQLとリンクさせたり
    ループ表示させたりして多機能にしていきます。

    —-随時更新します。なんかあれば聞いてくださいー—-

    Yoshiki Kobayashi
    Yoshiki Kobayashi

    ITインフラのエンジニア・コンサルタントを経た後、
    職種を変え動画クリエイターとWebエンジニアを兼業する。
    飽きっぽく、常に新しいことに取り組んでいないと落ち着かず
    現在はVR動画とAMPについて勉強中。
    東京から離れるために奮闘中。