I am creating a distill website using rmarkdown and would like to add a submenu in the navigation bar. I found this feature request/issue on GitHub but have not been able to find a solution.
With the below _site.yml and index.Rmd the submenu text appears in the menu dropdown but is greyed-out and not clickable/selectable.
_site.yml:
name: "submenuTest"
title: "Submenu test"
description: |
Submenu test
output_dir: "_site"
navbar:
right:
- text: "Home"
href: index.html
- text: 'Menu'
menu:
- text: 'Page'
href: page.html
- text: 'Submenu'
menu:
- text: 'Sub Page'
href: subpage.html
output: distill::distill_article
index.Rmd:
---
title: "Submenu test"
description: |
Welcome to the website. I hope you enjoy it!
site: distill::distill_website
---
# here is my page content
In a plain rmarkdown .html (can use the above .yml and .Rmd examples but without the output: distill::distill_article and site: distill::distill_website lines) renders with a workable submenu.
Related
I have something like this and I want to add an image.png as an icon. Where the image icon should have the same width and length as fontawesome icons. Many thaks in advance.
name: my-website
output_dir: docs
navbar:
title: My Website
left:
- text: Home
href: index.html
- text: About
href: about.html
- text: Readings
icon: DIRECTORY.OF.MY.IMAGE.PNG
menu:
- text: Module 1
icon: fa-pepper-hot # ICON IN THE DROPDOWN MENU IS NOT WORKING.
href: readings-module1.html
- text: Module 2
href: readings-module2.html
- text: Module 3
href: readings-module3.html
- text: Module 4
href: readings-module4.html
output:
html_document:
theme: yeti
You will have to add your custom CSS that has rules to replicate fontawesome icons settings for your PNG image.
I find rmarkdown sites interesting, but I would like to change from most example I have seen and I haven't found something yet.
I try to make a repoducible example:
folder struture:
project_folder
\_ _site.yml
\_ index.rmd
\_ script.R
\_ templates
\_pages.rmd
I yml file alows to make the structure: I would like to have a website with the following categories (this an example of my _site.yml):
name: "website"
navbar:
title: "website"
left:
- text: "global info"
href: index.html
- text: "species"
menu:
- text: "all species result"
href: all.html
- text: "---------"
- text: "versicolor"
href: versicolor_1.html
- text: "setosa"
href: setosa.html
then an index.rmd (here just a title in order to keep the example simple).
---
title: Some stuff
---
a template page like page.rmd in a template folder (very simple as well but it uses a parameter.
---
params:
data_set:
title: "Region results"
---
hist(param$dataset$Sepal.Length)
and a "script" like, to render the site and then all pages except index.
markdown::render_site()
# import data
species = c("versicolor", "setosa")
# filter data and render page
for (i in 1:nrow(species)){
data_filtered <- dplyr::filter(iris, species == species[i])
rmarkdown::render("templates/page.rmd.Rmd", params = list(
data_set = data_filtered,
output_file = paste0("../_site/", pages$species[i], ".html"))
}
Right now, I don't get the header on top of my html as I am not using the common structure....
I could also use another option (R based) if you have ideas. shiny isn't the best option.
Thank you!
I have a navbar defined in the _site.yml file:
name: "Rmarkdown with navbar"
output_dir: "."
navbar:
title: "Data Analysis"
type: inverse
right:
- text: "Abstract"
href: https://www.stackoverflow.com
- text: "Data Preparing"
href: https://www.stackoverflow.com
- text: "Related Plots"
href: https://www.stackoverflow.com
- text: "Player Selection"
href: https://www.stackoverflow.com
- text: "Conclusion"
href: https://www.stackoverflow.com
output:
html_document:
theme: spacelab
highlight: textmate
I would like to be able to navigate to each section in my main rmd file, each section is defined as:
<section id="name-of-section">
I tried the following but it doesn't work (in the _site.yml file).
right:
- text: "Abstract"
href: #abstract
I would really appreciate any help. It would be even better if I could add navigation animation when clicking (I know it's achievable using jQuery in websites).
Have you try just adding titles and subtitles to your markdown with '#' and "##' and then search for any section in "online document" (Crtl + Shift + "O")
Or you want a navigation panel on the markdown's output document?
If this is the case, have you try something like this at the beginning of your markdown?
---
title: "El Code-Book de Guibi"
output:
html_document:
toc: yes
toc_depth: 5
toc_float: yes
pdf_document:
toc: yes
toc_depth: '5'
editor_options:
markdown:
wrap: 72
---
In my case, it shows output like this:
I'm using the (wonderful) academic hugo theme to create a website. It comes with some example posts, and each of these show up in the post list accompanied by a thumbnail image. These posts are all .md files and include the following in their front matter:
# Featured image
# To use, add an image named `featured.jpg/png` to your page's folder.
# Placement options: 1 = Full column width, 2 = Out-set, 3 = Screen-width
# Focal point options: Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight
image:
placement: 2
caption: 'Image credit: [**Unsplash**](https://unsplash.com/photos/CpkOjOcXdUY)'
focal_point: ""
preview_only: false
I have followed the instructions and have a "featured.png" in my page's folder. My Rmd's yaml header looks like so:
---
title: "my title"
author: "Kyle Ward"
date: 2019-08-28
categories: ["R"]
tags: ["R Markdown", "packages"]
image:
placement: 2
caption: ""
focal_point: ""
preview_only: false
projects: ["my-project"]
---
The image thumbnail doesn't show up like all the other .md example posts. The other yaml tags work. For instance, my post is associated with "my-project", it has the right author info, etc. What am I doing wrong?
Thanks for your help!
Normally, you will also need to add the thumbnail option to your .md file header, in your case:
---
title: "my title"
thumbnail: "page_folder/featured.jpg"
... other params ...
---
I've used the super versatile Rmarkdown package to create a site for a set of seminars extracted and modified using R.
The _site.yml file looks like this
name: "Seminars at Biostatistics, UCPH"
exclude: ["*.Rmd*", "*.json", "Makefile"]
navbar:
title: "Seminars # Biostatistics, UCPH"
left:
- text: "Upcoming seminars"
icon: fa-lightbulb-o
href: index.html
- text: "Previous seminars"
icon: fa-calendar
href: previous.html
right:
- icon: fa-question fa-lg
href: http://biostat.ku.dk
output:
html_document:
theme: readable
highlight: textmate
include:
after_body: footer.html
toc: true
toc_float: true
css: style.css
When the page is printed on paper then the table-of-content is overlapping the main text which makes it rather useless.
Is it possible to remove the toc when printing? Either directly through arguments in the yaml or possibly through css and #media commands
Of course. In your stylesheet:
#media print {
#TOC { display: none; }
}