第10回 WPの本格導入
情報デザイン演習IIIA/2020｜情報デザイン専攻｜2020.11.19｜遠隔
情報共有シート｜プロジェクト一覧｜学科サイト
AGENDA
- 以下名簿が表示されます。ご自身の「出席欄」にチェックをつけて下さい。
情報共有シート - WordPress の本格導入に向けて、XXXXXについての概説を行います。
- 演習のテーマ「私のアナザースカイ」について、プロトタイプの修正を行うとともに、記事の執筆を進め、本日の成果報告を記載して下さい。
学科サイト（受講生一覧）
以下、LIVE動画をご覧下さい。記事に沿って解説しています。
解説動画は学科サイトの/限定ページに移動しました。
CONTENTS
レンタルサーバーに WordPress を導入
最近のレンタルサーバーではWordPress の自動インストールサービスをもつものが多くなりました。管理画面から「WordPressのインストール」のようなボタンを見つけてクリックするだけで、WordPress のパッケージが自動的にインストールされて、すぐに使える状態になります。
X-Freeサーバーでの開設事例
自動インストールされたWPの動作確認
- 閲覧
レンタルサーバー会社によって仕様は様々ですが、一般に以下のようなアドレスで、WordPressサイトにアクセスすることができます。http://xxxxx.starfree.jp/wordpress/ ← starfree の場合 http://xxxxx.wp.xdomain.jp/ ← x-free の場合
- 管理画面へのログイン
以下のようにアクセスすると、ログイン画面が出ます。
IDとパスワードで、管理画面（ダッシュボード）に入ることができます。http://xxxxx.starfree.jp/wordpress/wp-admin ← starfree の場合 http://xxxxx.wp.xdomain.jp/wp-admin ← x-free の場合
FTP接続
自動インストールとは言え、サイトをカスタマイズするには、レンタルサーバーに FTP接続を行って、ファイルのアップロードやダウンロードをする必要が生じます。レンタルサーバーの管理画面には、必ずFTP接続に関する情報がありますので（場合によってはFTP接続情報はメールで届きますので）、それを確認して、実際に、FileZilla 等のFTPクライアントで接続を試みて下さい。実際の構成ファイルがどこにあるのか確認することが必要です。
WordPress.com（無料サービス） との違い
プラグインが投入可能
様々な機能拡張が「プラグイン」として配布されています。独自サーバーにWordPress を導入した場合は、これを自由に利用することができます。
テーマのカスタマイズが可能
- 外観＞カスタマイズ＞「追加のCSS」から、部分的なスタイルの変更が可能です。既存のCSSを上書きする情報を追加する形になっています。
- 外観＞テーマエディタ から、直接テーマファイルを開いて編集することもできます。ただし、直接編集は、全体を破壊するリスクがあるので、通常は行いません。一般には「 子テーマ」という追加のファイルを作って、そこに変更するコードを投入します（後日説明）。
ユーザー管理等が可能
あなたのWPサイトに、編集者・投稿者として、他のメンバーを招待することができます。
テーマ（外観）について
テーマフォルダの場所を確認
テーマ、すなわちページの雛形となる構成ファイルは、テーマごとのフォルダにまとめられて、以下のディレクトリに存在しています。テーマのカスタマイズとは、これらのファイルを編集することを意味します。
[ wordpressのフォルダ ] / wp-content / themes / [ テーマ名のフォルダ ]
追加でテーマをインストールする場合や、テーマをカスタマイズする際は、サーバーにFTPアクセスして、wordpress フォルダの中にある wp-content/themes/ に直接ファイルをアップするなどの操作も必要になります。
おすすめのテーマ
いずれもライセンスGPLのオープンソースです。ダウンロードして解凍、上記の themes フォルダに投入するか、あるいは、ダッシュボードの外観設定から直接インストールも可能です。
- BOYO：https://blogonyourown.com/themes/
- Cocoon：https://wp-cocoon.com/
- Lightning：https://lightning.nagoya/ja/
学科サイトの更新｜次回授業前まで
プロジェクトページの整理
- 次回の「進捗報告」に備えて、プロジェクトページのヘッダー部分と概要を再整理して、発表しやすい形に整えておいて下さい。
- カテゴリーメニューの動作確認には複数の投稿が必要になります。とりあえずダミー投稿でも構わないので、サイトの全体像が一望できるよう、必要なページを作ると同時にメニューをサイトマップ通りに構成して下さい。
投稿と固定ページの役割について再確認
- 会社概要、交通アクセス・・など「常設」的な情報 ＞ 固定ページ
- 記事として随時投稿される情報 ＞ 投稿
- カテゴリーは「検索のための文字列」として存在します。例えば「カテゴリー：写真」というのは、「写真」という名前のページが実体として存在するわけではなく、「写真」というカテゴリーキーワードを持つ「投稿」を、データベースから回収・自動整列して、その場に表示しているだけです。
- 投稿記事にカテゴリーを追加する方法は、右図をご確認下さい。
Worklog
プロジェクトページの下の方、Worklog に以下の形式で報告を行って下さい。
**2020.11.19 ***私のアナザースカイ｜プロトタイプの修正 -◯◯◯◯◯◯ 、◯◯◯◯◯◯ -◯◯◯◯ -◯◯◯◯◯◯ ~ ***WordPress｜技術メモ （本日の演習のメモを残しましょう） ~
APPENDIX
次回は対面です。
次回、11月26日（木）は教室対面にて進捗報告を行っていただきます。
前回同様に受講生を前半・後半のグループに分けて行いますので。以下のシートで、事前に出校時間を確認しておいて下さい。
プロジェクト一覧
参考：ローカルサーバーに WordPress を導入
レンタルサーバーでは、WordPressのインストールが自動化されたものが多いのですが、自身のPC内に WordPress の動作環境を作るには、レンタルサーバーに手動でインストールする場合と同様の手間が必要になります。
- 0) 事前に、WordPress パッケージ本体を WordPress.org からダウンロード
- 1) Xampp を起動して、MySQLを起動、その後、phpMyAdmin などを使ってWordPress 用のデータベースを一つ作成する
- 2) WordPressのパッケージフォルダを ドキュメントルートに配置
htdocs/wordpress
- 3) WordPress にアクセス
http://localhost/wordpress
- 4) セットアッププロセスが開始されるので、順に必要な情報を入力
- データベース名、データベース利用者名、パスワード
- WordPress 利用者名、パスワード
- 5) 以上でセットアップ完了
- 6) 再びサイトにアクセス
http://localhost/wordpress
- 7) 管理画面にログイン
http://localhost/wordpress/wp-admin
と、ざっくり書きましたが、実際には結構面倒です。何回か経験すると、数分で完了する作業ですが、初めての作業は、かなりハードルが高くなる・・ということを知った上で、落ち着いて作業をしてみて下さい。失敗しても致命的なことになることはなく、何度も１からやり直せばいい・・と思って頑張って下さい。ローカルサーバーへの具体的なインストールの方法については、以下のページに記載しています。