including flexslider into my php project

Step 1: Download the zipped file from the link that i have provided and then extract the zipped file.
Step 2: After extracting the zipped file you will get a css file and two js files at the root directory.
Step 3: Put the images folder and the flexslider.css file in a new folder and name the folder css.
Step 4: Download the jquery-1.8.2-min.js and make a new folder and name it js. put the downloaded file and jquery.flexslider.js file in the js folder.
Step 5: Now link the css and js file in the following order.

<link href="css/flexslider.css" rel="stylesheet" type="text/css" />
 <script src="js/jquery-1.8.2-min.js" type="text/javascript"></script>
 <script type="text/javascript" src="js/jquery.flexslider.js"></script>

Step 6: Then add the following script at the header section of your .aspx page

<script type="text/javascript">
        $(document).ready(function () {
            InitializeImageSlider();
        });
        function InitializeImageSlider() {
            $('.flexslider').flexslider({
                animation: "slide",
                controlNav: true,
                directionNav: true,
                itemWidth: "100%",
                itemHeight: 400
            });
        }
    </script>

Step 7: Then Copy the code below and paste it anywhere in the page.

<div id="main" role="main">
      <section class="slider">
        <div class="flexslider carousel">
          <ul class="slides">
            <li>
  	    	    <img src="images/kitchen_adventurer_cheesecake_brownie.jpg" />
  	    		</li>
  	    		<li>
  	    	    <img src="images/kitchen_adventurer_lemon.jpg" />
  	    		</li>
  	    		<li>
  	    	    <img src="images/kitchen_adventurer_donut.jpg" />
  	    		</li>
  	    		<li>
  	    	    <img src="images/kitchen_adventurer_caramel.jpg" />
  	    		</li>
            </ul>
        </div>
      </section>

Step 8: Then link the images properly. I think you will be able to manage the rest. Thanks