こんにちは。fsです。
WordPressテーマ開発シリーズの続きです。
今回はブログページを完成させていきます。
仕上がりはこんなイメージです。
画面右上にブログ名とトップページリンク、画面中央にもブログ名とキャッチフレーズを表示できるようにしていきます。
前回同様にコードを共有しながら進めていきますので、初心者の方も安心して読み進めていただければと思います。
それではご覧ください。
ブログサイトの仕上げ
それでは仕上げをやっていきましょう。
トップページ中央の表示
トップページ中央はまだデフォルトの表示画面なので、これを実際のものに変えていきます。
WordPressでは設定画面で
- サイトのタイトル
- キャッチフレーズ
を選択できます。
この2つを変更・保存します。
続いて、トップページ用のファイル（index.php）にタイトルとキャッチフレーズを記載していきましょう。
ブログの情報を表示させるbloginfoというテンプレートタグを使い、管理画面上で変更したタイトルとキャッチフレーズを引っ張ってきます。
画面を更新すると、タイトルとキャッチフレーズが変わりました。
トップページ左上のホームリンクの作成
続いてトップページ左上のタイトルも同じようにブログ名に変えていきます。
このファイルはincludesフォルダ内のheader.phpです。
同じ要領で書いていきます。
※リンクは前回やったようにエスケープ処理を使い、トップページに飛ぶように直していきます。
再読み込みするとちゃんと切り替わっています。
フッターの修正
最後にフッター部分を仕上げていきましょう。
まずはコピーライト。
自分がこのウェブサイトの著作権を所持していることを明示するために名前を記載します。
※名前の後にブログの制作年も忘れず入れましょう
あとはSNSのアカウントを持っている方は自分のアカウントをリンクタグ（aタグ）に貼り付けて完了です。
ページを更新して確認しましょう。
これでブログサイトが完了です。
まとめ プログラミングの基礎知識だけで制作可能
いかがだったでしょうか。
WordPressブログサイトを作るのに必要な知識は
- html基礎
- CSS基礎
- Bootstrap基礎
- PHP基礎
の4つです。
どれもドットイントールやprogateで簡単かつ無料で学べます。
これらの基礎知識だけあれば、あとはCodexでテンプレートタグの使い方を調べながらコードを書いていくだけです。
（リンクやメニューなどのつくりかたはネットで簡単に調べられます）
慣れないうちは少し難しく感じますが、覚えることは少ないのでぜひ手を動かしながら制作を楽しんでいただければと思います。
以上、少しでも参考になれば幸いです。
最後までお読みいただきありがとうございました。
MacBookでプログラムを書こう！
コメント