Footer text
-------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .Rproj.user 2 | .Rhistory 3 | .RData 4 | .Ruserdata 5 | *.Rproj 6 | -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/Lato.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/Lato.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/Roboto.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/Roboto.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/Ubuntu.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/Ubuntu.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/LatoBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/LatoBold.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/NewsCycle.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/NewsCycle.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/OpenSans.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/OpenSans.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/Raleway.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/Raleway.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/LatoItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/LatoItalic.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/RalewayBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/RalewayBold.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/RobotoBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/RobotoBold.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/RobotoLight.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/RobotoLight.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/NewsCycleBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/NewsCycleBold.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/OpenSansBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/OpenSansBold.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/OpenSansItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/OpenSansItalic.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/OpenSansLight.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/OpenSansLight.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/RobotoMedium.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/RobotoMedium.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/SourceSansPro.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/SourceSansPro.ttf -------------------------------------------------------------------------------- /site_libs/font-awesome-5.0.13/fonts/fa-brands-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/font-awesome-5.0.13/fonts/fa-brands-400.ttf -------------------------------------------------------------------------------- /site_libs/font-awesome-5.0.13/fonts/fa-regular-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/font-awesome-5.0.13/fonts/fa-regular-400.ttf -------------------------------------------------------------------------------- /site_libs/font-awesome-5.0.13/fonts/fa-solid-900.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/font-awesome-5.0.13/fonts/fa-solid-900.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/OpenSansBoldItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/OpenSansBoldItalic.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/OpenSansLightItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/OpenSansLightItalic.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/SourceSansProBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/SourceSansProBold.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/SourceSansProItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/SourceSansProItalic.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/css/fonts/SourceSansProLight.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/css/fonts/SourceSansProLight.ttf -------------------------------------------------------------------------------- /site_libs/jqueryui-1.11.4/images/ui-icons_444444_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/jqueryui-1.11.4/images/ui-icons_444444_256x240.png -------------------------------------------------------------------------------- /site_libs/jqueryui-1.11.4/images/ui-icons_555555_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/jqueryui-1.11.4/images/ui-icons_555555_256x240.png -------------------------------------------------------------------------------- /site_libs/jqueryui-1.11.4/images/ui-icons_777620_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/jqueryui-1.11.4/images/ui-icons_777620_256x240.png -------------------------------------------------------------------------------- /site_libs/jqueryui-1.11.4/images/ui-icons_777777_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/jqueryui-1.11.4/images/ui-icons_777777_256x240.png -------------------------------------------------------------------------------- /site_libs/jqueryui-1.11.4/images/ui-icons_cc0000_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/jqueryui-1.11.4/images/ui-icons_cc0000_256x240.png -------------------------------------------------------------------------------- /site_libs/jqueryui-1.11.4/images/ui-icons_ffffff_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/jqueryui-1.11.4/images/ui-icons_ffffff_256x240.png -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/fonts/glyphicons-halflings-regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/RVerse-Tutorials/Simple-Websites/master/site_libs/bootstrap-3.3.5/fonts/glyphicons-halflings-regular.woff2 -------------------------------------------------------------------------------- /site_libs/highlightjs-9.12.0/default.css: -------------------------------------------------------------------------------- 1 | .hljs-literal { 2 | color: #990073; 3 | } 4 | 5 | .hljs-number { 6 | color: #099; 7 | } 8 | 9 | .hljs-comment { 10 | color: #998; 11 | font-style: italic; 12 | } 13 | 14 | .hljs-keyword { 15 | color: #900; 16 | font-weight: bold; 17 | } 18 | 19 | .hljs-string { 20 | color: #d14; 21 | } 22 | -------------------------------------------------------------------------------- /site_libs/highlightjs-9.12.0/textmate.css: -------------------------------------------------------------------------------- 1 | .hljs-literal { 2 | color: rgb(88, 72, 246); 3 | } 4 | 5 | .hljs-number { 6 | color: rgb(0, 0, 205); 7 | } 8 | 9 | .hljs-comment { 10 | color: rgb(76, 136, 107); 11 | } 12 | 13 | .hljs-keyword { 14 | color: rgb(0, 0, 255); 15 | } 16 | 17 | .hljs-string { 18 | color: rgb(3, 106, 7); 19 | } 20 | -------------------------------------------------------------------------------- /indexrmd.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "index.Rmd" 3 | --- 4 | 5 | `index.Rmd` is just your landing page. You can have as little or as much content as you want here. When readers click on your site, they will see this page first. 6 | 7 | A minimal `index.Rmd` would look like: 8 | 9 | ``` 10 | --- 11 | title: "My website" 12 | --- 13 | 14 | Here is my website. 15 | ``` 16 | -------------------------------------------------------------------------------- /site_libs/navigation-1.1/sourceembed.js: -------------------------------------------------------------------------------- 1 | 2 | window.initializeSourceEmbed = function(filename) { 3 | $("#rmd-download-source").click(function() { 4 | var src = $("#rmd-source-code").html(); 5 | var a = document.createElement('a'); 6 | a.href = "data:text/x-r-markdown;base64," + src; 7 | a.download = filename; 8 | document.body.appendChild(a); 9 | a.click(); 10 | document.body.removeChild(a); 11 | }); 12 | }; 13 | -------------------------------------------------------------------------------- /basics.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Required files" 3 | --- 4 | 5 | There are two required files for a website plus your content (your Rmarkdown files). 6 | 7 | The first required file is `_site.yml` which is your configuration file. 8 | 9 | The second required file is `index.Rmd` which is your landing page or page #1. 10 | 11 | Your content is specified in additional Rmarkdown files. Not required, but your website is not very interesting without content. -------------------------------------------------------------------------------- /site_libs/jqueryui-1.11.4/README: -------------------------------------------------------------------------------- 1 | This a jQuery UI custom build, downloaded from: 2 | http://jqueryui.com/download/#!version=1.11.4&components=1111111111110111111111111111111111111 3 | 4 | It includes all components except the datepicker, because it conflicts with 5 | bootstrap-datepicker that is packaged with Shiny. 6 | 7 | The copy of jQuery that is bundled with the download, under external/, is not 8 | included because Shiny already has its own copy of jQuery. 9 | -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/js/npm.js: -------------------------------------------------------------------------------- 1 | // This file is autogenerated via the `commonjs` Grunt task. You can require() this file in a CommonJS environment. 2 | require('../../js/transition.js') 3 | require('../../js/alert.js') 4 | require('../../js/button.js') 5 | require('../../js/carousel.js') 6 | require('../../js/collapse.js') 7 | require('../../js/dropdown.js') 8 | require('../../js/modal.js') 9 | require('../../js/tooltip.js') 10 | require('../../js/popover.js') 11 | require('../../js/scrollspy.js') 12 | require('../../js/tab.js') 13 | require('../../js/affix.js') -------------------------------------------------------------------------------- /styles.css: -------------------------------------------------------------------------------- 1 | h1 { 2 | font-size: 32px; 3 | } 4 | h1.title { 5 | font-size: 32px; 6 | } 7 | h2 { 8 | font-size: 28px; 9 | color: green; 10 | padding-top: 100px; 11 | margin: 0 200px 0 0; 12 | display: block; 13 | } 14 | h3 { 15 | font-size: 20px; 16 | font-style: italic; 17 | font-weight: 100; 18 | } 19 | h4 { 20 | font-size: 20px; 21 | } 22 | h5 { 23 | font-size: 16px; 24 | } 25 | h6 { 26 | font-size: 12px; 27 | } 28 | img { 29 | display: block; 30 | margin: auto; 31 | } 32 | 33 | img-circle { 34 | border-radius: 50%; 35 | } 36 | -------------------------------------------------------------------------------- /_site.yml: -------------------------------------------------------------------------------- 1 | name: "rmd-websites" 2 | output_dir: "." 3 | navbar: 4 | title: "Website from Rmds" 5 | left: 6 | - text: "Set-up" 7 | icon: fa-clone 8 | href: setup.html 9 | - text: "Basics" 10 | icon: fa-cubes 11 | href: basics.html 12 | - text: "_site.yml" 13 | icon: fa-cog 14 | href: site.html 15 | - text: "index.Rmd" 16 | href: indexrmd.html 17 | - text: "Content" 18 | href: content.html 19 | - text: "Extras" 20 | href: extras.html 21 | output: 22 | html_document: 23 | theme: readable 24 | toc_depth: 3 25 | toc_float: 26 | collapsed: false 27 | css: styles.css 28 | -------------------------------------------------------------------------------- /site.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "_site.yml" 3 | --- 4 | 5 | The `_site.yml` specifies the basic info about your site and the navigation bar at top. 6 | 7 | ``` 8 | name: "my-website" 9 | output_dir: "." 10 | navbar: 11 | title: "My Website" 12 | left: 13 | - text: "Home" 14 | icon: fa-home 15 | href: index.html 16 | - text: "About" 17 | icon: fa-bullhorn 18 | href: about.html 19 | menu: 20 | - text: "Page A" 21 | href: page_a.html 22 | - text: "Page B" 23 | href: page_b.html 24 | output: 25 | html_document: 26 | theme: readable 27 | toc_depth: 3 28 | toc_float: 29 | collapsed: false 30 | ``` 31 | 32 | -------------------------------------------------------------------------------- /setup.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Set-up" 3 | --- 4 | 5 | Set-up: 6 | 7 | 1. Go to https://github.com/eeholmes/Test-Website and copy all the files into a directory. 8 | 9 | - If GitHub Desktop works for you, then you can click 'Clone or download' and then click open in Desktop. 10 | 11 | - If GitHub Desktop is not working for you, then click 'Clone or download' and then download a zip file and unzip on your computer. 12 | 13 | 2. Open RStudio and 'New Project' in the upper right. Then select 'From Existing Directory' and select the directory where the 'Test-Website' files are. 14 | 15 | 3. From RStudio, click 'Build' from upper right and then 'Build Website'. Your website should open. You can select 'View in browser'. 16 | 17 | - You can also right click on 'index.html' from the files, and select 'open in browser'. -------------------------------------------------------------------------------- /index.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Creating a simple website from Rmarkdown files" 3 | --- 4 | 5 | ```{r echo=FALSE} 6 | # devtools::install_github("ropenscilabs/icon") 7 | library(icon) 8 | ``` 9 | 10 | We will create a simple website from Rmarkdown files using RStudio. 11 | 12 | Although the website we create will be simple and bare, you can create more complex and customized websites using the techniques you learn. Here are some examples: 13 | 14 | * https://rmarkdown.rstudio.com [`r icon::fa("github")`](https://github.com/rstudio/rmarkdown/tree/gh-pages) 15 | 16 | * https://rmarkdown.rstudio.com/flexdashboard/ [`r icon::fa("github")`](https://github.com/rstudio/rmarkdown/tree/gh-pages) 17 | 18 | 19 | Learn more 20 | 21 | * https://bookdown.org/yihui/rmarkdown/rmarkdown-site.html 22 | 23 | * https://rmarkdown.rstudio.com/lesson-13.html -------------------------------------------------------------------------------- /content.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "content.Rmd" 3 | --- 4 | 5 | You can now add as many Rmarkdown files as you want for your content. Each one will be processed into an html file. For example in `Test Website`, we have two files, `about.Rmd` and `contact.Rmd`. Your Rmd files should have the yaml at top and then your Rmarkdown content. 6 | 7 | Here is a simple example. 8 | 9 | ``` 10 | --- 11 | title: Simple Rmd File 12 | --- 13 | 14 | Here is a simple file. 15 | ``` 16 | 17 | `about.Rmd` is a fuller Rmd file with R code and figures. 18 | 19 | If you want the file linked to in your top nav bar, then add it to `_site.yml`. 20 | 21 | ``` 22 | name: "my-website" 23 | output_dir: "." 24 | navbar: 25 | title: "My Website" 26 | left: 27 | - text: "About" 28 | href: about.html 29 | - text: "Contact" 30 | icon: fa-user-circle 31 | href: contact.html 32 | output: 33 | html_document: 34 | theme: readable 35 | toc_depth: 3 36 | toc_float: 37 | collapsed: false 38 | ``` 39 | 40 | -------------------------------------------------------------------------------- /site_libs/navigation-1.1/codefolding.js: -------------------------------------------------------------------------------- 1 | 2 | window.initializeCodeFolding = function(show) { 3 | 4 | // handlers for show-all and hide all 5 | $("#rmd-show-all-code").click(function() { 6 | $('div.r-code-collapse').each(function() { 7 | $(this).collapse('show'); 8 | }); 9 | }); 10 | $("#rmd-hide-all-code").click(function() { 11 | $('div.r-code-collapse').each(function() { 12 | $(this).collapse('hide'); 13 | }); 14 | }); 15 | 16 | // index for unique code element ids 17 | var currentIndex = 1; 18 | 19 | // select all R code blocks 20 | var rCodeBlocks = $('pre.r, pre.python, pre.bash, pre.sql, pre.cpp, pre.stan'); 21 | rCodeBlocks.each(function() { 22 | 23 | // create a collapsable div to wrap the code in 24 | var div = $(''); 25 | if (show) 26 | div.addClass('in'); 27 | var id = 'rcode-643E0F36' + currentIndex++; 28 | div.attr('id', id); 29 | $(this).before(div); 30 | $(this).detach().appendTo(div); 31 | 32 | // add a show code button right above 33 | var showCodeText = $('' + (show ? 'Hide' : 'Code') + ''); 34 | var showCodeButton = $(''); 35 | showCodeButton.append(showCodeText); 36 | showCodeButton 37 | .attr('data-toggle', 'collapse') 38 | .attr('data-target', '#' + id) 39 | .attr('aria-expanded', show) 40 | .attr('aria-controls', id); 41 | 42 | var buttonRow = $(''); 43 | var buttonCol = $(''); 44 | 45 | buttonCol.append(showCodeButton); 46 | buttonRow.append(buttonCol); 47 | 48 | div.before(buttonRow); 49 | 50 | // update state of button on show/hide 51 | div.on('hidden.bs.collapse', function () { 52 | showCodeText.text('Code'); 53 | }); 54 | div.on('show.bs.collapse', function () { 55 | showCodeText.text('Hide'); 56 | }); 57 | }); 58 | 59 | } 60 | -------------------------------------------------------------------------------- /Extras.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Extras" 3 | output: 4 | html_document: 5 | toc: true 6 | --- 7 | 8 | 9 | 10 | ## Table of Contents 11 | 12 | If you want to see table of contents for your Rmd files, you specify toc properties in your `_site.yml` file. 13 | 14 | ``` 15 | output: 16 | html_document: 17 | theme: readable 18 | toc_depth: 3 19 | toc_float: 20 | collapsed: false 21 | ``` 22 | 23 | and specify `toc: true` in your yaml at the top of your Rmd file. 24 | 25 | ``` 26 | output: 27 | html_document: 28 | toc: true 29 | ``` 30 | 31 | See the `about.Rmd` file for an example. 32 | 33 | ## Themes 34 | 35 | Your `_site.yml` file has a line that specifies the theme. 36 | 37 | ``` 38 | output: 39 | html_document: 40 | theme: readable 41 | ``` 42 | 43 | The following are automatically available to you: bootstrap, cerulean, cosmo, flatly, journal, lumen, paper, readable, sandstone, simplex, spacelab, united and yeti. Try changing the theme to one of these and rebuilding your website. 44 | 45 | You can download other bootstrap css files and put in site_libs if you want other themes. Do a search for 'bootstrap themes free'. 46 | 47 | ## Icons 48 | 49 | You can easily add icons to your navigation tabs. The `icon:` line specifies the icon. See the FontAwesome website for icons available. Put `fa-` in front of the name. For example a photo icon would be specified `fa-picture-o` `r icon::fa("bullhorn")`. 50 | 51 | ``` 52 | left: 53 | - text: "Set-up" 54 | icon: fa-picture-o 55 | href: setup.html 56 | ``` 57 | 58 | ## Customizing 59 | 60 | You can add your own css file to customize the html. Add to your `_site.yml` file: 61 | 62 | ``` 63 | output: 64 | html_document: 65 | theme: cosmo 66 | highlight: textmate 67 | include: 68 | after_body: footer.html 69 | css: styles.css 70 | ``` 71 | 72 | And then add a `styles.css` file to your folder. 73 | 74 | ``` 75 | h1 { 76 | font-color: green 77 | } 78 | ``` 79 | -------------------------------------------------------------------------------- /site_libs/tocify-1.9.1/jquery.tocify.css: -------------------------------------------------------------------------------- 1 | /* 2 | * jquery.tocify.css 1.9.1 3 | * Author: @gregfranko 4 | */ 5 | 6 | /* The Table of Contents container element */ 7 | .tocify { 8 | width: 20%; 9 | max-height: 90%; 10 | overflow: auto; 11 | margin-left: 2%; 12 | position: fixed; 13 | border: 1px solid #ccc; 14 | webkit-border-radius: 6px; 15 | moz-border-radius: 6px; 16 | border-radius: 6px; 17 | } 18 | 19 | /* The Table of Contents is composed of multiple nested unordered lists. These styles remove the default styling of an unordered list because it is ugly. */ 20 | .tocify ul, .tocify li { 21 | list-style: none; 22 | margin: 0; 23 | padding: 0; 24 | border: none; 25 | line-height: 30px; 26 | } 27 | 28 | /* Top level header elements */ 29 | .tocify-header { 30 | text-indent: 10px; 31 | } 32 | 33 | /* Top level subheader elements. These are the first nested items underneath a header element. */ 34 | .tocify-subheader { 35 | text-indent: 20px; 36 | display: none; 37 | } 38 | 39 | /* Makes the font smaller for all subheader elements. */ 40 | .tocify-subheader li { 41 | font-size: 12px; 42 | } 43 | 44 | /* Further indents second level subheader elements. */ 45 | .tocify-subheader .tocify-subheader { 46 | text-indent: 30px; 47 | } 48 | 49 | /* Further indents third level subheader elements. You can continue this pattern if you have more nested elements. */ 50 | .tocify-subheader .tocify-subheader .tocify-subheader { 51 | text-indent: 40px; 52 | } 53 | 54 | /* Twitter Bootstrap Override Style */ 55 | .tocify .tocify-item > a, .tocify .nav-list .nav-header { 56 | margin: 0px; 57 | } 58 | 59 | /* Twitter Bootstrap Override Styles */ 60 | .tocify .tocify-item a, .tocify .list-group-item { 61 | padding: 5px; 62 | } 63 | 64 | .tocify .nav-pills > li { 65 | float: none; 66 | } 67 | 68 | /* We don't override the bootstrap colors because this gives us the 69 | wrong selection colors when using bootstrap themes 70 | 71 | .tocify .list-group-item:hover, .tocify .list-group-item:focus { 72 | background-color: #f5f5f5; 73 | } 74 | 75 | .tocify .list-group-item.active:hover, .tocify .list-group-item.active:focus { 76 | background-color: #428bca; 77 | } 78 | */ 79 | 80 | /* End Twitter Bootstrap Override Styles */ 81 | -------------------------------------------------------------------------------- /site_libs/bootstrap-3.3.5/shim/html5shiv.min.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @preserve HTML5 Shiv 3.7.2 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed 3 | */ 4 | // Only run this code in IE 8 5 | if (!!window.navigator.userAgent.match("MSIE 8")) { 6 | !function(a,b){function c(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x",d.insertBefore(c.lastChild,d.firstChild)}function d(){var a=t.elements;return"string"==typeof a?a.split(" "):a}function e(a,b){var c=t.elements;"string"!=typeof c&&(c=c.join(" ")),"string"!=typeof a&&(a=a.join(" ")),t.elements=c+" "+a,j(b)}function f(a){var b=s[a[q]];return b||(b={},r++,a[q]=r,s[r]=b),b}function g(a,c,d){if(c||(c=b),l)return c.createElement(a);d||(d=f(c));var e;return e=d.cache[a]?d.cache[a].cloneNode():p.test(a)?(d.cache[a]=d.createElem(a)).cloneNode():d.createElem(a),!e.canHaveChildren||o.test(a)||e.tagUrn?e:d.frag.appendChild(e)}function h(a,c){if(a||(a=b),l)return a.createDocumentFragment();c=c||f(a);for(var e=c.frag.cloneNode(),g=0,h=d(),i=h.length;i>g;g++)e.createElement(h[g]);return e}function i(a,b){b.cache||(b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag()),a.createElement=function(c){return t.shivMethods?g(c,a,b):b.createElem(c)},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+d().join().replace(/[\w\-:]+/g,function(a){return b.createElem(a),b.frag.createElement(a),'c("'+a+'")'})+");return n}")(t,b.frag)}function j(a){a||(a=b);var d=f(a);return!t.shivCSS||k||d.hasCSS||(d.hasCSS=!!c(a,"article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}")),l||i(a,d),a}var k,l,m="3.7.2",n=a.html5||{},o=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,p=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,q="_html5shiv",r=0,s={};!function(){try{var a=b.createElement("a");a.innerHTML="index.Rmd is just your landing page. You can have as little or as much content as you want here. When readers click on your site, they will see this page first.
A minimal index.Rmd would look like:
---
249 | title: "My website"
250 | ---
251 |
252 | Here is my website.There are two required files for a website plus your content (your Rmarkdown files).
247 |The first required file is _site.yml which is your configuration file.
The second required file is index.Rmd which is your landing page or page #1.
Your content is specified in additional Rmarkdown files. Not required, but your website is not very interesting without content.
250 | 251 | 252 | 253 | 254 |The _site.yml specifies the basic info about your site and the navigation bar at top.
name: "my-website"
248 | output_dir: "."
249 | navbar:
250 | title: "My Website"
251 | left:
252 | - text: "Home"
253 | icon: fa-home
254 | href: index.html
255 | - text: "About"
256 | icon: fa-bullhorn
257 | href: about.html
258 | output:
259 | html_document:
260 | theme: readable
261 | toc_depth: 3
262 | toc_float:
263 | collapsed: falseSet-up:
247 |If GitHub Desktop works for you, then you can click ‘Clone or download’ and then click open in Desktop.
If GitHub Desktop is not working for you, then click ‘Clone or download’ and then download a zip file and unzip on your computer.
Open RStudio and ‘New Project’ in the upper right. Then select ‘From Existing Directory’ and select the directory where the ‘Test-Website’ files are.
From RStudio, click ‘Build’ from upper right and then ‘Build Website’. Your website should open. You can select ‘View in browser’.
You can now add as many Rmarkdown files as you want for your content. Each one will be processed into an html file. For example in Test Website, we have two files, about.Rmd and contact.Rmd. Your Rmd files should have the yaml at top and then your Rmarkdown content.
Here is a simple example.
248 |---
249 | title: Simple Rmd File
250 | ---
251 |
252 | Here is a simple file.about.Rmd is a fuller Rmd file with R code and figures.
If you want the file linked to in your top nav bar, then add it to _site.yml.
name: "my-website"
256 | output_dir: "."
257 | navbar:
258 | title: "My Website"
259 | left:
260 | - text: "About"
261 | href: about.html
262 | - text: "Contact"
263 | icon: fa-user-circle
264 | href: contact.html
265 | output:
266 | html_document:
267 | theme: readable
268 | toc_depth: 3
269 | toc_float:
270 | collapsed: falseWe will create a simple website from Rmarkdown files using RStudio.
247 |Although the website we create will be simple and bare, you can create more complex and customized websites using the techniques you learn. Here are some examples:
248 |Learn more
253 | 257 | 258 | 259 | 260 | 261 |If you want to see table of contents for your Rmd files, you specify toc properties in your _site.yml file.
output:
355 | html_document:
356 | theme: readable
357 | toc_depth: 3
358 | toc_float:
359 | collapsed: falseand specify toc: true in your yaml at the top of your Rmd file.
output:
362 | html_document:
363 | toc: trueSee the about.Rmd file for an example.
Your _site.yml file has a line that specifies the theme.
output:
370 | html_document:
371 | theme: readableThe following are automatically available to you: bootstrap, cerulean, cosmo, flatly, journal, lumen, paper, readable, sandstone, simplex, spacelab, united and yeti. Try changing the theme to one of these and rebuilding your website.
373 |You can download other bootstrap css files and put in site_libs if you want other themes. Do a search for ‘bootstrap themes free’.
374 |You can easily add icons to your navigation tabs. The icon: line specifies the icon. See the FontAwesome website for icons available. Put fa- in front of the name. For example a photo icon would be specified fa-picture-o .
left:
379 | - text: "Set-up"
380 | icon: fa-picture-o
381 | href: setup.htmlYou can add your own css file to customize the html. Add to your _site.yml file:
output:
387 | html_document:
388 | theme: cosmo
389 | highlight: textmate
390 | include:
391 | after_body: footer.html
392 | css: styles.cssAnd then add a styles.css file to your folder.
h1 {
395 | font-color: green
396 | }