サーバーアップの流れ（動的サイトの場合）

※サーバー・ドメインは取得済みの前提

1. FTPソフトを使用してサーバーにログイン

   • Filezilla
     
   • サイバーダック
     
     
     ※FTPのログイン情報はサーバーの管理画面等から確認できます！

2. WordPressをインストール（サーバーの管理画面から）

   • Xサーバー
   • ロリポップ
   • さくら
   • コノハ etc…
     

3. コーディングしたファイルを複製し名前を任意のテーマ名に変更

   複製するのは元のコーディングフォルダを残しておくため！
   

4. ドメイン名 > wp-content > themesフォルダーの中に 3 を追加

        

5. index.htmlをindex.phpに変更

   

   このようなポップアップが表示されたら”.php”を使用を選択！

   

6. style.cssの調整

   1. style.cssをcssファイル内ではなくindex.phpと同じ場所に配置

   2. style.cssをVS cord で開き以下のコードを「@charset”UTF-8”;」の直下に入力

      /*
      Theme Name: テーマネーム
      Version: 1.0
      Author: 名前
      */

7. 管理画面にログインし、外観 >テーマから追加したオリジナルテーマを選択

8. header.phpを作成

   1. index.phpを複製し、header.phpに変更
   2. header.phpをVS cordで開き<DOCTIPE html>から</header>までを残して
他のコードを削除
   3. </head>の上に <?php wp_head(); ?>を追加
   4. コードを書き換える
      • テーマフォルダのURLを表示するコード
        →<?php echo get_stylesheet_directory_uri(); ?>
      • サイト内のリンクを読み込むコード
        • TOPページ→<?php echo esc_url(home_url(‘/’)); ?>
        • about.html→<?php echo esc_url(home_url(‘/’)); ?>about/
        • #about→<?php echo esc_url(home_url(‘/’)); ?>#about

9. footer.phpを作成（流れはheader.phpと同じ！）

   1. index.phpを複製し、footer.phpに変更
   2. footer.phpをVS cordで開き<footer>から</html>までを残して他のコードを削除
   3. </footer>の下に <?php wp_footer(); ?>を追加
   4. コードを書き換える
      • テーマフォルダのURLを表示するコード
        →<?php echo get_stylesheet_directory_uri(); ?>
      • サイト内のリンクを読み込むコード
        • TOPページ→<?php echo esc_url(home_url(‘/’)); ?>
        • about.html→<?php echo esc_url(home_url(‘/’)); ?>about/
        • #about→<?php echo esc_url(home_url(‘/’)); ?>#about

10. index.phpでヘッダーとフッターを読み込む

    1. index.phpをVS cordで開き<DOCTIPE html>から</header>までを
<?php get_header(); ?>に変更
    2. <footer>から</html>までを<?php get_footer(); ?>に変更
    3. コードを書き換える
       • 画像を読み込むコード
         →<?php echo get_stylesheet_directory_uri(); ?>
       • サイト内のリンクを読み込むコード
         • TOPページ→<?php echo esc_url(home_url(‘/’)); ?>
         • about.html→<?php echo esc_url(home_url(‘/’)); ?>about/
         • #about→<?php echo esc_url(home_url(‘/’)); ?>#about

11. index.phpを複製してfront-page.phpを作成（トップページになります！）

    1. front-page.php作成したら
元のindex.phpの<main>の下に以下のループのコードを入力

       <?php if(have_posts()): ?>
       <?php while(have_posts()): the_post(); ?>

    2. </main>の前に以下のループのコードを入力

       <?php endwhile; ?>
       <?php endif; ?>

    3. コンテンツ部分を以下のコードに変更

       <?php the_content(); ?>

12. 管理画面から固定ページを作成

    1. WordPress管理画面から「固定ページ」 > 「固定ページを追加」をクリック
    2. タイトルにトップページ、URLのパーマリンク（スラッグ）にhomeと入力し公開

       

13. 固定ページ「トップページ」とfront-page-phpを紐づける

    1. 「設定」 > 「表示設定」をクリックして、表示設定画面を表示
    2. ホームページの表示で固定ページを選択し
ホームページのプルダウンをトップページに設定して変更を保存をクリック