The CSU-CS theme is based off the Brand Style Guidelines. It is meant for use of courses taught by the CS department at CSU, and students / faculty are also free to use it. Please follow th CSU Branding Styl Guidelines and copy info.
Add this line to your Jekyll site's Gemfile
:
gem "jekyll-theme-csu-cs"
And add this line to your Jekyll site's _config.yml
:
theme: jekyll-theme-csu-cs
And then execute:
$ bundle
Or install it yourself as:
$ gem install jekyll-theme-csu-cs
Includes most courses should include:
resources/university.html
- includes tilt, counselling, and canvasTech with headers under a 'University Resources' header. Most courses should include this.policies/policiesAll.html
- lists policies related to CSU Principles of Community, includes all policies.
General Useful Includes:
resources/eclipse.html
- eclipse install information.resources/intelliJ.html
- intelliJ install information including student account signup, and toolbox install.resources/teams.html
- resources about Microsoft Teams, including install recommendations and links to ACNS.resources/randomJavaLinks.html
- resources about random help / practice sites for java programming.grading/wholeGradesOnly.html
- table with the 60,70,80,90 grade scale (no +/- options)helpdesk.html
- MS Teams helpdesk instructionsclone.html
- Used for including a link to a git clone.
This include utilizes the following parameters,url
andtext
. url is required, and will insert the url of the git repository after >git clone. If text is included, a link will appear at the bottom based on the text. For example:
The following includes are all part of resources/university.html
resources/canvasTech.html
- information about technical support for canvas, usually not needed as already provided inresources/university.html
.resources/counseling.html
- information about counseling services, usually not needed as already provided inresources/university.html
.resources/tilt.html
- information about tilt and tutoring options for students, usually not needed as already provided inresources/university.html
.
The following includes are all part of policies/policiesAll.html
policies/cheating.html
- includes CMU cheating examplespolicies/copyrighted.html
- copyrighted material disclaimer from CSU Onlinepolicies/daca.html
- daca student resourcespolicies/diversityStatement.html
- CSU diversity statementpolicies/honorPledge.html
- CSU honorPledgepolicies/netiquette.html
- CSU netiquettepolicies/religious.html
- CSU religious observance policiespolicies/thirdParty.html
- CSU third party disclaimer on data collectionpolicies/title9.html
- CSU title 9 policies and resources for interpersonal violencepolicies/universalDesign.html
- CSU universal design commitment
The following _includes you don't usually need to directly include, as the layouts already include them
google-analytics.html
- Inserts Google Analytics module (active only in production environment).disqus_comments.html
- Code to markup disqus comment box.footer.html
- Defines the site's footer section. Contains standard CS department links, and uses the site description in the bottom right panel.head.html
- Code-block that defines the<head></head>
in default layout.header.html
- Defines the site's main header section. By default, pages with a definedtitle
attribute will have links displayed here.
If you wish to have external links (for example canvas login) in the top menu bar, put each
link in the _config.yml file under top-nav-external
. Each link
needs to have a title
and url
. For example:
top-nav-external:
- title: Canvas
url: http://canvas.colostate.edu
By including no-nav in your site data, the page will not show up in the navigation menu, even if the page is a top-level page. For example:
---
layout: page
title: Virtual Help Desk Instructions
no-nav: true
permalink: help-desk/
---
While jekyll defaults to alphanumeric order, by adding the order
attribute. For example:
---
layout: page
title: Resources
order: 3
permalink: resources/
---
The theme comes with a dynamic table that adjust based on screen size. An example of formatting of the table is as follows. The classes are essential.
<h2>Helpdesk Times</h2>
<table id="calendar">
<caption>For Su2020 all helpdesk hours will be online. See: <a href="/~cs150/.Summer20/help-desk/">help desk instructions</a></caption>
<tr class="weekdays">
<th id="time" scope="col">Time (MDT)</th>
<th scope="col">Sunday</th>
<th scope="col">Monday</th>
<th scope="col">Tuesday</th>
<th scope="col">Wednesday</th>
<th scope="col">Thursday</th>
<th scope="col">Friday</th>
<th scope="col">Saturday</th>
</tr>
<tr>
<td class="time">
8:00 AM
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="time">
9:00 AM
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="time">
10:00 AM
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="time">
11:00 AM
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="time">
12:00 PM
</td>
<td>
</td>
<td>
</td>
<td class="">
</td>
<td class="">
</td>
<td class="">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="time">
1:00 PM
</td>
<td>
</td>
<td class="">
</td>
<td class="">
</td>
<td class="">
</td>
<td class="">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="time">
2:00 PM
</td>
<td>
</td>
<td class="">
</td>
<td class="">
</td>
<td class="">
</td>
<td class="">
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="time">
3:00 PM
</td>
<td>
</td>
<td class="open">
<span class="day">M</span>
<span class="shift"> <a href="/~cs150/.Summer20/help-desk/">MS Teams</a></span>
</td>
<td class="open">
<span class="day">T</span>
<span class="shift"><a href="/~cs150/.Summer20/help-desk/">MS Teams</a></span>
</td>
<td class="open">
<span class="day">W</span>
<span class="shift"><a href="/~cs150/.Summer20/help-desk/">MS Teams</a></span>
</td>
<td class="open">
<span class="day">Th</span>
<span class="shift"><a href="/~cs150/.Summer20/help-desk/">MS Teams</a></span>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="time">
4:00 PM
</td>
<td>
</td>
<td class="open">
<span class="day">M</span>
<span class="shift"><a href="/~cs150/.Summer20/help-desk/">MS Teams</a></span>
</td>
<td class="open">
<span class="day">T</span>
<span class="shift"><a href="/~cs150/.Summer20/help-desk/">MS Teams</a></span>
</td>
<td class="open">
<span class="day">W</span>
<span class="shift"><a href="/~cs150/.Summer20/help-desk/">MS Teams</a></span>
</td>
<td class="open">
<span class="day">Th</span>
<span class="shift"><a href="/~cs150/.Summer20/help-desk/">MS Teams</a></span>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="time">
5:00 PM
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
</table>
To enable Google Analytics, add the following lines to your Jekyll site:
google_analytics: UA-NNNNNNNN-N
Google Analytics will only appear in production, i.e., JEKYLL_ENV=production
To display post-excerpts on the Home Page, simply add the following to your _config.yml:
show_excerpts: true
csu-cs comes with the following plugins:
-
jekyll-seo-tag
plugin preinstalled to make sure your website gets the most useful meta tags.
See usage to know how to set it up. -
jekyll-feed
- A Jekyll plugin to generate an Atom (RSS-like) feed of your Jekyll posts
Bug reports and pull requests are welcome on GitHub at https://github.com/Dept-of-Computer-Science/jekyll-theme-csu-cs. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the Contributor Covenant code of conduct.
To set up your environment to develop this theme, run bundle install
.
Your theme is setup just like a normal Jekyll site! To test your theme, run bundle exec jekyll serve
and open your browser at http://localhost:4000
. This starts a Jekyll server using your theme.
Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications
to your theme and to your content, your site will regenerate and you should see the changes in the browser
after a refresh, just like normal.
The theme is available as open source under the terms of the MIT License.
- jekyll-minima - The style sheet, and svg icons are based off their original theme. Analytics comes from minima theme.
- jekyll-feed - Included as part of the gem bundle
- jekyll-seo - Included as part of the gem bundle