2014/10/09【WordPress】基礎の基礎

こんにちわ、名前しか知らなかった「妖怪ウォッチ」、「ジバニャン」というキャラクターがいるという事を教えてもらい、その出生に愕然としたゆでです(´・ω・｀)つなにその設定～妖怪ウォッチのジバニャンが色々と切ない

そして妖怪ウォッチ早速見てみました…楽Cー(ΦωΦ)＜ゲラゲラポー♪ウォッチッチ♪

さてさて、WordPressはイマイチよくわからないとたまに聞かれるので、あくまで基本的な、基礎の基礎をまとめてみました！
※カスタム投稿タイプ・カスタムタクソノミーなどデフォルトでは用意ないものは説明しないです

ざっくりです(｀･ω･´)ゞ
ついでにおそばせながら「TOC+（Table of Contents Plus）」入れました（目次が表示されるヤツです）

WordPressとは

WordPress (ワードプレス) は、オープンソースのブログ／CMS プラットフォームです。セマンティック Web、コードやデザインの美しさ、Web 標準、ユーザビリティなどを意識して開発されており、無料でダウンロードして使うことができます。(公式より抜粋)

つまりは無料で使えるシステムツールです。
WordPress（WPと略させて頂きます）っていうシステムで管理画面からサイトが作れちゃいます。
サイト管理できちゃうシステムをCMSといいます。
WPは世界のCMSシェア1位ですのでわからない時はググればたくさん情報が出てきます。

ライセンスはGPL（GPLv2以降のライセンス）です。

基本的にWPはPHP+MySQL

下記セットで使用します

• WordPress本体（PHP）　※必須
• データベース（MySQL）　※必須
• プラグイン（PHP）　※任意
• テーマ（PHP）　※必須

MySQL以外は管理画面でバージョンの更新が可能（管理画面上からインストールしていないものは除く）ので、バージョンによる互換性やバージョンアップによるカスタマイズ消去などに気をつけてください。
気をつけてください。もう一度言います、気をつけてください(ΦωΦ)+

そして、WP本体のバージョンによるWP関数が非推奨になったりもあるので要注意。

WPで作成するサイトの基本ページ構成（概要）

• トップページ
• 一覧ページ
  　L　詳細ページ
• 固定ページ
• 検索結果ページ
• （404NotFoundページ）

各ページには表示されるphpの読み込みの順序があります。図解テンプレートファイル
例えばトップページの表示には「front-page.php　＞　home.php　＞　index.php」という順序があります。
（フロントページの表示が固定ページの場合は除く）
front-page.phpという名前のファイルがあればそれが表示され、なければ次はhome.phpという名前のファイルがあればそれが表示され、なければ次はindex.phpが表示され…と言った感じです。
テーマによって基本セットで入っているものは異なるので確認しましょう。

インストール方法

◆WP簡単インストールがある場合

やったことないので想像です←

おそらくボタンをプチッでおわるのでしょうか。いいですね。
DBの設置はどうなっているのでしょうか。階層変更とかどうなのでしょう。気になります(ΦωΦ)

◆WP簡単インストールがない場合

• サーバ要件確認
• WPを公式からダウンロード（zip）
• FTPツールにてサーバ上の置きたい場所に上記zipを解凍したファイルをアップロード
• php.iniの変更がある場合変更
  ( memory_limit > post_max_size > upload_max_filesize になるように注意）
• DB（データベース）設置（MySQL）

両方共上記まで終わったら、ブラウザ（ChromeやIEやFFやSafariなど）でインストールしたURLへアクセスし、表示される手順通りに設定して「次へ」「次へ」すればインストール完了

ログインしたらとりあえず設定

ログインできましたでしょうか。
インストールする時に設定したユーザIDとパスワード忘れた場合、下記で確認できます。

ユーザIDの確認

URLに「?author=1」をつければ作成者別アーカイブとして名前が表示されます（危険！あとで隠しましょう）

パスワードの確認

登録メールアドレスに送ってもらって確認してください。
※メアド間違ってたらもうもっかい登録しなおして下さい
（FTPツールにてwp-config.phpを削除すればブラウザのインストールからできます）

ログインできたらとりあえずWPの必要最低限の設定をします。

◆設定　＞　一般

• サイト名の設定はココ（インストール時に設定してますね）
• WordPress アドレス (URL)はわかる人でなければ変更してはだめです。泣きます。
• サイトアドレス (URL)は表示アドレスです。階層を変更する場合はこちらを変更しますが、それだけではないのでわからない人は不用意に変更しないように。

◆設定　＞　投稿設定

• 更新情報サービスにはpingをいれます（公式のping一覧）
  （注意 ： 「設定＞表示設定」の「検索エンジンがサイトをインデックスしないようにする」にチェックが入っていると設定できません。こちらを外してからの設定となります）

◆設定　＞　表示設定

• RSSで画像を追加したい場合以外はRSS/Atom フィードでの各投稿の表示を抜粋だけにする
• 検索エンジンでの表示はサイトがまだ未完成でインデックスさせたくない場合は「検索エンジンがサイトをインデックスしないようにする」にチェック

◆設定　＞　ディスカッション

• コメントとかの設定ができます。
  スパム防止や炎上防止のためにも、コメント表示させる方はコメント表示条件の「コメントの手動承認を必須にする」はチェック

◆設定　＞　メディア設定

• 「アップロードしたファイルを年月ベースのフォルダに整理」のチェックは外す（その方が無難）

◆設定　＞　パーマリンク設定

• ページのURL表示をどうするかの設定です。デフォルトは「/?p=123（投稿や固定ページのID）」となります。
  オススメはカスタム構造「/%category%/%post_id%/」ですが、使用するテーマやプラグインによっては、デフォルトでないと動作しないものもありますので注意。

テーマ

インストールしてのデフォルトのテーマはWPの最新テーマがセットされています。
※WP4.0の場合は下記テーマが入っている

• twentyfourteen　（4.0でインストール時に有効化されてるテーマ）
• twentythirteen
• twentytwelve

テーマとは、簡単に言うとサイト全体のデザインやレイアウト、各種表示方法のセットです

• テーマ毎基本セットのphpは異なる
  出力方法などカスタマイズした後、テーマを変更するとそのカスタマイズはついてこないので注意
• テーマによりオプション数が異なる
  「メニュー」や「テーマ設定」や「ヘッダー」などのオプションがテーマ毎異なります（後からカスタマイズして追加可能）
• 無料のテーマはウイルスに注意
  無料テーマはたくさんありますが、ウィルスを仕込まれてる事もあるので無料テーマ（特に海外の）は注意
• 子テーマもあるよ
  テーマには子テーマもあります

◆外観　＞　テーマ

テーマはここから変更したり新規にインストールしたりできます。
テーマによってサイトのレイアウトや見た目が大きく変わります。

◆外観　＞　ウィジェット

用意された場所（テーマにより異なる・カスタムして増やすのも可能）に「検索」とか「最新の投稿」とか用意されてる部品をドラッグアンドドロップで簡単に設置が可能。

◆外観　＞　テーマ編集

ここに有効化されているテーマのphpが表示されます。
（注意：phpですので、よくわからないひとは触っちゃダメです。リビジョン（投稿・固定ページにあるバージョン管理できる機能）とかで戻せないヤツです）
子テーマや他テーマもここから触れます。
どのテーマのどれを触っているか間違えないように注意。

投稿と固定ページの違い

「固定ページ」はそのページ単体で成立するページです。
「投稿ページ」は「カテゴリー」に紐づけてグループ化して使用します。

作成してあまり変更がないようなページなら「固定ページ」、
たくさん情報を増やしていくようなページなら「投稿ページ」で作成っていう感じでいいと思われます笑

など(´・ω・｀)ノ　
ちなみに

• 固定ページには子ページ（親子関係）を作ることができます
• 投稿ページはカテゴリー紐付けは必須です

さきほどの例はこんな感じで使えます

※投稿ページはデフォルトで「一覧（カテゴリー）ページ　＞　詳細（投稿）ページ」の表示形式となりますが固定ページはデフォルトで親も子も「固定ページ」の認識となり、単なる関係の紐付けとなりますので注意（リストとして出力する場合は紐付け通りの階層表示されます）

カテゴリー

上記で述べたように、「投稿ページ」はカテゴリーに紐づけて使います。
カテゴリーにはいくつでも投稿ページを紐付けることができます。

◆投稿　＞　カテゴリー

ここでカテゴリーを追加したり削除したり編集できます。
カテゴリーは「カテゴリー名（日本語OK）」＋「スラッグ（半角英数字！）」がセットです。
（注意：スラッグ名がかぶっていると自動的に「2」とかつきます。
使っちゃいけない予約スラッグ名もあります）

カテゴリー数はいくつでも増やせます。親子関係にもできます。
親カテゴリー＞子カテゴリー＞孫カテゴリー＞ひ孫カテゴリー＞ひひ孫・・と作成できます。

カテゴリーに紐づく投稿は下記のように一覧＞詳細が基本形式となります。

一覧ページ（カテゴリーに紐付いた一覧）
　L　詳細ページ（投稿ページ）

例えば　「今日のわんこ」「今日の料理」というカテゴリーがあるとします

投稿ページは編集画面で紐付けるカテゴリーをチェックして紐付けます

※間違えて「今日のわんこ」カテゴリーの投稿を「今日の料理」カテゴリーに紐付けた場合衝撃が走ります。

衝撃の走る例）　今日の料理　＞　チワワ（ショウ君　オス　1才）
(ﾟдﾟ)！

タグ

タグは投稿ページで設定できます。
カテゴリーに依存しない、フリーダムなヤツです。
そのページ内容のキーワードを設定するのが一般的です。

例えば　「WordPress」「EC CUBE」というカテゴリーがあるとします。
投稿AはWordPressカテゴリーに紐づく記事で、
投稿BはEC CUBEカテゴリーに紐づく記事とします。
A、B、両方共に内容に「SEO」とか「プラグイン」とか共通のキーワードがあるとして、それを「タグ」で設定すれば、タグクラウドとかでその「キーワード（タグ）」をクリックすると、カテゴリーの垣根を超えて投稿AもBも表示されます

カスタムフィールド

決められたパターンで入力したい場合に使います。

メタデータとして扱われ、「名前」＋「値」のセットとなります。
デフォルトで投稿ページ・固定ページ両方に用意された「カスタムフィールド」枠があります。カスタムフィールドの使い方

プラグインが楽でオススメです(*´ω｀*)

注意：カスタムフィールドを表示するには表示側に「表示させる」っていうのを書く必要があります。プラグインを使用する場合はそのプラグインに沿った表示方法で書きます

カスタム投稿・カスタムタクソノミー

テーマにもよってあったりしますが、WPのデフォルトテーマでの用意はないので、ここは飛ばします。とりあえず名前だけ馴染んでおいてください笑

とりあえずのプラグイン

とりあえず下記は入れておいて無難なプラグインです

• Akismet
  （標準装備プラグイン　スパム防止※Akismet登録が必要です。[有効→キー入力]）
• Attachment Pages Redirect
  （添付ファイルのattachment_id=xxxがエラーの時処理してくれます。[有効にするだけでOK]）
• Better Delete Revision
  （過去のリビジョンを削除してくれる※クライアントによってはリビジョンは必要なので、過去のをコレで一発削除してから納品がオススメ[有効→自由なタイミングで削除実行]）
• PuSHPress
  （googleに早くインデックスしてもらえる（感じ）[有効にするだけでOK]）
• PS Disable Auto Formatting
  （自動整形をもにょもにょしてくれる[有効にするだけでOK]）
• Stop Pinging Yourself for WordPress
  （自分のサイトの記事から自分の記事へのピンバックをさせない[有効にするだけでOK]）
• User Role Editor
  （ユーザ権限をもにょもにょできる[有効→権限を設定]）
• WP Multibyte Patch
  （標準装備　日本語（マルチバイト）をもにょもにょしてくれる[有効にするだけでOK]）

WPのバージョンによって使用プラグイン対応バージョンが異なったり、プラグイン同士での兼ね合いもあったりするので要注意です。
プラグインが長いことアップデートされていない場合は別を探すのも手です。
また、無料のプラグインの場合、こちらもウイルスに注意です。

とりあえずのセキュリティ

とりあえずログインだけでもセキュリティを強化しましょう。
あと、ユーザ名がばれないようにしておきましょう。

• simple Login LockDown
  （ログイン認証に複数失敗すると一定時間ロックが掛かってログインできなくする。管理者は失敗しないように注意。）
• Stealth Login Page
  （ログイン認証にパスコードを1つ増やします。（注意：有効化して未設定のままログアウトすると、ログイン時に画面まっしろになるから要注意！有効化したらすぐ設定してください））
• Edit Author Slug
  （ユーザ名丸見えを防ぐプラグイン。有効後、設定してくださいね）

とりあえずのエディター

エディターもバージョンアップしてどんどん変わりつづけておりますね…

• 「ビジュアル」　→　HTMLやCSSを理解して表示してくれる結果の画面（ブラウザ表示）
• 「テキスト」　→　HTMLソースの画面

注意　：　「ビジュアル」「テキスト」を行き来するとIDが取れたり空のspanが消えたり無駄なPが入ったり・・色々いたずらされたりします。その場合はぐぐれば直せます（省略）ので焦らないように

◆ビジュアル

改行について、「Enter」は「段落」、「Shift+Enter」は「行」の改行となるので注意です。

◆画像挿入

「メディアを追加」からできます。
サイズとかリンクとかチェックが必要です（添付ファイルの表示設定）です。
ギャラリーも作成して挿入できます。
画像の3サイズの設定は「設定＞メディア」で変更できます。
（注意：「大サイズ」を変更してもリサイズが反映しない場合、function.phpを確認すれば直ります（省略））

注意：ファイルのアップロードMAX値はphp.iniの設定によります

◆他

リンク入れたりテーブル入れたりyoutubeいれたりgooglemap入れたり、色いろできます。

とりあえず、使ってみてなんぼです。
使ってみて色々わかります。無料ですのでレッツトライです(｀･ω･´)ゞ！