To change the color scheme/fonts of the website modify the
theme
in the _site.yml
file (see here for
options):
The small image that shows up on the browser can also be changed.
You can make a small image to replace the existing one by going to https://favicon.io/favicon-converter/ and uploading an image that you would like.
Next, simply replace the image called favicon.ico
in the
images
directory within the resources
directory with the image you just created and downloaded from the
favicon converter website.
To make additional changes to the style, you can modify the
styles.css
file with css code. This website has great information
about css code.
As an example if you wanted to change the color of the blue line to
green you could change where it says lightblue
to
lightgreen
in the styles.css
file. You can
also use a hex color code like those that can be found at this website, such as
#00FF9E
to get a specific shade.
Note that if you change the css file with a new element that is not
already defined like body
then you would need to do it as
done with the banner
element. This was then added to the
index.Rmd file by using:
<div class = "banner">
Banner text!
</div>
Also checkout the R Markdown cheatsheet for more customization of the pages.