こちらのサイト様のテンプレートを使用させていただき、HTMLをWordPress化していこうと思います。
《無料》ホームページテンプレート.com | 商用可能なホームページテンプレート・レスポンシブWordPressテーマが完全無料
商用利用可能な無料ホームページテンプレート・WordPressテーマ | スマートフォン(iPhone、Android)・タブレット端末(iPadなど)対応のレスポンシブウェブデザインWordPressテーマ・HTMLテンプレートが無料でダウンロードできます。
![こばゆた](https://kbyt-programming.com/wp-content/uploads/2020/06/cb9962b18ce5bdfe4262a735a668bd70.jpg)
こばゆた
記事を順番に見ていただければ以下の様なサイトを作成することができます
![ローカル環境でWordPressを編集するのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/03/local_wp-ic.png)
ローカル環境でWordPressの編集をする
![WordPress化のアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/03/wordpress-ic.png)
HTMLファイルをWordPress化する手順
![functions.phpのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/05/ic-functions.png)
functions.phpで外部ファイルを読み込む
![テンプレートタグbloginfoのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/10/ic-bloginfo.png)
テンプレートタグbloginfo
![ループのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/05/ic-loop.png)
ループの基本とテンプレートタグ
![記事ページのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/03/ic-single.png)
個別記事ページ
![functions.phpのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/05/ic-thumbnail.png)
サムネイルの設定と表示
![header.phpのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/03/ic-header.png)
header.phpでやること
![page.phpのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/03/ic-page.png)
固定ページ
![テンプレート階層のアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/05/ic-template.png)
テンプレート階層
![お問い合わせページのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/03/ic-contact-form.png)
お問い合わせフォームの作成
![アーカイブページのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/03/ic-archive.png)
アーカイブページ作成
![条件分岐タグのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/04/ic-is_home.png)
条件分岐タグ
![ナビゲーションメニューのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/09/ic-nav_menu.png)
ナビゲーションメニューの作成
![メニューのパラメータ-アイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/04/ic-nav_para.png)
ナビゲーションメニューをカスタムする
![ナビゲーションメニューを2列にする方法のアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/05/ic-nav_2row.png)
ナビゲーションメニューをカスタムするその2
![ページネーションを設置するのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/05/ic-pagination.png)
ページネーションを設置する
![404ページのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/05/ic-404.png)
404ページの作成
![検索ページとフォームのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/05/ic-serach.png)
検索フォームの作成
![サイドバーのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/03/ic-sidebar.png)
サイドバーの作成
![カスタムフィールドのアイキャッチ](https://kbyt-programming.com/wp-content/uploads/2021/04/ic-custom_field.png)
カスタムフィールドの作成