• 赤色のリンクは、まだ日本語Codexに存在しないページ・画像です。英語版と併せてご覧ください。(詳細

このWikiはいつでも誰でも編集できます

「はじめての WordPress」の版間の差分

提供: WordPress Codex 日本語版
移動先: 案内検索
(WordPress サイトをカスタマイズする)
(WordPress サイトをカスタマイズする)
179行目: 179行目:
 
;[[#見た目をカスタマイズ|見映えをカスタマイズ]]: コードの中に突入する準備ができているなら、CSSとテーマの修正(もしくは自分のを作ってしまう)で見映えとレイアウトをカスタマイズできる。
 
;[[#見た目をカスタマイズ|見映えをカスタマイズ]]: コードの中に突入する準備ができているなら、CSSとテーマの修正(もしくは自分のを作ってしまう)で見映えとレイアウトをカスタマイズできる。
  
;[[#Wordpress プラグイン|プラグインでサイトの機能を高めよう]]: プラグインはサイトに機能を加え、ときに楽しませてくれる。サイドバーにある関連する記事に天気予報へのカスタムリンクを加えるようなプラグインが何百とあるんだ。
+
;[[#WordPress プラグイン|プラグインでサイトの機能を高めよう]]: プラグインはサイトに機能を加え、ときに楽しませてくれる。サイドバーにある関連する記事に天気予報へのカスタムリンクを加えるようなプラグインが何百とあるんだ。
  
  

2008年10月8日 (水) 03:07時点における版

このページ「はじめての WordPress」は 情報が古くなっている可能性があります。最新版英語)も合わせてご覧ください。最新に更新してくださる協力者を求めています

じゃ、次はなに?

WordPressの5分間インストールを楽々と終えた君。WordPressにはたくさんのステキな機能が詰まってるよ!じゃ、次はどうしよう?

それじゃ、これから君のサイトの中を一歩ずつ見て回って、いろんな機能がどんなふうに使えるかとか、どうやってWordPressのサイトを自分らしくカスタマイズするかとかを知ることにしよう!

このチュートリアルの最初の部分では、(チュートリアルの一部でない限りは)プログラムの内部のことには手をつけないでほしい。これから紹介する簡単なステップに従っていけば、そのうち君もいろんなものに手をつけられるようになるよ。

トップからはじめよう

まず、管理パネルにログインするところから始めるとしよう。ここが君のサイトの中枢部分。想像力を思いっきり爆発させて、才能あふれる文章を書いたり、最高にカッコいいWebサイトをデザインしたりする場所だ。そしてここから君のサイトを作っていくんだけど…まだここはほんの入り口だ。

管理パネルの中で、画面上部のメニューからView Site(サイト表示)を選んでみよう。どう、いい感じ?それともあんまり好きじゃないって…?まあどっちでもいいや、ちょっと眺めてみてよ。ここが、これからの数分間・数時間・数週間・数ヶ月間…君がたっぷり時間をすごすことになる場所だ。

WordPress サイトをテスト運転してみる

目の前にあるサイトをじっくり眺めてみよう。いろいろ手を加えたりぜんぶの使い方を理解したりするより前に、デフォルトのWordPressテーマがどんなふうに作られていて、どんなふうに動作するのかを知るのが大事だよ。まあ、これはいろいろな機能を付け加える前のテスト運営だと思ってみて。

ファイル:kubricktheme.png
WordPress Default Theme - Kubrick

今見ているレイアウトはTheme(テーマ)っていうんだ。これが、君のサイトの見た目を決めるんだ。WordPressの“デフォルト”テーマには、一番上に君のサイトのタイトルの背景となる青色の「header(ヘッダ)」がある。“クラシック”テーマには緑っぽいヘッダがある。そして横の方にはタイトルやリンクがあるね。これが「sidebar menu(サイドバーメニュー)」だよ。そしてメインの中央部分には「post(記事)」が、下のほうには「footer(フッタ)」がある。

まず、記事部分を見てみよう。タイトルがあって、その下にはちょっとした情報があるよね。これは、post meta data(記事メタデータ)っていって、作成された日付や時間、作成者、その記事のカテゴリーなど、その記事に関する情報が含まれている。

ページを下にスクロールすると、ページの一番下にある横長のセクションに注目してみよう。これがフッター。今のところここには"Powered by WordPress"って書いてあるね。

それじゃサイドバーに戻ろうか。情報がが書かれたいろんなセクションがあるよね。ここにはページカテゴリー、過去の記事のアーカイブ、カレンダー、そして日付なんかがあるはずだ。ここはメニューやナビゲーションパネルにあたるところで、みんなが君のサイトの中のいろんなカテゴリーや時系列別の記事を見て回るために使う部分だ。

細部がすべてだ

ページレイアウトやデザインのちょっとした細かい部分を、時間をかけてじっくり見てみよう。記事のタイトルの上をマウスオーバーしてみてごらん。色が変わるのが分かった?これはhover(ホバー)っていって、ほとんどのテーマではリンクの上をさわると区別できる色や何かの変化が現れるようになっている。サイドバーのリンクのどこかでマウスオーバーしてみて。何か変わった?さっきと同じ変化かな?ページ上の違う部分でリンクホバーを変化させてもいいけど、たいていは一貫して同じにしておくべきだ。それから、リンクの色も見てごらん。他のテキストより目立つように、どんな色が使われているかな?

こういうちょっとした部分や、ページのどこにそういったものがあるのかに注意を払うのは大事なことだ。そのうち、例えばページ上部の青色ボックス内のタイトルのリンク色のような細部に手をつけたくなるだろう。それがヘッダーって言う名前だって分かってたら、スタイルシート(ウェブページの見た目を調整するファイル)の中の header 部分に変更を加えればいいって分かるからね。

手早くひととおり見て回ろう

今のところトップページ(ホームページ)を見ると、記事がひとつだけあるだろう。そこで記事のタイトルをクリックすると、その記事の独立したページに行くことができる。最初に見る君のサイトのホームページには一番最近の記事が表示されるようになっていて、それぞれの記事のタイトルが個別記事ページにリンクされているんだ。single(個別)記事ページをホームページと違った見た目にデザインしてあるテーマもある。

WordPress Default Theme - Single Post Look

繰り返しになるけど、個別記事ページでもレイアウトをじっくり見てみて、今度はどういったところが違うかを探してみよう。ヘッダーは何か違う?サイズや色は?サイドバーはある?WordPressのデフォルトテーマでは、個別記事ページになるとサイドバーはなくなる。じっくり見て違いに注目してみよう。

投稿は普通、関連するトピックをひとつにまとめられるよう、カテゴリー内に入っている。今のところ君のサイトにはひとつしかカテゴリーがないけど、そのうちもっとたくさん欲しくなるはずだ。ホームページで、サイドバーにあるカテゴリーをくりっくしてみてごらん。そしたら、そのカテゴリー内の記事だけを表示するページに移動する。ここでも他のページと何が違うかよく見ておいてね。

Archives(アーカイブ)でも同じことをやってみよう。今のところひとつしか投稿がないかもしれないけど、ページのレイアウトを見てみてごらん。他のページと同じ?違っている?

WordPress 管理パネルをテスト運転してみる

ファイル:dashboard.jpg
WordPress Admin Dashboard
よし、君がサイトをどうやって見せて、様々なレイアウト・セクションがどうやって呼び出されるか想像できるようになったら、WordPressの管理をやってみようじゃないか。これは新しいWebサイトのダッシュボード〔訳注:管理画面〕に慣れるのと同じようなものだ。実際、君がログインしたあとに見るページは、ダッシュボードって言うんだよ。

ダッシュボードはWordPress1.5で新しい機能を持った。そのおかげで、君は常にたくさんのWordPressリソースからちょっとした面白い最新情報を入手できる。片隅には最近君のサイト上で行われたことのリストもあるよ。

管理画面のメインメニューにあるのは以下の通り:

上のリストのリンクから、管理画面が見せるすべての顔をステップ・バイ・ステップで解説してくれる一連の記事に行けるよ。今取り掛かるのが心配だっていうのなら、 ユーザーパネルから始めよう。

ユーザータブをクリックしよう。画面が切り替わって、プロフィールというパネルが見えるだろう。これで君は、君自身とサイトの投稿者・管理者 の情報にアクセスしたことになる。投稿者とユーザー という次のタブでは、もっとたくさんの投稿者を設定できる。 今のところは、君のことだけにこだわろう。君自身の情報を入力したら、プロフィール更新をクリックしよう。

それでは、WordPress管理画面の強力な機能を見てみよう。

サイトの見た目を手早く変更する

デザインパネルでは、テーマを使うことで、君のサイトの外見を変えることができる。テーマというのはスタイルの表現で、サイトの見栄えを完璧に変えることができる。WordPressのユーザーによってデザインされたテーマが何百とあって、君はそこから選ぶことができる。デザインパネルには、2つのテーマclassicとdefaultがあるだろう。この素早い切り替えのプロセスを見たかったら、Classicを選択して、どんな見栄えになったかを確かめるためにサイトを表示をクリックすればいい。ワオ、サイトの見栄えは変わったのに、見栄え以外に変わったものはない。実に簡単だね。

デザインパネルに戻って(ブラウザの戻るボタンでね)、以前のデザインに戻すためにdefaultを選択しよう。もう一度確認するために、サイトを表示をクリックすると、ほらね。正直言って、簡単だ。

投稿する・記事を管理する

管理画面に戻って、作成パネル、それから管理パネルを見てみよう。作成メニューの下にある投稿とページタブが使えるよ。管理メニュー配下のタブを使えば、君のサイトの投稿とページを管理できるんだ。

投稿を作成タブで最初のテスト投稿を作成することから始めよう。

もし画面が少しおっかなかったら、投稿を作成というCodex記事が投稿を作成するプロセスについてステップ・バイ・ステップで解説してくれるよ。その記事をちょっと読んでみて、最初のエントリーを投稿したら、次のステップに行こう。

もし急ぎなら、空っぽのタイトルと投稿ウィンドウにちょっとしたテストメッセージを入れればいい。これはテストだから、なんでもいいよ。それが済んだら、投稿の右にある公開をクリックして終わり。こうすると、空っぽの投稿画面が現れて、次の投稿ができるってわけだ。先に進もう。でも、3つから4つぐらいは投稿してくれよ。この前には、もっと面白いことがあるんだから。

それじゃあ、投稿作成の感じは掴めたから、画面の上にあるサイトを表示をクリックして、投稿を見てみよう。ほらね。これで本番に移る準備ができたってわけだ。

計画を立ててみよう

すべての良い計画は、良い計画に由来する。くどいように聞えるけど、ほんとだよ。もし良質できっちりしたサイトを作りたかったら、良質できっちりした計画が必要だ。それをやるのは大変だし、このエキサイティングなプログラムで何かと遊んでみたいというのはわかるけど、そろそろパソコンから離れて、古臭い紙とペンに戻る時だよ。そうだよ、人間が物事を書き留めていた時代に戻ろう。

ノートの切れ端(あるいは、そこら辺にあるもの)に君のサイトの詳細を記す時間が来た。5分から20分かけて、君のサイトの目的――もっと言うならミッション宣言――をはっきりさせよう。

次の質問に答えよ:

  1. 君はこのサイトでなにをしようとしているのか?
  2. 誰がこのサイトを見るのか?
  3. どんな種類の情報が投稿されるのか?
  4. なぜ君はこんなことをしているのか?
  5. 君は誰のためにこんなことをしているのか?
  6. 君はどれぐらいの頻度で投稿し、情報を追加するだろうか?

で、この情報をまとめると、このようになる:

このWebサイトはX、YそしてZのためにあり、

A、B、Cというトピックをカバーする。読者は

__________ ________________ _______である。私は

________ _______ ______________について_____________ごとに投稿する。

私がこんなことをするのは、_____________ _____________ __________________からである。


情報を使って

この情報から、たくさんの情報を集めることができる。たとえば、君のサイトをどうやってレイアウト・デザインした方がいいかという情報が得られる。もし君のサイトの読者が25歳以下の若者だけで構成されていることがわかっているなら、たぶん原色でエキセントリックなグラフィックとかダークなトーンのオシャレな外見が必要だろう。つまり、その世代に適切なものだ。もし、マジメな話題における事実に則った情報を提供しているのなら、たぶんポップでflashだらけではなく、もっと保守的な外見が必要だろう。

たぶん、君の中にはすでにデザインに関するアイデアがあるか、以前に君が運営していたサイトを踏襲するだろう。しかし、デザインを再考し、君のしたいことがWordPressのオプションでうまく行くようにするために、この情報をもう少し吟味してほしい。

君は自分のサイトにどんなカテゴリーがありえるかについても、気づいているだろう。君がカバーするトピックと主題は、君のサイトの目的にリストされているはずだ。ここで君の目的を宣言しよう。

"このWebサイトはパソコン、Webサイトとインターネットに関する情報を提供するためにあり、パソコンに関するTips、Webサイトデザインとインターネットニュースに関するトピックをカバーする。"

トピックがカテゴリーになる。君の目的をまとめたものの下にカテゴリーを書き、Webサイトデザインについて書きとめよう。

それでは、これらのトピックの下にはどんなサブカテゴリーが来るだろうか。パソコンTipsの下では、WindowsLinuxMacを区別したいだろう。もしくは、ソフトウェアハードウェアかもしれない。サブカテゴリーを作ることはできるけれども、とりあえず、その前に立ち止まろう。書き留めるんだ。

なぜ君はこんなことをするのか」という質問を思い出してほしい。というのも、君が共有するに値する有益でタイムリーな情報をもっているからであり、君が自分に興味のある主題について語りたがっているからであり、もしかしたら、ただ語ると面白いと思っているからだ。なぜ? みんなそうしているじゃないか!

君が自分のサイトで表現したいと思っている情報のタイムラインを理解することで、サイトの情報を整理することができる。君のサイトはいくつかの異なる方法で整理されている。もしページの成否を、君がいつ投稿したかという日付が左右するのなら、日付による投稿の参照によってリンクをつけることが重要だ。もし情報そのものが重要で、時系列は関係ないのだとしたら、投稿をカテゴリーによって参照させることが最良の選択になる。

君は自分のサイトをレイアウトしつつあるということに気付いているかい? 君が新しいWordPressサイトで最初にテスト投稿したことを覚えているなら、サイドバーメニューを調べてみよう。このエリアに、君の投稿が整理されている。もうちょっと見てみると(よし、ちょっとの間だけパソコンの前に戻ってもいいよ)、リストでレイアウトされたサイドバーが日付ごとのアーカイブ、カテゴリー分け、そしてもしかしたら、カレンダー機能(Defaultテーマでは無効だけれど、Classicテーマで表示される)で整理されていることがわかるだろう。

紙の上に君のサイトをレイアウトしたら、サイドバーにはカテゴリーと日付の両方がいるのか、もしくはそのどちらかでいいのか、検討してみよう。どんな情報があるのか、ユーザーが情報を見つけるためにどんな手段を提供するのか、ということが君のサイトデザインにとって決定的なんだ。

どんな情報をシェアしたいか

ユーザーが何の情報を知りたがっているのかについて考えたら、自分がどんな情報をユーザーと共有したいと思っているかについて考えよう。その情報に、君へのコンタクト方法、サイトの目的、君が誰で何の専門家なのか、ということが含まれていることで、君が誰かわかるようになる。

WordPress1.5はPagesという機能を持っていて、簡単な方法でこの情報を伝えることができる。この投稿に似ているページというものは、このサイトについてお問い合わせメーリングリストに参加、その他静的な情報に用いられるのが一般的だ。個別ページを作る前に、ページに持たせたい情報について考えてみる必要がある。それぞれのページにつけられそうなタイトルとネットで共有したい情報について書きとめてみよう。

コメント

WordPressの楽しみの一つに、君のサイトに読者がコメントを残せるという機能がある。これは君と読者の間にダイナミックな交流を作り出す。投稿にコメントがほしいかい? 投稿へのコメントは色んな形を取り、背中をポンと叩くグッジョブ! この投稿イイ!)ものから、長いチャットのような厖大な会話と注釈のようなものまである。もしくは、君は自分の投稿に情報を付け足してくれるコメントが欲しいのかもしれない。どんな風にコメントフォームを表現するか、それによってみんながコメントをするかどうか決まるんだ。

返事を書いたり、コメントの修正をしたり、コメントには多くの時間を割かれることもある。君のサイトにとってコメントが不可欠なら、コメントを導入して、どのように見せるかを考えよう。テストサイトに戻ってごらん、インストールの時に作った最初の投稿にサプルコメントがあるだろう。自分が作った投稿に幾つかコメントをしてみてもいい。それがどのようにレイアウトされているかを見て、自分のサイトのレイアウトやデザイン上でどんな風に見えるかを検討しよう。

コメントをどう扱うかということに関して腹をくくったら、時間をかけてコメントとWordPressディスカッション・オプションに関する記事 を読み、その機能を設定する一助としよう。

この基本的な情報があればもう充分。パソコンの前に戻って、サイトのレイアウトと設定を始めよう。

サイトの設定

サイトの見かけに入る前に、サイトをセットアップするためにもうちょっと管理をしよう。これらのカテゴリーを箇条書きにすることから始めようじゃないか。

カテゴリーの作成

管理 > カテゴリータブで、新規追加をクリックし、カテゴリーに関する情報を入力しよう。続けてリストの中にカテゴリーを加えるんだ。メインカテゴリーを入力し終えるまで、サブカテゴリーを入力するのは待ってくれ。

注意: 好きな時に好きな新規カテゴリーを加えることはできるけれども、WordPressではカテゴリーが二通りの方法―名前(アルファベット順)とID番号―でソートされるという事実に注意してくれ。カテゴリーを入力すると、IDが割り当てられる。これを変えるのは難しいから、アルファベット順に並んで欲しくないのなら、画面に表示してほしい順位入力しよう。
WordPressカテゴリー管理画面

親カテゴリーを入力し終えたら、サブカテゴリーを入力しよう。親カテゴリーのプルダウンメニューから、追加したサブカテゴリーのカテゴリーを選択できる。管理>カテゴリーパネルでカテゴリーを見ているのなら、こんなカテゴリーリストが見えるはずだ:

パソコンTips

- Windows
- Linux
- Mac

インターネットニュース
Webサイトデザイン

- Web標準
- WordPress
- - プラグイン
- - テーマ

カテゴリー内に記事を入れる

カテゴリーにテスト投稿を入れてみて、どんな風になるのか見てみよう。

WordPress管理画面 管理>投稿

管理 > カテゴリー パネルから、投稿タブをクリックしよう。ここには君の入力したテスト投稿があるはずだ。右側には表示 - 編集- 削除という三つのリンクがあるだろう〔訳注:2.5以降、編集は投稿名、削除はチェックボックス、表示はステータス欄をクリック〕。編集をクリックして、投稿の一つを編集しよう。投稿編集画面の右側〔訳注:2.5以降は下〕にカテゴリーがあるだろう。隣にあるチェックボックスをクリックして、選択しよう。それでは、ページをスクロールして、保存をクリック。他のテスト投稿でも同じことをして、それぞれを異なるカテゴリーに入れよう。

では、管理パネルの一番上にあるサイトを表示をクリックして、サイトを見てみよう。サイドバーにカテゴリーがリストされているのがわかるかい? よくできた。消えてしまったカテゴリーがあれば、大体はそこに属する投稿がないということだ。これはWordPressのデフォルト機能だから、心配しなくていい。消えたカテゴリーの中に投稿を加えれば、サイト上に表示されるようになる。カテゴリーの一つをクリックしてみると、そのカテゴリーのページへ行くだろう。そのカテゴリーに属する記事が見えるだろう。カテゴリーページが生成されたんだ。

よし、月名を表示しているアーカイブをクリックしよう。君が移動したページはこれまた自動生成されたもので、その月の投稿が時系列でリストされている―まあ、今日作った投稿だけだろうけれど―。ともかく、同じ情報を見つけるために、2つの方法があるわけだ。

スパム対策

サイトでコメントを許可したら、考えるべきことが増える。ついてないことだけれど、我々はスパムが生きた現実となった世界に生きている。コメントスパム取り扱い入門という役に立つ記事を読んで、コメント・スパマーと戦い始めることを勧めておこう。

次に

君は新しいWordPressサイトのための基本をすべて終えた。投稿の作成法もカテゴリーの作成法もカテゴリーやアーカイブを使ってサイトの情報を見る方法もわかった。これでカスタマイズに入ることができるけれど、それが終わったら、テスト投稿を削除することを忘れないように! それでは、新世界で共有する価値のある素晴らしい情報を書き始めよう!

WordPress サイトをカスタマイズする

WordPressがどうやって動くのかについてわかってきたら、クリエイティブなカスタマイズを始めてもいい頃だ。ここでチュートリアルは異なる主題に別れてくるから、何からとりかかってもいい。ここから君はやりたいようにやれるし、そうしたいのなら、足したり引いたり、完璧にしたり、しっちゃかめっちゃかにしたりもできる。サイトにどれぐらいの労力を傾けるべきかは君次第だ。インストール時から入っている2つのWordPressテーマを利用することもできるし、君のニーズにあった別のテーマを捜し求めることもできる。君の望みを叶えるために、すべてのリンクと情報をカスタマイズしたり、サイト全体を完璧にデザインしなおしてもいい。もう基本は知っているんだから、あとは君の想像力次第だよ。

WordPressテーマを探す
サイトの外見としてよりふさわしいと思うものを探そう。
見映えをカスタマイズ
コードの中に突入する準備ができているなら、CSSとテーマの修正(もしくは自分のを作ってしまう)で見映えとレイアウトをカスタマイズできる。
プラグインでサイトの機能を高めよう
プラグインはサイトに機能を加え、ときに楽しませてくれる。サイドバーにある関連する記事に天気予報へのカスタムリンクを加えるようなプラグインが何百とあるんだ。


WordPress テーマ

選ぶこととのできるWordPressテーマは何百とある。どれも基本的には同じことをするのだけれど、外見的にはそれぞれ異なったやり方で情報を伝えるんだ。読者と君のニーズに合っていて、君が面白いと感じるものを二、三選んだら、上にあったテスト運転の方法にしただがって、テストしてみよう。カテゴリー、アーカイブ、それからここの投稿という具合に、くまなくクリックして、テーマがその一つ一つをどうやって扱うのかを確かめよう。フロントページではよく見えても、個々の投稿ではあまり好ましくないというのだったら、コードの詳細を見て、変更を加えよう。心構えができていなかったら、別のテーマを試してみよう。

問題に直面したら、Codexのテーマ・トラブルシューティングの記事をチェックしてくれ。

見た目をカスタマイズ

もしCSS、HTML、さらにはPHPとMySQLに詳しいなら、自分がやりたいようにテーマをカスタマイズすることを検討してみよう。これは臆病者に向いたことではなく、知識と経験のある人向けだ。もしサイトデザインと開発スキルを伸ばしたいなら、WordPressはこんなお手伝いができる:

WordPress プラグイン

ファイル:pluginpanel.jpg
プラグイン・パネル
WordPressプラグインもアドオンや拡張として知られている。これは君のWebサイトに機能やイベントを追加するソフトウェアスクリプトだ。最新の天気予報から、単純な投稿とカテゴリーの整理まで、あらゆる領域をカバーするものがある。プラグインはボランティアの貢献者やチャレンジと問題解決の好きな熱心な人によって作られている。通常はWordPress管理画面から実にシンプルなインストールができるから、プラグイン作者の提供する支持に従うだけだ。忘れないでほしいのは、これらが自由であり、必要不可欠なものではないということだ。もしプラグインによって何らかの問題に直面したら、プラグイン作者のWebサイトかプラグインのソースに当たってみて、それから該当するプラグインに関するヘルプをネットで検索しよう。もしも解決方法が見つからなかったら、WordPressフォーラムでヘルプを探してみよう。

さらに一歩進んで

WordPressのエキサイティングなところは、ほとんど制限のないことだ。何千人がブログやWebサイト運営にWordPressを利用している。彼らのサイトのすべてが違った見かけと機能を持っている。

ここからなにをするかは君次第、でも基本を終えた最初の一歩で訪れるべき場所が幾つかある:

もっとヘルプが必要?

最新英語版: WordPress Codex » First Steps With WordPress最新版との差分