WordPressまとめ｜WP化【自分用】

manami

こんにちは、田中真奈美（ @momo29_aus ）です。

この記事はTwitterなど見かけた有識者の知識や、職業訓練校で学んだことなどをまとめた「WordPress化」についての自分用メモです。

index.htmlを3つのファイルに分ける
style.cssを編集する
functions.phpをつくる
WP_head()、WP_fooer()を追記する
読み込みファイルのパスを変える
themeフォルダにUP

index.htmlを3つのファイルに分ける

（ header / footer / ※sidebarがあれば）

index.htmlはindex.phpに拡張子を変える
index.phpの上部にheaderを読み込む関数get_headerを、
index.php下部にfooterを読み込む関数get_footerを記述する

index.phpにget_headerとget_footerを記述しないとエラーがでる
（サイトが表示されない）

style.cssを編集する

theme nameとかかく
このときstyle.cssはCSSフォルダに入れず、
index.phpと同じ階層に置く
screenshotつくる（ 880px x 660px ）
これもindex.phpと同じ階層に置く

functions.phpをつくる

functions.phpにセットアップの記述と、スタイルシートやJSを読み込む記述をかく

// セットアップ
function my_setup()
{
  add_theme_support('post-thumbnails'); // アイキャッチ画像を有効化
  add_theme_support('automatic-feed-links'); // 投稿とコメントのRSSフィードのリンクを有効化
  add_theme_support('title-tag'); // タイトルタグ自動生成
  add_theme_support(
    'html5',
    array( //HTML5でマークアップ
      'search-form',
      'comment-form',
      'comment-list',
      'gallery',
      'caption',
    )
  );
}

// スタイルシート・JS読み込み
function my_script_init()
{
  wp_enqueue_style('fontawesome', 'https://use.fontawesome.com/releases/v5.8.2/css/all.css', array(), '5.8.2', 'all');
  wp_enqueue_style('my', get_template_directory_uri() . '/css/style.css', array(), '1.0.0', 'all');
  wp_enqueue_script('my', get_template_directory_uri() . '/js/script.js', array( 'jquery' ), '1.0.0', true);
}
add_action('wp_enqueue_scripts', 'my_script_init');