賢威で作るメインサイト2:トップページ設定

wp-logo2今回は、前回の「賢威で作るメインサイトⅠ:共通設定」に続いてトップページ関連の設定をします。賢威WordPress版導入マニュアルでは26ページ目に該当します。

WordPressはデザイン的にはトップページのデザインが投稿ページや一覧ページの全てに適用されます。このため、サイト全体の外観やデザインを決めるつもりで設定を進めてください。

設定に移る前に、賢威WordPressにはどんな種類のページがあるかを見てみましょう。この種類は標準のWordPressでもほとんど同じです。

先ずサイトにアクセスすると最初に表示されるのがトップページ。これはWordPressサイトの最上位のページでURLはドメイン名だけを含んだシンプルなものです。

王道サイトトップページのURLは「http://jnet-biz.com/」となっていますね。WordPress標準設定ではこのページ上に、投稿した最新記事の抜粋が何本か表示されます。

次は投稿した記事を表示するページです。投稿を続けているとこのページのボリュームがどんどん膨らんでいきます。その他、一覧ページというのがありそれは投稿した記事をカテゴリーや投稿月単位で表示する機能です。

そして最後に固定ページというのがあります。カテゴリーやトップページとの連動のない独立したページを作る機能で、お問い合わせページやプロフィールなどカテゴリーに属さないコンテンツを作るのに適しています。

更に固定ページはHTMLサイトのトップページのようにサイトの記事を系統的に表示する使い方もできます。この固定ページの機能があるため、WordPressはビジネスサイトとしてとても使いやすいものになっています。

例えばこの王道サイトのWordPressに関する記事はWordPressというカテゴリ-の一覧ページで表示できますが、投稿日順の表示なので、訪問者から見た利便性はイマイチです。

むしろ投稿日よりも運営者が内容順に並べ直したものをトップページに持ってきたり、この王道サイトのように「記事の一覧」という固定ページで表示した方がいいケースもたくさんあります。というわけで、王道サイトはトップページとして固定ページを使います

ダッシュボードからWordPressの「設定」 → 「表示設定」 → 「フロントページの表示」 から 「固定ページ」を選択する手順となりますが、これは固定ページを作ってからでないと動作しません。固定ページ作成後の処理となります。

さて、それでは初期設定を進めて行きます。

1. 賢威6.2 WPテンプレートの設定画面の解説(マニュアル26P~)

ダッシュボードから「賢威の設定」 → 「トップページ」へと進みます。

keni-manual

1. トップページのレイアウト

トップページだけカラム数を変えることができます。固定ページを使う場合は適用されません。

2. トップページのタイトル

ここは当面、「サイト内共通の設定」で設定したサイトのタイトル(ブログ名)のままでいいでしょう。空欄でOKです。タイトル含めヘッダー部のデザインはトップページだけでなく、投稿ページや一覧ページにも適用されます。

なお、サイトタイトルを図案化したロゴ画像、あるいは写真・イラストを貼り付けて差別化するのもいいでしょう。「賢威の設定」 → 「トップページの設定」 → 「メイン画像」に画像ファイルを指定します。

3. トップページのH1テキスト

H1テキストというのは、H1という種類の見出しを使って表示する文字列(言葉)のことです。

HTMLでもWordPressでも見出しは最上位のH1から最下位のH6まであり、通常H1には一番大きな文字を使い、そのページ内で最も重要な言葉であることをアピールします。検索エンジンもページ内のH1テキストを読み込んでそのページの内容を判断しようとします。

ページ上部のナビボタンから演習サイトを開いてみてください。サイトタイトルの直下「ネットビジネスを始めたい人、必見!」という部分がそうです。

通常はここにキーワードをいくつかちりばめてサイトをアピールする言葉を表示します。

ここで注意。今は「トップページの設定」なのでここで設定したテキストはトップページだけに有効です。圧倒的にページ数の多くなる投稿ページなどには反映されません。投稿ページでのH1見出しの使い方は別途解説します。

4. メイン画像のキャッチコピー 5.メイン画像 6.メイン画像ALTテキスト

トップページに画像を使うときに必要に応じて設定します。

次は導入マニュアルのトップページの設定(2)に移ります。

1. サブコンテンツエリアの表示

ここは共通設定で3カラムのレイアウトを選んだ時に関係します。トップページも3カラムにするなら「有効」をチェック。

・サイドバーエリアの表示 → 有効
・新着情報の表示・新着情報の表示件数 → 好みで選択
・2ページ目以降のインデックス → する

その他にも設定項目がありますが、WordPress初心者はまだ正しい判断ができないのでデフォルト設定のまま何もせず、項目を確認する程度で充分です。

2. フッターの設定(消去)

導入マニュアルではフッターの設定にも触れていますが、サイトのスタート時点ではまだまだ使い切れないので取りあえず丸ごと消してしまいましょう。記事数が増え余裕が出てきたら復活すればいいのです。

この処理にはPHPファイルを編集するテキストエディタが必要で、Windows標準添付の「メモ帳」でもいいのですが初心者には少し危険が伴います。

数あるエディタの中で無料の「Terapad」をお勧めします。PHPだけでなくHTML、CSSファイルなどプログラムの作成や編集に幅広く活躍している人気のエディタです。

参考リンク:プログラミングにも使える!TeraPadの使い方【初心者向け】

注意事項があります。PHPファイルはコンピュータを動かすプログラムの一種です。記述内容を少しでも間違えるとWordPressの画面が真っ白になった状態でロックしてしまい、途方に暮れることになります。

復旧は可能ですが簡単にはできません。PHPファイルを編集する際は、作業前に必ずコピーを取ることをお勧めします*。

※FileZillaなどのファイル転送ソフト(FTP)を使って、直前に編集していたPHPファイルを、コピー保存していたファイルでそっくり置き換える(上書きするか入れ替える)ことで復旧する場合が多いです。

こんなこともあり、FTPは日頃からあちこちいじって操作には充分慣れておきましょう。

さて、フッターの消去ですが下記サイトがわかり易いです。

参考リンク:賢威6.1からフッターをとりあえず消す方法(後ですぐ復活できます)

footer.php の編集が終わったら、画面左下の「ファイルの更新」をクリックして変更を保存します。次に画面左上のサイト名のところにマウスポインタを載せ「サイトを表示」をクリックします。フッターが消えスッキリとした画面になっているはずです。

さてこの後、賢威の導入マニュアルは次のように続きます。

・カテゴリー・タグ設定画面の解説(41P)
・ブログ記事投稿画面の解説(47P)
・固定ページ投稿画面の解説(54P)
・メニューの設定(60P)
・ウィジェットの設置(70P)
・リンク集の作成(74P)
・サイトマップの作成(78P)
・サイトマップXMLの作成(88P)

以上のように盛りだくさんの内容です。どれも最終的には必要なものですが、最初に一気に設定するのは大変です。

これらは当面ざっと目を通しておく程度でいいでしょう。ある程度サイト作りが進んでから設定しても全然問題ありません。

以上で「賢威」のWordPress版の導入は一通り完了しました。でも、この先はご自分で、と言われても困ってしまいますね。実際上、初心者にとってはこの先の独自のアレンジが結構大変なのです。

というわけで、この先王道サイトの解説としては演習サイトの制作過程をそっくりご紹介することにします(まあ、それほど大したものではありませんが。)

それがカスタマイズの参考になれば、あなたの好みに合った独自の商用サイトを効率的に作れるようになります。WordPressは最初がちょっと大変なんです。

それではまた次回、お会いしましょう。

サブコンテンツ

このページの先頭へ