-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathaboutwebsite.html
136 lines (95 loc) · 9.26 KB
/
aboutwebsite.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>About the website</title>
<meta name="description" content="About the website.">
<link rel="stylesheet" href="http://www.fsp.usp.br/labdaps/css/main.css">
<link rel="canonical" href="http://www.fsp.usp.br/labdaps/aboutwebsite.html">
<link rel="shortcut icon" type ="image/x-icon" href="http://www.fsp.usp.br/labdaps/images/favicon.ico">
<meta name="google-site-verification" content="HaGuAiOC1JmHgzHeB6rf-i_1-gbo7mN0xlNij4tugnI" />
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="http://www.fsp.usp.br/labdaps/">LABDAPS @FSP-USP</a>
</div>
<div class="collapse navbar-collapse" id="navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="http://www.fsp.usp.br/labdaps/">Início</a></li>
<li><a href="http://www.fsp.usp.br/labdaps/equipe">Equipe</a></li>
<li><a href="http://www.fsp.usp.br/labdaps/cursos">Curso IA em Saúde</a></li>
<li><a href="http://www.fsp.usp.br/labdaps/pesquisa">Pesquisas em Andamento</a></li>
<li><a href="http://www.fsp.usp.br/labdaps/publicacoes">Publicações</a></li>
<li><a href="http://www.fsp.usp.br/labdaps/iacovbr">IACOV-BR</a></li>
</ul>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row">
<div id="textid" class="col-sm-12">
<h1 id="use-this-website-as-a-template-for-your-academic-research-group">Use this website as a template for your academic research group</h1>
<p>This website is powered by <a href="https://jekyllrb.com">Jekyll</a> and uses some <a href="http://www.getbootstrap.com">Bootstrap</a> and <a href="http://www.bootswatch.com">Bootswatch</a>. We tried to make it simple yet adaptable, so that it is easy for you to re-use it for your purpose.</p>
<h3 id="getting-started">Getting started</h3>
<p>All pages are written in <a href="https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet">markdown</a> for easy editing, and <a href="https://jekyllrb.com">Jekyll</a> uses Liquid for the data-driven pages. The publicaion list, news items, and group members are stored as <code class="highlighter-rouge">.yml</code> data sheets (plain text) in the <code class="highlighter-rouge">_data folder</code>, so that one can update the website easily. The pages are in the <code class="highlighter-rouge">_pages</code> folder. Updating and maintaining is easy using <a href="http://www.github.com">Github</a> (not worldpress-easy, but there are other advantages (see e.g. <a href="https://www.taniarascia.com/make-a-static-website-with-jekyll/">this</a>, or <a href="http://www.webdesignerdepot.com/2015/11/jekyll-against-the-rest-of-the-world/">this</a>). <a href="https://jekyllrb.com">Jekyll</a> takes all the markdown and data files, and creates beautiful <code class="highlighter-rouge">html</code> files in the <code class="highlighter-rouge">_site</code> folder.</p>
<p>If you never used <a href="https://jekyllrb.com">Jekyll</a>, read the <a href="https://en.wikipedia.org/wiki/Jekyll_(software)">wikipedia article</a> article and check out <a href="https://jekyllrb.com">their website</a>. Same for <a href="http://www.github.com">Github</a>, which will host your first website draft.</p>
<p>Create and open a github account, go to <a href="https://github.com/allanlab/allanlab">our repository</a>, and click ‘fork’. This is now your copy of the website, and you can change and adapt it as you want. You don’t have to link to us or mention us (but of course we appreciate it). Then change the name of the repository to “your_username” and the name of the branch to “gh-pages”. Your website is now automatically published under <em>your_username.github.io/your_username/</em>. Except that it probably still looks like our website.</p>
<p>To modify the webpage, you can either do everything on on github.com (go to a file, click “edit”, then “commit”, “push”), or install <a href="https://jekyllrb.com">Jekyll</a> on your computer and play with your local copy that you sync with the branch on github.com. The former is much easier in the beginning, but a bit less convenient once you start rewriting everythint. To get it to work on your computer (and to learn a bit more about <a href="https://jekyllrb.com">Jekyll</a>), <a href="https://www.taniarascia.com/make-a-static-website-with-jekyll/">here</a> and <a href="https://scotch.io/tutorials/getting-started-with-jekyll-plus-a-free-bootstrap-3-starter-theme">here</a> are tutorials on how to use it and how set it up locally. Also, consider using the <a href="http://www.desktop.github.com">Github desktop app</a>, I found it helpful.</p>
<h3 id="customization">Customization</h3>
<p>Now let’s make this <em>your</em> website.</p>
<p>First, go to the <code class="highlighter-rouge">news.ylm</code>, <code class="highlighter-rouge">publist.ylm</code>, and <code class="highlighter-rouge">team.ylm</code> files in the <code class="highlighter-rouge">_data</code> folder and insert your own data into the data fields. Watch out: <a href="https://jekyllrb.com">Jekyll</a> is quite strict about extra or missing spaces etc. Adhere to the format. In the beginning, test each change: commit, push, and check the published website.</p>
<p>For publications, you can add a “1” in the highlight field, then it will be featured prominently. You can add important news items (red, “news1”), and less important news items (blue, “news2”).</p>
<p>For the news items, just keep adding them. The first 10 will be displayed on the ‘home’ page.</p>
<p>For the <code class="highlighter-rouge">team.ylm</code> file</p>
<p>Next, change the content of all files in the <code class="highlighter-rouge">_pages</code> folder. To change the title in the homepage, go to <code class="highlighter-rouge">homelay.html</code> in the <code class="highlighter-rouge">_layout</code> folder.</p>
<p>Lastly, change the footer and perhaps header appropriately (in <code class="highlighter-rouge">_include</code>).</p>
<p>You might also want to change the style or theme. I imported style files (in sass) from Bootstrap/Bootwatch, you can replace them with your own (in the <code class="highlighter-rouge">_sass directory</code>). For small changes, just work on the override stuff in the <code class="highlighter-rouge">main.sass</code> file in the <code class="highlighter-rouge">CSS</code> folder. Or change some variables in the <code class="highlighter-rouge">_variables.sass</code> file, like the background color etc.</p>
<p>As said, <a href="https://jekyllrb.com">Jekyll</a> takes all the markdown and data files, and creates beautiful <code class="highlighter-rouge">html</code> files in the <code class="highlighter-rouge">_site</code> folder.In the end, either upload these files to your server, or buy yourself a domain and check the instructions on github on how to host it there.</p>
<h3 id="copyright--credit">Copyright / credit</h3>
<p>You can use this template as you please. You don’t have to link to us or mention us (but of course we appreciate it). We also welcome it if you send us an email with a link to your website, perhaps we’ll publish a list here at some point.</p>
<p>Comments welcome.</p>
<p>Code released under the MIT License.</p>
</div>
</div>
</div>
<div id="footer" class="panel">
<div class="panel-footer">
<div class="container-fluid">
<div class="row">
<div class="col-sm-4">
<p>© 2020 Labdaps. Site feito com <a href="https://jekyllrb.com">Jekyll</a>; com o template disponibilizado pelo <a href="http://www.allanlab.org/">Allan Lab</a>.</p>
<p>Nós somos parte da <a href="https://www.fsp.usp.br/site/">Faculdade de Saúde Pública</a> na <a href="https://www5.usp.br/">Universidade de São Paulo</a>.</p>
<p> </p><p>
</div>
<div class="col-sm-4">
Financiamento:<br />
- <a href="http://fapesq.rpp.br/editais/editais-resultados/resultado-complementar-edital-003-2020-covid-19.pdf/view">Fapesq</a><br />
- <a href="http://www.cnpq.br/web/guest/noticiasviews/-/journal_content/56_INSTANCE_a6MO/10157/9377146">CNPq</a><br />
- <a href="https://ai4hcovidgrants.microsoft.com/grantproposal/">Microsoft</a>
</div>
<div class="col-sm-4">
Contato:<br />
Faculdade de Saúde Pública, Sala 204<br />
Av Dr. Arnaldo, 715, Cerqueira César<br />
São Paulo - SP, CEP: 03178-200<br />
Brasil <br />
(<a href="https://www.google.com/maps?ll=-23.553883,-46.673158&z=15&t=m&hl=pt-BR&gl=US&mapclient=embed&q=Av.+Dr.+Arnaldo,+715+-+Pinheiros+S%C3%A3o+Paulo+-+SP+05406-150">Google Maps</a>)
</div>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://www.fsp.usp.br/labdaps/js/bootstrap.min.js"></script>
</body>
</html>