OK, so it’s time to create a homepage that doesn’t look like it was made by a seven year old and you have found a nice looking bootstrap (or some other) theme that you would like to use for the job. There are a few tricks that can really smooth out this process.
- First, it does not have to be an actual Bootstrap theme. https://html5up.net has some really nice responsive, and FREE, themes that you may want to check out.
- Download the theme, unzip it, and move the theme folder into your mysite folder.
- Rename the theme folder something short and simple like home.
- Open the folder and open the index.html file inside of the folder with your browser to make sure that you like it. If there is no index.html file open something else. If you like it, rename it to index.html.
- Return to your mysite folder and rename the current index.html file to something like old_index.html. There may be something in that file that you will need later.
- Re-establish those links. For example, it is highly likely that one of your css links reads something like
<link href=”css/bootstrap.min.css” rel=”stylesheet“>. Change it to read
<link href=”home/css/bootstrap.min.css” rel=”stylesheet“>.
<script src=”js/jquery.js“></script> should change to
<link href=”http://font-awesome.com/css/font-awesome.min.css” rel=”stylesheet” type=”text/css“> for example, don’t worry about it. It’s fine.
- Unless the theme comes with images that you want to keep, you should be done. If so, link those images the same way as you linked the js and css files. Test it with your browser. If everything looks as it should, you are ready to build a great looking home page!