はじめる!WordPress入門

トップページの作成

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
ホームテンプレートを作成してトップページを完成させます。
講師:
08:03

字幕

このレッスンではトップページの作成 について学習します。 サイトの基本的なフレームのデザインが 完成しましたので コンテンツのメイン部分に 投稿の一覧を表示して トップページを完成させましょう。 エディターに移動します。 トップページを表示する index.php を開きます。 空っぽにしておいた main という ID の付いた div タグの中に 投稿の一覧を表示するための テンプレートタグを記述していきます。 投稿の一覧は メッセージポストで取得することができます。 if(have_posts) while(have_posts) the_post で取得をします。 先に終了部分の endwhile と endif も記述しておきましょう。 実際の投稿部分の表示ですが ここでは get_template_part を使って 外部ファイル化したパーツを 読み込むようにしたいと思います。 パーツの名前は post とします。 書けたら保存をして アップロードしておきます。 投稿を表示する部分を 外部ファイル化しておく理由ですが 後に投稿の詳細ページである single.php でも 同じパーツを再利用することができます。 ですので、その部分を 外部ファイル化しておけば コーディングの効率がアップします。 それでは post.php を 新たに作成しましょう。 テンプレートファイルは 一度にすべてを用意しようとせず このように必要になった時に 必要なものを追加していくように コーディングをしていくと 作業が混乱せず、効率的です。 それでは post.php に 投稿の詳細部分を記述していきます。 初めに the_ID を使って div タグに固定の ID を付けておきます。 それから post クラスを使って 投稿の内容を表示する、個別の CSS クラスを表示するようにしましょう。 post クラスはこのように パラメーターで CSS クラス名を指定すれば 指定したクラスも追加して表示してくれます。 最初に投稿日と投稿時間を 表示するようにします。 投稿日は the_date で取得できました。 投稿時間は the_time を使って 取得します。 最初にカテゴリー名を取得します。 投稿につけられたカテゴリーは the_category で取得することができます。 h2 タグで 投稿タイトルを表示します。 タイトルには the_parmalink を使って 投稿の詳細ページへの リンクを貼っておきましょう。 タイトルは the_title で取得できます。 投稿の本文を取得します。 the_content です。 本文の下にタグを表示してみましょう。 タグの取得は the_tag でできます。 the_tag の最初のパラメーターを指定すると タグの前にタイトルを表示することができます。 ここでは何も表示したくないので 「'」だけを入力しておきます。 2つ目のパラメーターを指定すると タグとタグの間を区切る 文字列を指定することができます。 ここでは CSS を使って タグとタグの間を空けたいと思うので 同じように「'」で 何も指定しません。 最後にパーマリンクやコメントへの リンクを表示する アクション部分を追加します。 link タグに the_permalink を指定して リンクを追加します。 区切るための棒を入力して コメント欄へのリンクを追加します。 コメント欄へのリンクは comments_link という テンプレートタグで取得できます。 コメントの横に実際に投稿された コメント数を表示するようにしましょう。 コメント数の表示は comments_number という テンプレートタグで 取得することができます。 comments_number には 最初のパラメーターで コメントが0件の時の表示を 2つ目のパラメーターで コメントが1件の時の表示を 3つ目のパラメーターで コメントが2件以上ある時の 表示を指定することができます。 「%」を指定しておけば 「%」の部分がコメント数に置き換わって 表示されます。 投稿一件分の記述ができました。 保存をしてアップロードしておきます。 それでは実際に画面で表示を 確認してみましょう。 サイトに移動します。 リロードをします。 投稿日・時間・カテゴリー・タイトル そして本文の後に タグ、パーマリンクと コメントへのリンクが表示されました。 まだ CSS を記述していないので デザインはめちゃくちゃですが 表示したい情報は ちゃんと表示できています。 このレッスンではトップページの 作成について学習しました。

はじめる!WordPress入門

ブログ作成ツールやCMSとしてもっともポピュラーなWordPressを使えば、ブログだけでなく一般的なサイトでも簡単に無料で作ることができます。このコースでは初めての方を対象にWordPressをインストールから実際のサイト構築まで丁寧に解説していきます。

7時間01分 (89 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
カテゴリー
ウェブデザイン
CMS
価格: 3,990
発売日:2014年01月14日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。