wordpressでオリジナルテーマを作ってみよう⑨~個別ページの作成~

これからはトップページから記事タイトルをクリックして移動した先の個別ページの作成をしていきます。

まずsingle.phpというファイルを作成します。
中身はだいたいindex.phpと同じような構成で大丈夫です。

そしてindex.phpのときと同じようにヘッダーなどを読み込みたいので任意の位置で以下のタグを追加します。

ヘッダーを読み込む

サイドバーを読み込む

フッターを読み込む

以下のように作ってみました。

index.phpの時とは異なり上のような行を追加しています。
これは、次の記事へのリンク、前の記事へのリンクを出力するためのものです。

クラスを変えてやればindex.phpのものと異なるスタイルで編集することができます。
つまり作った直後はcssがリセットされた状態でした。
もともと

single.phpないのcssを編集して
h1,h2,h3,pの区別や
引用の部分を見やすくしました。
引用の部分のスタイルについては以下のサイトを参考にしました。
blockquoteタグをCSSだけで格好良いデザインにする【画像不要】 | おーとえすとさいと

一通りの作業後にこんな感じになりました。

コメントを残す