HTML to WordPress - Step 1

1. Create a folder with a name at your WordPress themes folder.
2. Create index.php and style.css files.
3. Copy the following code into your style.css file and save it.

/*
Theme Name: Femiya Theme
Theme URI: http://1wmedia.in
Author: Jamal Mohammed
Author URI: http://1wmedia.in
*/

4.  Now go to your WordPress dashboard - Appearance - Themes - and mouse over to the Femiya Theme and Click Activate.
5. Copy the index.html file and paste it into index.php
6. Now copy the main styles from the CSS folder and paste it into the style.css - Should be below the */ code. (View 3rd  point).
7. Create header.php and footer.php.
8. Cut the header part from index.php and add it to header.php file
9. Replace header part at index.php with the following code.
<?php get_header(); ?>

10. Cut the footer part from index.php and add it to your footer.php file.
11.  Now replace footer part at index.php with the following code.
<?php get_footer(); ?>

12. Save all the files.

Watch the video Tutorial:

How to create a Bootstrap WordPress Theme? - step 4

If you didn't read the third step, then click here. Ok. Now we will move to the third step.

1. In this step, first create the Js files for the theme from the demo.

• bootstrap.min.js  -> Source -> view-source:http://getbootstrap.com/dist/js/bootstrap.min.js
• holder.min.js  ->Source -> view-source:http://getbootstrap.com/assets/js/vendor/holder.min.js
• ie10-viewport-bug-workaround.js -> Source -> view-source:http://getbootstrap.com/assets/js/ie10-viewport-bug-workaround.js
• ie-emulation-modes-warning.js -> Source -> view-source:http://getbootstrap.com/assets/js/ie-emulation-modes-warning.js

Save the file at js folder which is available at your themes folder. or create the new one and save them with source code

2. Remaining Js files - Direct linking url -> you need not to save this -> we will do this at functions.php

3. Add the following code into functions.php file, Just before the " ?> " .I mean before the PHP closing tag.

function newsite_js() {

    global $wp_scripts;

    wp_register_script( 'html5_shiv', 'https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js', '', '', false );
    wp_register_script( 'respond_js', 'https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js', '', '', false );

    $wp_scripts->add_data( 'html5_shiv', 'conditional', 'lt IE 9' );
    $wp_scripts->add_data( 'respond_js', 'conditional', 'lt IE 9' );
   
    wp_enqueue_script( 'IE_emeulationmode_js', get_template_directory_uri() . '/js/ie-emulation-modes-warning.js', array('jquery'), '', false );
   
    wp_enqueue_script( 'Google_ajax_js', 'https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js', '', '', true );
   
    wp_enqueue_script( 'bootstrap_js', get_template_directory_uri() . '/js/bootstrap.min.js', array('jquery'), '', true );
   
   
    wp_enqueue_script( 'holder_js', get_template_directory_uri() . '/js/holder.min.js', array('jquery'), '', true );
    wp_enqueue_script( 'IE10_js', get_template_directory_uri() . '/js/ie10-viewport-bug-workaround.js', array('jquery'), '', true );

}
add_action( 'wp_enqueue_scripts', 'newsite_js' );

4. Now save the functions.php file

5. Download the Bootstrap from the following link.

http://getbootstrap.com/getting-started/#download

6. Extract the Bootstrap file, find "fonts" folder. Copy the "fonts" folder and paste into the theme folder.

7. Now our scripts are activated.

8. You can verify - By your slider moving and menu working.

Video Tutorial: