...

Assignment

This is an example page for your course documentation. Edit it and commit your changes directly to the main branch of the repository in your aalto.version.fi GitLab repository.

Images

You can include and image to your page like this:

![Detail image](./images/circuit.png)

The syntax above is for standard markdown formatting, but I recommend you do it like the example below that makes the image also clickable. Clicking on the image opens up a larger version of it.

[![Detail image](./images/circuit.png)](./images/circuit.png)

Detail image

Code

You can add code inside the code fences. The letter c after the three backticks means that the syntax highlighting will use the programming language c as the rules on how different parts of the text should be highlighted.

void setup(){  
  // Arduino setup code here to run once  
}  

void loop(){  
  // Arduino loops repeats as long as there is power  
}

Video

Vimeo or YouTube

If you want to include a video from Vimeo or YouTube, you can use these shortcodes. The numbers/characters is the ID of the video.

{{<vimeo id="84880475" class="video">}}

If you are reading the .md file, the line below is the actual way you use it your page. If you are reading the website, you should see a video player below this.

{{<youtube id="dQw4w9WgXcQ" class="video">}}

If you are reading the .md file, the line below is the actual way you use it your page. If you are reading the website, you should see a video player below this.

Video file in the repository

You can add video files also directly to your site. The recommended way to do this is to use the hugo-video component that we have installed on the site.

Keep in mind a couple of rules:

  • The video needs to be in a folder called video inside the folder where your index.md file is.
  • Your video file needs to be very small so that it fits into the GitLab repository. Maximum size is 50MB, but ideally it should be even much smaller (under 10 MB). You can use the free tool HandBrake to convert your video to a smaller size.
  • Use .mp4 as the file format

Once you have your file ready and placed correctly, you can use the following code snippet to display your video:

<video controls width=100%>
  <source src ="./video/example-video.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

Just update the filename to be correct. Here is the result: