WordPress
静的ページを wordpress 化する
静的ページ（モック）を作成する
オリジナルテーマを作成
「/wp-content/themes/」の中に静的ページ（モック）を入れる
必要なファイル
・style.css
・index.php
を作成する
style.css
「style.css」は新規作成して下記を記述する
style.css
@charset "utf-8";
/*
Theme Name: ここにテーマ名（サイト名）
*/
index.php
「index.php」は
すでに静的ページで作成した「index.html」があるのでこのファイルの拡張子を「.php」に変更して「index.php」を作る
index.php
トップページの「index.html」を「index.pnp」に変更する
[外観] → [テーマ] で確認して該当のテーマを「有効化」にしたら、サイトを開く。
cssがあたるように修正する
index.php
では、CSSがあたらないので、wordpres のテーマのディレクトに静的ファイルを格納したのでディレクトリ構造が変わったのでパスを変更する。
index.php
↓
出力された文字列
↓
・「get_theme_file_uri」でテーマディレクトリへのパスを取得する
php
「<?php ?>」：この中にphpを書きますよーっていう宣言みたなもの
「echo」:PHPの言葉で「標準出力する」出力するってこと。htmlのコードしてココに出力しますよー ってこと
「get_theme_file_uri」：wpのテンプレートタグです 関数 wp専用のタグ wpでしか使えないタグ テーマディレクトリへのパスを取得
画像が表示されるように修正する
CSSと同じように出力用のテンプレートタグ「get_theme_file_uri」に変換する
index.php
↓
; ?>)
↓
出力された文字列
↓
ヘッダーを共有化する
「header.php」ファイルを作成して、共通箇所の「header」に該当する箇所をコピペで貼り付ける。
①「get_header(); 」タグで「header.php」を読み込む方法
②「include」で「head.php」を読み込む方法
get_header();
<?php get_header(); ?>
include
<!DOCTYPE html>
<html lang="ja">
<head>
<?php
$title = 'タイトル';
$description = 'ディスクプリション';
$is_home = true; //TOPページは「true」
include get_template_directory() . '/inc/head.php';
?>
<?php wp_head(); ?>
</head>
そしたら、「</head>」の直上に「<?php wp_head(); ?>」を記述します。これは必須です。
これがないと、プラグインが動かない、jQueryがうまく動かないといった原因になる。
フッターを共有化する
「footer.php」ファイルを作成して、共通箇所の「footer」に該当する箇所をコピペで貼り付ける。
①「get_footer(); 」タグで「footer.php」を読み込む方法
②「include」で「footer.php」を読み込む方法
get_header();
<?php get_footer(); ?>
include
<?php include get_template_directory() . '/inc/footer.php'; ?>