For the website itself, go to: https://graficos.aguas.ml
When the site launched, it contained the following pages, which can all be
edited for content or deleted: index.md (the landing page),
pessoas.md, projetos.md,
recursos.md, contato.md.
The links in the menu and in the footer are all configured in the main
configuration file, _config.yml. Specifically, the parameter
navbar-links inside the file is used to define the top navigation menu, and
the author parameter just below it is used to define the information that
should be shown in the footer.
The general layout of the pages can't be changed easily. But things like colour,
spacing, fonts, and any other CSS style can easily be changed by adding CSS
rules to the recon.css file. For example, you can change
the size of the text, or the background colour of the navigation bar, or the
colour of the text in the footer.
Note that the template was designed in a way such that it changes drastically when you view it on a big screen (laptop) vs a small screen (phone)
To add a new page at the URL http://aguas-ml.github.io/example:
-
Add a file named
example.mdto the root directory of this repo -
The file must begin with two lines of three dashes (aka YAML front matter) in order for this new page to use the template. In other words, each file must begin with the following two lines
--- --- -
You can write either in markdown or in pure HTML
-
If you want to add images, I suggest you place all the images inside the
imgfolder and refer to images from there. -
In between the YAML front matter (between the two lines of dashes), you can specify a few parameters:
title: Gives a nice big title to the pagesubtitle: A subtitle to the pagebigimg: The path to an image that will be used as a big wide "header image". This path has to point to a local file in this repository, it cannot point to an image on the web- You can see the
projetospage to see an example of using thetitleandbigimgparameters
-
If you want to include a list of items on the page, where each item has an image, a short description, and some links, you need to define the items of the list in the YAML front matter and then include
{% include list-circles.html items=page.mylist %}in the page wherever you want to show the list. Any images will automatically be cropped to be circular, and there wil be a maximum of 4 items per row. See thepessoaspage for an example of how to include a nice list.
The pages described above should be added in the root directory. But any page
you create inside the _posts folder will be treated as a blog post. The nice
thing about blog post-type pages is that they will automatically be shown
chronologically at https://aguas-ml.github.io/blog/, with all the pagination
to previous/next posts taken care of.
Posts are created in exactly the same way as regular pages: you still need to
make them .md file, they have to have YAML front matter, they can support the
title/subtitle/bigimg parameters, you can add lists into them, etc. The
only difference is that the name of the file must begin with the date of the
post. For example, 2016-08-20-some-news.md. It's vital that the name of each
post contain the date in such a format, followed by whatever name you want,
followed by .md.
If you want to add Disqus comments to different pages, you need to sign up to
Disqus and add your Disqus shortname to the disqus parameter in the
_config.yml file. By default, all blog posts will have disqus comments at the
bottom of the page. You can add disqus to any other page by adding
comments: true to the YAML of any page.
The members page (pessoas.md), is populated by data in _data/people.yaml. This
data is pulled from the member AirTable database.
In general, this is run automatically when the site is built using GitHub Actions, and members can be added, removed, or modified in the AirTable.
This project is a clone of R Epidemics Consortium (RECON) website