GitHub Pages GitHub Git Christophe Van Ginneken
Com
plex
ity
18:30 19:00 19:30 20:00 20:30 21:00 21:30
GitGitHubGitHub Pages
HTML Markdown
Jekyll
Layouts
Includes
Data
CVblog
Filters
• visit https://github.com
• provide username, email, password
• provide profile information (or not)
• confirm email !
christophevg.github.io
website
https://christophevg.github.io
https://christophevg.github.io/website
&
&
• create a new repository username.github.io
• create a new file index.html
• visit https://username.github.io
<html> <body> <h1>Christophe VG's website</h1> Welcome to my GitHub Pages website! </body> </html>
• create a new file _config.yml
• update index.html index.md
• visit https://username.github.io
--- --- # Christophe VG’s website Welcome to my GitHub Pages website! Using Markdown!
markdown: kramdown
don’t forget front matter
• create a new file _layouts/site.html
• update index.md
• visit https://username.github.io
<!DOCTYPE html> <html lang="en-us"> <head> <meta charset="UTF-8"> <title>My Website!</title> </head> <body> {{ content }} </body> </html>
--- layout: site ---
just try it !
• “overwrite site” using “automatic page generator”
• steal content from index.html
• reuse it in _layouts/site.html
• delete index.html
• visit https://username.github.io
under settings
{{ content }}
• add content to your website • extend index.md • create cv.md • upload a picture and add it to your site • start a blog • FIX stylesheet paths: add a leading “/“
• visit https://username.github.io
experiment
try things !
<ul>
{% for post in site.posts %}
<li>
<a href=“{{ post.url }}”>{{ post.title }}</a> {{ post.excerpt }}
</li>
{% endfor %}
</ul>
• create a new file_includes/posts.html
• create a new file_layouts/post.html
• change layout move titles to front matter(create excerpt)
• create a new fileblog/index.md
• visit https://username.github.io
<ul> {% for post in site.posts %} <li> <a href=“{{ post.url }}”>
{{ post.title }} </a>
{{ post.excerpt }} </li> {% endfor %} </ul>
--- layout: site --- # My Blog
{% include posts.html %}
--- layout: post title: First Post --- # First Post
--- layout: site --- <h2>{{ page.date }} - {{ page.title }}</h2> {{ content }}
• update_includes/posts.html
• updateindex.md
• add a few more blog entries
• improve date rendering in _layouts/post.html
• add date to index _includes/posts.html
• visit https://username.github.io
{% for post in site.posts limit: include.posts %}
{% include posts.html posts=“2” %}
{{ page.date | date_to_long_string }}
{{ post.date | date_to_string }} -<a href="{{ post.url }}">{{ post.title }}</a>
• create a new file_data/cv.yml
• updatecv.md
• visit https://username.github.io
- start: September 2015 end: August 2016 description: Embedded R&D Engineer company: University of Antwerp
- start: July 2014 end: August 2015 description: Researcher company: University of Leuven
{% for position in site.data.cv %}
## {{ position.description }} at {{ position.company }} {{ position.start }} - {{ position.end }}
{% endfor %}
• Slides http://www.slideshare.net/christophevg/git-hub-pages
• Git https://git-scm.com
• GitHub https://github.com
• GitHub Pages https://pages.github.com
• Markdown https://guides.github.com/features/mastering-markdown
• Jekyll https://jekyllrb.com (docs)
• Jekyll Template https://github.com/mmistakes/minimal-mistakes
@Christophe_VG
http://christophe.vgHave Fun
&
Good Luck ! '
(
&