【ファイルの修正】【WordPress】テーマの自作を目指して その4

HTML
スポンサーリンク

こんにちは朱夏です。

今回も続きをやっていきます。

今回やることはこちら。

  1. リンクのパスを修正
  2. WordPress管理バーを追加する
  3. index.phpを分割

主に、ファイルをWordPress用に修正していく作業になります。

何故、修正が必要になって来るのかというと、WordPress上で呼び出したindex.phpは、CSSファイルや画像ファイルのリンク切れを起こしてしまうためです。
また、WordPress独自のタグを使用して、管理バーを追加したり、index.phpの中身をパーツごとにファイルに分けることで、パーツごとの管理が出来るようにします。

それでは、順番にやっていきましょう。


1.リンクのパスを修正

CSSや画像などのパスを修正します。
今回は画像を使用していないので、CSSのみリンクを修正します。

 2.WordPress管理用バーを追加する

WordPressの管理バーを表示するタグを追加します。
記載するのは、ヘッダー側とフッター側の2つがあります。

これを保存して表示すると、こんな感じになります。

 

3.index.phpを分割

index.phpは、ヘッダー、本体、サイドバー、フッターなど、いくつかのパーツに分割して管理することになります。
それぞれのパーツの入れ物となるPHPファイルを作成しておきます。

  • header.php
  • footer.php
  • sidebar.php

作成したPHPファイルに、index.phpから切り取って分けていきます。
それぞれのファイルの内容はこちら。

まず、header.phpは、</header>タグより上の部分です。

次に、footer.phpは、<footer.php>より下です。

sidebar.phpは、サイドバー部分にあたる<div>~</div>を入れます。

最後に、切り取って歯抜けになったindex.phpに、それぞれのパーツとつなぎ合わせるためのタグを追加します。

追加後の内容がこちら。


今回はWordPressで使用するために、ファイルの修正を行っていきました。
これで、自分のサイトからWordPressの管理画面を呼び出して操作できるようにするための準備ができたかと思います。

WordPress用のテンプレートを自作するという意味では、ようやくスタートラインかなと思います。
まだ投稿ページも固定ページも追加していかなければいけないですから。

それでは今回は以上です。

タイトルとURLをコピーしました