example post

content/post/2019-12-20-informative-title/index.Rmd

@@ -0,0 +1,86 @@
+---
+slug: informative-title
+title: Your Post Title in Title Case
+authors:
+  - Julia Romanowska
+date: 2019-12-20
+tags:
+- package development
+output: 
+  html_document:
+    keep_md: true
+---
+
+> This post was contributed by [Julia Romanowska](https://www.uib.no/en/persons/Julia.Romanowska), Researcher at the University of Bergen, Norway. Thank you, Julia!
+
+```{r setup, include=FALSE}
+knitr::opts_chunk$set(fig.path = "", comment = "")
+
+knitr::knit_hooks$set(
+  plot = function(x, options) {
+    hugoopts <- options$hugoopts
+    paste0(
+      "{{<figure src=",
+      '"', x, '" ',
+      if (!is.null(hugoopts)) {
+        glue::glue_collapse(
+          glue::glue('{names(hugoopts)}="{hugoopts}"'),
+          sep = " "
+        )
+      },
+      ">}}\n"
+    )
+  }
+)
+```
+
+The figure paths in the resulting Markdown will already be valid so you won't need to edit the Markdown file.
+
+Introduction including outline of the post.
+
+## First section
+
+I like Hugo[^1]. Yes, that is how you add a footnote.
+
+### First subsection
+
+Below is an image, for instance your package logo, or a cute puppy picture. Here's how to use a Hugo shortcode to include it. You must use the exact same syntax as below i.e. with the html preserve comments and percent signs, otherwise the knitting will break the syntax. You can use [all options documented for the figure shortcode](https://gohugo.io/content-management/shortcodes/#figure).
+
+<!--html_preserve--> {{% figure src = "name-of-image.png" width = "200" alt = "this is the alternative text" %}}
+<!--/html_preserve-->
+
+Here's how to introduce the same image but centered and bigger. Notice ` width = "400"` and `class = "center"`.
+
+<!--html_preserve--> {{% figure src = "name-of-image.png" width = "400" alt = "this is the alternative text" class = "center" %}}
+<!--/html_preserve-->
+
+And here's how you'd pull it to the right. Notice `class = "pull-right"`.
+
+<!--html_preserve--> {{% figure src = "name-of-image.png" width = "200" alt = "this is the alternative text" class = "pull-right" %}}
+<!--/html_preserve-->
+
+Below is another image, a plot generated by a code chunk, so you might see how to add alternative text and other options in this case. You can also use [all options documented for the figure shortcode](https://gohugo.io/content-management/shortcodes/#figure) except for `src` that will be created automatically when knitting.
+
+```{r chunkname, hugoopts=list(alt="alternative text please make it informative", title="title of the image", caption="this is what this image shows, write it here or in the paragraph after the image as you prefer", width=300)}
+plot(1:10)
+```
+
+
+Once this file is knitted the plot above will be inserted with the correct syntax.
+
+### Second subsection
+
+Here's how to use a Hugo shortcode to embed a tweet. We recommend the use of [Hugo shortcodes](https://gohugo.io/content-management/shortcodes/) to include tweets, Vimeo or Youtube videos, gists, etc. Again, use the exact same syntax as below i.e. with the html preserve comments and percent signs, otherwise the knitting will break the syntax.
+
+<!--html_preserve--> {{% tweet 1110477831019085824 %}}
+<!--/html_preserve-->
+
+## Conclusion
+
+Have fun writing your blog post!
+
+> Find Julia on Twitter, her website, blabla.
+
+Here's how to add the footnote text for your reference above.
+
+[^1]: Hugo! https://gohugo.io/

content/post/2019-12-20-informative-title/index.md

@@ -0,0 +1,70 @@
+---
+slug: informative-title
+title: Your Post Title in Title Case
+authors:
+  - Julia Romanowska
+date: 2019-12-20
+tags:
+- package development
+output: 
+  html_document:
+    keep_md: true
+---
+
+> This post was contributed by [Julia Romanowska](https://www.uib.no/en/persons/Julia.Romanowska), Researcher at the University of Bergen, Norway. Thank you, Julia!
+
+
+
+The figure paths in the resulting Markdown will already be valid so you won't need to edit the Markdown file.
+
+Introduction including outline of the post.
+
+## First section
+
+I like Hugo[^1]. Yes, that is how you add a footnote.
+
+### First subsection
+
+Below is an image, for instance your package logo, or a cute puppy picture. Here's how to use a Hugo shortcode to include it. You must use the exact same syntax as below i.e. with the html preserve comments and percent signs, otherwise the knitting will break the syntax. You can use [all options documented for the figure shortcode](https://gohugo.io/content-management/shortcodes/#figure).
+
+<!--html_preserve--> {{% figure src = "name-of-image.png" width = "200" alt = "this is the alternative text" %}}
+<!--/html_preserve-->
+
+Here's how to introduce the same image but centered and bigger. Notice ` width = "400"` and `class = "center"`.
+
+<!--html_preserve--> {{% figure src = "name-of-image.png" width = "400" alt = "this is the alternative text" class = "center" %}}
+<!--/html_preserve-->
+
+And here's how you'd pull it to the right. Notice `class = "pull-right"`.
+
+<!--html_preserve--> {{% figure src = "name-of-image.png" width = "200" alt = "this is the alternative text" class = "pull-right" %}}
+<!--/html_preserve-->
+
+Below is another image, a plot generated by a code chunk, so you might see how to add alternative text and other options in this case. You can also use [all options documented for the figure shortcode](https://gohugo.io/content-management/shortcodes/#figure) except for `src` that will be created automatically when knitting.
+
+
+```r
+plot(1:10)
+```
+
+{{<figure src="chunkname-1.png" alt="alternative text please make it informative" title="title of the image" caption="this is what this image shows, write it here or in the paragraph after the image as you prefer" width="300">}}
+
+
+Once this file is knitted the plot above will be inserted with the correct syntax.
+
+### Second subsection
+
+Here's how to use a Hugo shortcode to embed a tweet. We recommend the use of [Hugo shortcodes](https://gohugo.io/content-management/shortcodes/) to include tweets, Vimeo or Youtube videos, gists, etc. Again, use the exact same syntax as below i.e. with the html preserve comments and percent signs, otherwise the knitting will break the syntax.
+
+<!--html_preserve--> {{% tweet 1110477831019085824 %}}
+<!--/html_preserve-->
+
+## Conclusion
+
+Have fun writing your blog post!
+
+> Find Julia on Twitter, her website, blabla.
+
+Here's how to add the footnote text for your reference above.
+
+[^1]: Hugo! https://gohugo.io/