Learn to Create WordPress Themes by Building 5 Projects

Header and footer

Now let's split this up into a header and a footer file in addition to index.php:

1. From the index.php file, we'll grab the code from the top down to the end of </nav>.
2. Let's create a new file called header.php. We will paste the code that we grabbed earlier and into this header file and save it.

3. In its place inside index.php, we'll open up a set of php tags using get_header():

      <?php get_header(); ?>         <div class="container index">

Our page will look the exact same.

4. We'll then do the same thing with footer. We'll grab the code from this container down to the very bottom, from <div class="container"> till closing </html> tag:

      <div class="container">         <hr>         <footer>            <p>&copy; 2017 WordStrap</p>         </footer>     </div> <script src="http://code.jquery.com/jquery-1.12.0.min.js"> ...