LogoMark.png

WordPress の変更点


#author("2020-06-17T16:05:27+09:00","default:inoue.ko","inoue.ko")
#author("2020-06-17T16:09:43+09:00","default:inoue.ko","inoue.ko")
*WordPress
//[[Introduction>WordPress]] | [[Basics>WordPress/Basics]] | [[Plugins>WordPress/Plugins]] | [[Customize>WordPress/Customize]] | [[Backup>WordPress/Backup]] | [[Memo>WordPress/Memo]]
~

**はじめに
WordPress は近年最も注目度の高いオープンソースの[[CMS]]で、事実上の標準とも言える存在です。以下、2つの公式サイトがあります。

-http://ja.wordpress.com/   ← とりあえず、ブログサービスを利用
-http://ja.wordpress.org/ ← 本体をダウンロードしてインストール

-参考:WordPressの利用状況他
//--[[GoogleTrends: WordPress, Drupal, Joomla, Movable Type, XOOPS]]
--[[W3Techs Usage of content management systems for websites>http://w3techs.com/technologies/overview/content_management/all]]
--[[GoogleTrends: WordPress,MovableType,Joomla!,Drupal,XOOPS]]
--[[WordClip WordPress 事例集>http://www.wordclip.jp/]]


HTMLやCSSに関する専門的な知識がなくても、とりあえず始められる。と同時に、技術を段階的に身につけていけば、完全に自分の手でカスタマイズできる。あらゆるオープンソースに言えることですが、
・安くてほとんどだれでも手に入れられる
・小さな規模で応用できる
・人間の創造力を発揮させる
WordPressはその意味でも、非常に完成度の高いツールと言えます。
~

***CONTENTS
#contents2_1
~
~

**WordPress.com の体験

***とりあえず体験してみる
WordPress はブログ系のCMSなのですが、そもそもブログの編集自体経験がない方には、どんなものか見当がつなかい・・・そんな存在だと思います。
 そこで、まずは、アカウントをとるだけで WordPress が体験(もちろん同時に情報発信)できる wordpress.com の活用をおすすめします。まずは、ここで実際に投稿してみる・・・、またダッシュボード(管理画面)でできることを確認してみて下さい。
~

***WordPress アカウントの取得
必要なのはメールアドレスだけです。開設には5分もかかりません。
-[[WordPress.com に接続>http://ja.wordpress.com/]]
-WordPress.comでのアカウント作成手順は、以下をご覧下さい。
[[WordPress/Account]]

開設事例:https://opensquarejp.wordpress.com/
//誰もが高機能なWebサイトを持てる時代になっている・・ということです。
-WordPress.comでアカウントを作成 > [[WordPress/Account]]
-開設事例:https://opensquarejp.wordpress.com/
~
~

**WordPress をローカル環境で体験
''ローカルサーバーで動かす方法''(練習用・試験用)

WordPress は[[PHP]]で動くWebアプリケーションです。また記事はMySQLというデータベース管理ソフトによってサーバーに蓄積されるので、「ファイルをブラウザにドラッグして表示」といった、通常のHTMLファイルと同様の動作確認はできません。PHP と MySQL が動く環境を、すなわちローカルサーバー環境を、あなたのPC内に実現する必要があります。

大変面倒ではありますが、[[CMS]]の本格運用には、クライアントとサーバーの関係を理解し、さらに「[[PHPとは何なのか?>PHP]]」ということまで(ざっくりでいいので)知っておくことが必要です。
//本格的な自力運用には、この体験は必須のものとなります。

~

***XAMPP をインストール
ローカルサーバー環境を実現するためのソフトウエアパッケージに [[XAMPP>Google:XAMPP]] があります。[[オープンソース>OpenSource]]なので誰でも自由にダウンロードしてインストールすることができます。詳細を以下のページで解説していますので、まずはこれを準備して下さい。
-[[WebServer]]

~

***XAMPP のサービスを起動
アプリケーション > XAMPPマネージャーを起動して、以下のサービスを ''Runnning'' の状態にして下さい。
-Apache Web Server(PHPを含みます)
-MySQL Database
~

***XAMPP の動作確認
-ブラウザのURL欄に http://localhost と入力してアクセスして下さい。
-'''''I't Works! ''''' のように表示されていればOKをです。
~

***htdocs の確認
Webサーバーが配信するファイル(index.html 等)を設置する場所のことを''ドキュメント・ルート''と言います。XAMPP のドキュメントルートは、アプリケーション > XAMPP > ''htdocs'' で、そこに置いたファイルは、以下のようにアクセスすることで閲覧できます。
-htdocs 直下の index.html > http://localhost/ で閲覧可能
-htdocs 直下の sampleフォルダ  > http://localhost/sample/ で閲覧可能

WordPress はひとつのフォルダにまとめられたファイルセットとして提供されるので、ローカル環境で、WordPress を試す場合は、htdocs 以下にフォルダごと投入します。そして、閲覧アドレスは、以下のようになるのが普通です。
 http://localhost/wordpress/
~

***phpMyAdmin でデータベースの準備
WordPress は、記事情報を MySQL データベースに保存します。したがって、WordPress をインストールする前に、データベースを1つ、事前に準備する必要があります。この作業は、 ''phpMyAdmin'' というデータベース接続クライアントツールを用いて行います。以下、その手順です。
-ローカルサーバー上の以下のアドレスにアクセスして phpMyAdmin を起動
 http://localhost/phpmyadmin/
-ホームのメニュー左端の「データベース」をクリック
-''データベースを作成する'' の部分で、以下の設定で「作成」
--''データベース名:任意'' ← 半角英数で、わかりやすい名前を
--''照合順序:utf8-general-ci'' ← 日本語を使う場合はこれ
-左のツリー上に、あなたが作成したデータベース名が見えると思います。
-それをクリックすると、右のエリアに「このデータベースにはテーブルがありません。」というメッセージが出ているはずです。
-通常のデータベース利用では、ここで「テーブル名」を定めて新規のテーブル(表)を作成し、データの追加・修正・問い合わせを行うのですが、WordPress は、インストールの段階でテーブルを自動的に作成するとともに、問い合わせも自動なので、ここでは「データベースが1つできている」ということを確認するだけで充分です。
~

***WordPress 本体を htdocs へ
WordPressはその大半がPHPで記述されたプログラムファイルで、サーバー上に置いて動かす Webアプリケーションと言えます。入手したパッケージは、そのままサーバーのドキュメントルートに置くのが一般的です。
-WordPress.org から本体をダウンロードします。
https://ja.wordpress.org/
-解凍すると、wordpress フォルダができます
-htdocs へ wordpress フォルダをまるごと投入
&color(red){この時のフォルダ名 wordpress は、http://( URL )//wordpress/ のように、そのままアドレスに反映されます。これを違うものにしたい場合は、このタイミングでフォルダ名を変更しておくとよいでしょう。}:
~

***パーミッションの変更
PHPはプログラムなので、サーバー内でそれが動けるようにファイルやフォルダのパーミッションを変更することが必要です。乱暴ですが、ローカル環境の場合は、すべてに 777(ユーザーの制限なく、読み・書き・実行可能)を設定するとよいでしょう。

「パーミッションって何?」という方は  > [[FilePermission]]

Macの場合は、以下の手順で変更できます。
-htdocs 内に置かれた wordpress フォルダを選択
-右クリック > 情報を見る
-共有とアクセス権の部分で、すべてのユーザに対して「読み書き」を設定
-直下の設定ボタンから、「内包している項目に適用・・」
以上で、すべてのファイルが 777(なんでも可)になるので、とりあえず動かすことができるようになります。
~

***WordPress の初期設定
以上で下準備が整いました。次に WordPressを使うための初期化を行います。

#image(wp-install.jpg,right,30%)
-以下のアドレスにアクセスすると、右のような初期設定画面が表示されます。
 http://localhost/wordpress/ 

-はじめにデータベースの情報が求められます。以下のように入力します。
--データベース名:''作成したデータベースの名前''
--データベースのユーザ名:''root''
--データベースのパスワード:''なし(何も入力しない)''
&small(通常はユーザ名、パスワードを別途設定しますが、ここでは省略してデフォルトのままにしています。個人PC上での実験的利用なので、このままで問題ありません。);
--データベースのホスト名:''localhost''(そのままでOK)
--データベースの接頭辞:''wp_''(そのままでOK)

-次にWordPress の設定に関する情報入力が求められます。
--WordPress サイト名:''任意です''
--WordPress ユーザ名:''任意です''
--WordPress パスワード:''任意です''
--その他メールアドレス等

-以上で、インストール完了です。
~

***動作確認
-''閲覧''
以下にアクセスすると、サイトが初期状態で閲覧できます。
 http://localhost/wordpress/ 

-''管理画面へのログイン''
以下のようにアクセスすると、ログイン画面が出ます。
IDとパスワードで、管理画面(ダッシュボード)に入ることができます。
 http://localhost/wordpress/wp-login.php

-ここから先は [[WordPress/Basics]] をご覧下さい。
~
&aname(wp-install);
~



**WordPress をレンタルサーバーで実践運用
''レンタルサーバーに WordPress サイトを構築する手順''を説明します。

WordPress は[[PHP]]で動くWebアプリケーションです。また記事はMySQLというデータベース管理ソフトによってサーバーに蓄積されるので、レンタルサーバーを探す際は、以下の条件を満たすものを検討する必要があります。

-PHP(HyperText PreProcessor)が動くこと
-MySQLが使えるサーバーであること

ということで、以下をご参考下さい。

-[[Google:レンタルサーバー フリー WordPress]]
~

***開設事例
-http://opensquarejp.starfree.jp/wordpress/ 
--https://www.star.ne.jp/free/ (無料版入り口 php+MySQL を選択)
--https://www.star.ne.jp/manual/install_wp.php (手動インストール)
-http://opensquarejp.hotcom-web.com/wordpress/
--http://www.daiwa-hotcom.com/
~

***管理情報MEMOの準備
-WordPress サイトの管理には、接続名,ID,PW他、様々な情報の管理が必要で、これは頭で覚えられるものではありません。[[まずは、こちらのページを参考に、''サイト管理メモ''を用意して下さい。>WordPress/サイト管理メモ]]
~

***メールアカウントの確認
-サーバーアカウントの取得に、メールアドレスが必要になります。Gmail、Yahooメール等を持っている方はそれが使えます。卒業後も永続的に使用できるメールアドレスを使用して下さい。
~

***レンタルサーバーの選択
大学の学習用サーバーはPHPは動きますが、MySQLの利用ができません。よってレンタルサーバーを用意する必要があります。以下をご覧下さい。
-[[RentalServer]]
-[[Google:WordPress レンタルサーバー フリー]]

&color(red){''ご注意''};
-レンタルサーバーのアカウント取得時には、数回確認メールのやりとりが発生します。これを放置すると、有効期限切れとなってしまますので、すべて完了・・・となるまでは、メールのチェックを怠らないようにして下さい。
-サーバーからの確認メールが、迷惑メールとして処理されるケースがあります。確認メールが来ない・・という場合は、迷惑メールフォルダも確認してみてください。また、次回から通常のメールとして受信されるよう、「迷惑メールではない」を明示しておきましょう。
~

***サーバー設定
さて、ここからが本格的な作業になりますが、''最近のレンタルサーバーではWordPress の自動インストールサービスをもつものが多くなりました。管理画面から「WordPressのインストール」ができる場合は、それを指定するだけで準備されるので、この先の手順は不要となります。''
~

''以下は、手動でセットアップする場合の一般的な手順です。''
~

***データベースの準備
WordPress は、記事情報を MySQL データベースに保存します。したがって、WordPress をインストールする前に、お使いのサーバー上で、データベースを1つ、事前に準備する必要があります。

MySQLが使えるサーバーの場合、レンタルサーバーの管理画面で「データベース」の準備・管理が可能です。以下の情報が、WordPress インストール時に必要になるので、しっかりメモしておきましょう。
-データベース名:
-データベース・ユーザーID:
-データベース・ユーザーパスワード:
-データベースのホスト名:
-データベースの接頭辞:''wp_''(そのままでOK)
~

***phpMyAdminによる確認(任意)
&color(red){ここは読み飛ばしても構いません。};
WordPress の利用では、とりあえず1つのデータベースが存在すればよいので、上記のプロセス(管理画面からデータベースの作成)で準備OKですが、大半のレンタルサーバーが、phpMyAdmin を用意していて、直接的な管理もできるようになっています。
 どんなものか・・ということは知っておいた方がいいので、以下、簡単に確認手順を記載します。
-サーバー管理画面に用意された ''phpMyAdmin'' にアクセス
-データベース・ユーザーID と 同ユーザーパスワード が要求されます
-左のツリー上に、あなたが作成したデータベース名が見えると思います。
-それをクリックすると、右のエリアに「このデータベースにはテーブルがありません。」というメッセージが出ているはずです。
-通常のデータベース利用では、ここで「テーブル名」を定めて新規のテーブル(表)を作成し、データの追加・修正・問い合わせを行うのですが、WordPress は、インストールの段階でテーブルを自動的に作成するとともに、問い合わせも自動なので、ここでは「データベースが1つできている」ということだけ確認しておいて下さい。
~

***WordPress のインストール
-WordPress.org から本体をダウンロードします。
https://ja.wordpress.org/
-解凍すると、wordpress フォルダができます
-FTPクライアントを利用して、wordpress フォルダをまるごと投入
FTPについては[[こちらで解説しています。>FTP]]
&color(red){この時のフォルダ名 wordpress は、http://・・・/wordpress/ のように、そのままアドレスに反映されます。これを違うものにしたい場合は、このタイミングでフォルダ名を変更しておくとよいでしょう。}:
-パーミッションの変更
PHPはプログラムなので、サーバー内でそれが動けるように設定することが必要です(設定が不要なサーバーもあります)。この設定は、サーバーによって仕様が異なるので、管理画面、FAQ等を参照して自力で情報を見つけるしかありません。パーミッションとは?については [[こちらで解説しています。>FilePermission]]
~

***WordPress の初期設定
#image(wp-install.jpg,right,30%)
-以下にアクセスすると、右のような初期設定画面が表示されます。
 http://www.xxxx.com/wordpress/ 
xxxxの部分は、あなたのホームページのものが入ります。

-はじめにデータベースの情報が求められます。以下のように入力します。
--データベース名:''作成したデータベースの名前''
--データベースのユーザ名:''サーバーに登録したユーザ名''
--データベースのパスワード:''サーバーに登録したパスワード''
--データベースのホスト名:''MySQLホスト名''
--データベースの接頭辞:そのままでOK

-次にWordPress の設定に関する情報入力が求められます。
--WordPress サイト名:''任意です''
--WordPress ユーザ名:''任意です''
--WordPress パスワード:''任意です''
--その他メールアドレス等
-以上で、インストール完了です。
~

***動作確認
-''閲覧''
以下にアクセスすると、サイトが初期状態で閲覧できます。
 http://www.xxxx.com/wordpress / 

-''管理画面へのログイン''
以下のようにアクセスすると、ログイン画面が出ます。
IDとパスワードで、管理画面(ダッシュボード)に入ることができます。
 http://www.xxxx.com/wordpress/wp-login.php


-ここから先は [[WordPress/Basics]] をご覧下さい。
~
~

**DataBaseについて
-データベースは、基本的には1つのWPサイトにつき1つあるのが理想です。
CREATE DATABASE の権限がある場合は、WPサイトの作成ごとに新規のDBを作成する方が混乱がないでしょう。

-レンタルサーバー等の契約上DBが1つしか使えない場合も、複数のWPサイトを動かすことは可能です。1つのDBには、テーブル名さえ重複がなければ、いくつでもTABLEを作成することができます。DBを利用するCGIは、インストール時にTABLE名が重複しないよう、Database Table Prefix(テーブル名の先頭に文字を付けること)の指定が可能です。WordPressの場合、wp_ という文字列が付されます。同一サーバ上に複数のWordPressサイトをインストールしたい場合、Database Table Prefix をサイトごとに異なるものにすれば、DB自体はひとつでも構いません。
~



#aname(WP_SOURCE)
~

**WordPress の文書構造
WordPress が書き出すHTMLは、およそ以下のような構造になっています。
世界が認めた事実上の標準。ページの構造の典型として参考になります。

 <body>
 
     <div id="page">
     
         <header>
             <hgroup>
                 <h1 class="site-title">OpenSquareJP</h1>
                 <h2 class="site-description">Just another WordPress site</h2>
             </hgroup>
             <nav id="site-navigation">
                 <h3>Menu</h3>
                 <div class="nav-menu">
                     <ul>
                         <li class="current_page_item">****</li>
                         <li class="page_item page-item-1">****</li>
                         <li class="page_item page-item-2">****</li>
                     </ul>
                 </div>
             </nav>
         </header>
 
         <div id="main">
     
             <div id="primary">
                 <div id="content">
                     <article id="****">
                         <header class="entry-header">
                             <h1 class="entry-title">information</h1>
                         </header>
                         <div class="entry-content">
                             <p>****</p>
                             <p>****</p>
                         </div><
                         <footer>
                              ****
                         </footer>
                     </article>
                     <div id="comments">
                         ****
                     </div>    
                 </div>
             </div>
             <div id="secondary">
                 <aside id="*****">
                     ****
                 </aside>        
                 <aside id="*****">
                     ****
                 </aside>
             </div>
         </div>
     
         <footer>
             <div class="site-info">
                 ****
             </div>
         </footer>
         
     </div> 
 
     <script type='text/javascript' src='http://**** '></script>
     
 </body>
~
~
#hr

-https://design.kyusan-u.ac.jp/OpenSquareJP_WP/
// inoue.ko
-http://opensquarejp.wordpress.com/
// opensquarejp
-http://opensquarejp.starfree.jp/wordpress/ 
// inoue.ko
-http://opensquarejp.hotcom-web.com/wordpress/
// inoue.ko

// PWはいずれも共通
// sq/////
~
~