Show pageOld revisionsBacklinksBack to top This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong. To make the homepage a little more interesting to look out, I thought' I'd have a look into [[http://getbootstrap.com|bootstrap]] as a framework. The plan is to do more with it over time, but for now using it like this is a placeholder/reminder. To get the latest version, just [[http://getbootstrap.com/docs/4.0/getting-started/download/|Download Bootstrap]]. Also, quick shout out for vim settings for indenting (I never remember them): [[https://stackoverflow.com/questions/234564/tab-key-4-spaces-and-auto-indent-after-curly-braces-in-vim|Tab key == 4 spaces and auto-indent after curly braces in Vim]] ====== Shell commands used ====== <code sh> # Edit .vimrc, for indentation: https://stackoverflow.com/questions/234564/tab-key-4-spaces-and-auto-indent-after-curly-braces-in-vim vi ~/.vimrc #Install the unzip command sudo apt-get install unzip # Create a backup location and backup existing index page mkdir -p backup/homepage cp /var/www/html/index.html backup/homepage/. # Get the latest code and extract the archive (note: file name will change over tiem) cd /var/www/ wget https://github.com/twbs/bootstrap/releases/download/v4.0.0-beta.3/bootstrap-4.0.0-beta.3-dist.zip unzip bootstrap-4.0.0-beta.3-dist.zip rm bootstrap-4.0.0-beta.3-dist.zip #Edit the index.html file using the template in the getting started documentation: http://getbootstrap.com/docs/4.0/getting-started/introduction/ vi index.html </code> ====== My homepage using the basic template ====== <file html index.html> <!doctype html> <html lang="en"> <head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- Bootstrap CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/css/bootstrap.min.css" integrity="sha384-Zug+QiDoJOrZ5t4lssLdxGhVrurbmBWopoEl+M6BdEfwnCJZtKxi1KgxUyJq13dy" crossorigin="anonymous"> <title>Roman-Halliday.com</title> </head> <body> <div class="container-fluid"> <h1>Personal Homepage</h1> <p>More stuff: <ul> <li><a href="http://datablog.roman-halliday.com">datablog.roman-halliday.com</a></li> <li><a href="http://wiki.roman-halliday.com">wiki.roman-halliday.com</a></li> <li><a href="http://romanian.roman-halliday.com">romanian.roman-halliday.com</a></li> </ul> </p> </div> <!-- Optional JavaScript --> <!-- jQuery first, then Popper.js, then Bootstrap JS --> <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/js/bootstrap.min.js" integrity="sha384-a5N7Y/aK3qNeh15eJKGWxsqtnX/wWdSZSKp+81YjTmS15nvnvxKHuzaWwXHDli+4" crossorigin="anonymous"></script> </body> </html> </file> website/bootstrap.txt Last modified: 2021/01/12 21:08by 127.0.0.1