こんにちは。
もうインターンに参加させて頂いて早くも明日で最終日となります。
あっという間に毎日が過ぎています。
WordPressの利用には、WordPressのテーマを使用してサイトを作られる場合と自分でデザインしたサイトの一部にWordPressを埋め込みする場合があるかと思います。
本日は制作したサイトにWordPressの埋め込み作業に取り掛かりだしてます。
難しくなってきているので工程が大変でまだ途中までしかできていませんが少しずつ進めていってます。
WordPressのダウンロードや設定をした後の序盤の大きなポイントを少しお話しします。
必要なファイルを用意する
基本的に埋め込む時に必要なものは下記のファイルになります。
・index.php
（htmlでサイトを制作してphpに変更しました）
・style.css
（ファイル名は同じにしてindexと同じ階層へ）
・screenshot.jpg
（pngでもOK！ 大きさは880X660が推奨サイズ又は縦4：横3のサイズで小さくしてもOK）
・functions.php
（このファイルを入れておくとメディア追加のようにimgタグが入らないです）
テンプレートファイルに分ける
index.phpを部品ごとにパーツ分けします。
index.phpファイルが別のテンプレートを読み込み１ページとして表示してくれます。
パーツの分け方はデザインにより様々だと思います。
私は、【header】、【nav】 、【footer】に分けました。
・header
一番上から</head>の前まで切り取って新規のPHPファイルを作成。
header.phpファイルにしました。
新規で開けた時の元の記述は削除して貼り付けてます。
index.phpの元のあったところには読み込んでくるテンプレートタグを入れてます。
これを入れてないと読み込んでくれないので注意してくださいね。
<?php get_header(); ?>
・footer
footer部分から最後まで切り取って新規のPHPファイルを作成。
footer.phpファイルにしました。
新規で開けた時の元の記述は削除して貼り付けてます。
先ほどと同じくindex.phpの元のあったところには、読み込んでくるテンプレートタグを入れてます。
<?php get_footer(); ?>
・nav
</head>から </div><!–ここまでnav–>まで切り取って新規のPHPファイルを作成。
nav.phpファイルにしました。
こちらも新規で開けた時の元の記述は削除して貼り付けてます。
index.phpのnavの元のあったところには、読み込んでくるテンプレートタグを入れてます。
<?php get_template_part(‘nav’); ?>
※navは少し記述が異なります。
下記の3つのテンプレートタグはそれぞれ決まってるんですね。
<?php get_header(); ?>
<?php get_footer(); ?>
<?php get_sideber(); ?>
それ以外は(‘nav’)の様に中にPHPファイルの名前を入れるようになります。
相対パスを絶対パスに変更する
WordPressは全ての相対パスを絶対パスで書かないといけないので、変更が必要になってきま
す。
相対パスのものとして色々ありますが代表的なものが下記のようなタグがありますね。
<link>
<a>
<img>
<script>
phpでは自動で絶対パスを取得するコマンドがあるんです!!
これは嬉しいですよね♪
ただルールがあるので気を付けて下さいね。
・style.cssまでパスを取得してくれる
<?php echo get_stylesheet_uri(); ?>
・テーマフォルダーまでのパスを取得してくれる
<?php echo get_template_directory_uri(); ?>
※「/」は自分で入れないといけないので忘れないようにしてくださいね。
私は忘れてしまって「画像が出ない・・・」などなってしまいました。
随時サイトで確認しながらされると間違った時にすぐに気が付きやすいかもしれないですね。
このように少しずつPHPに変更をしていってから、メインのWordPressを埋め込みたいところを変更していくようになります。
デザインにより他にも変更が必要だったりしますのでサイトを制作して試していって身につけていく必要があると実感をします。
まだまだ工程はありますので本当に序盤だけの説明になってます。
本日は序盤のみのWordPressの埋め込みをしました。
ここまで読んでいただきましてありがとうございます。
WordPressの投稿や【index.php】で埋め込みたい部分の記述変更が必要になってきます。
記述間違いに気が付きにくいので慎重に進めていきたいと思います。
本日もありがとうございました!