Boostrap theme styling to wordpress conversion

Question

i gotta problem in converting my bootstrap.css into wordpress via localhost. I already placed my custom bootstrap theme in the themes folder in wordpress. however, i followed some tutorial on how to easily convert this theme however, it can display the menu but no styling from my css.

here is my code for my header.php

     <!DOCTYPE html>
     <html lang="en">
     <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../../favicon.ico">

    <title>Starter Template for Bootstrap</title>

    <link href="<?php bloginfo('template_directory');?>" rel="stylesheet">


  </head>

   <body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">

    <div class="navbar navbar-default navbar-fixed-top" role="navigation" id = "home">
      <div class="container" >
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-   target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand page-scroll" href="#page-top" ><strong>CODE.DESIGN.BUILD</strong></a>
        </div>
        <div class="collapse navbar-collapse">
          <ul class="nav navbar-nav pull-right">
            <li><a href="#about" class = "page-scroll">About</a></li>
             <li><a href="#portfolio" class = "page-scroll">My Portfolio</a></li>
            <li><a href="#contact" data-toggle="modal">Contact</a></li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </div><!--end of Navbar-->

and here is my style.css

/*
Theme Name: BS3 Theme
Theme URI:http://
Description: My Bootstrap 3 Responsive Theme
Version: 1
Author: **
Author URI: http://
*/

@import url ("css/bootstrap.css");

and for my index.php

<?php get_header(); ?>

<?php get_footer(); ?>

please do help and explain if there is such an answer. thank you stackpeople!

I also tried in the header.php in calling the css in this format.. <link href="<?php bloginfo('stylesheet_url');?>" rel="stylesheet"> but still no styling. :( — ccmanz
first check your style.css loads correctly body{background-color:red;}, if its working your @import url ("css/bootstrap.css"); not pointing correctly. — Hareesh
thank you for you response. i tried changing the color and its working. i still don't get it why my @import is not working. my folderstructure is themes\myTheme css/ fonts/ js/ index.php header.php footer.php is there something wrong? i correctly placed my files in a manner. -.- — ccmanz
i tried it it still not working. ugh! i just followed this tutorial code from code. and still not working. how frustrating. its not linking to my css. — ccmanz

privotester privotester · Accepted Answer · 2014-08-13T06:16:52

The styling for wordpress site on your localhost is from a file called style.css , which is located in "localhost\wordpress\wp-content\themes\yourtheme\style.css" , so please try modifying this file for your desired styling. , for bootstrap theme you can try the same.

Boostrap theme styling to wordpress conversion

2 Answers