Distill website deployment on RStudio Connect does not render linked articles

I have a website capable of using various themes with RMarkdown (e.g., various pretty doc themes) deployed on RStudio Connect. I really like the distill theme, and would like to switch. I am able to deploy the app onto RStudio Connect using the build pane or distill::publish_website(). The index.Rmd page renders as expected, but any linked articles do not appear. From inspecting the source, I see it loads the html, but the page is blank (all white). Any ideas on how to properly render the site?

I'm not sure how to create a reprex for this issue given that several different files are involved, but I'm open to advice on how to create one.

1 Like

Hey @jameshwade thanks for the question on RStudio Connect + distill!

Can you clarify the "linked articles"?

I've just tested a minimal example of a distill blog on RStudio Connect and it seems to work ok with the blog posts as well.

Example blog on RStudio Connect

1 Like

Ah gotcha!

So along the lines of a Knowledge Repo/Wiki, rather than the linear blog. You can create more "website" style content with distill, and I've created internal Knowledge repos via the Website vs Blog start on our internal RStudio Connect.

It's an interesting use-case and I imagine that @apreshill would also be super interested in hearing about the specifics. I think the questions are:

  • Do you want to have a website with dropdown menus linking to other pieces of content or do you want a more traditional shared blog?
  • Can you collaborate via Version Control like Git/Github?

An example of one of the internal sites I've built via RMD. Note that you add knit content by name (content.html) vs a classical URL (connect.company.com/content.html). distill should be able to "build" the links for you.

This is the _site.yml file.

name: "distill_knowledge_repo"
title: "Knowledge Repo"
description: |
  Knowledge Repo
output_dir: "_site"
navbar:
  logo:
    image: images/logo.png
  right:
    - icon: fab fa-google-drive
      href: https://drive.google.com
    - icon: fa fa-calendar-alt
      href: https://calendar.google.com
    - text: "Workflow"
      href: workflow.html
    - text: "Demo"
      href: solutions.html
    - text: "Tools & Forms"
      menu:
        - text: "License Tools"
          href: license-tools.html
        - text: "Forms"
          href: forms.html
        - text: "---"
        - text: "Internal RSP/RSC"
          href: tools.html
        - text: "Feature Requests"
          href: feature-requests.html
    - text: "Docs"
      menu:
        - text: "Pro Products"
          href: pro-documentation.html
        - text: "Open Source"
          href: products-packages.html
        - text: "---"
        - text: "CS Guides"
          href: cs-guides.html
        - text: "Support Articles"
          href: support-articles.html
    - text: "Meetings"
      menu:
        - text: "Sol Eng Weekly"
          href: sol-eng-weekly.html
        - text: "Support Monthly"
          href: support-monthly.html
    - text: "Partners"
      menu:
        - text: "Resellers"
          href: reseller.html
        - text: "Partners"
          href: partner-info.html
    - text: "Contributing"
      href: contributing.html
output:
  distill::distill_article:
    css: styles.css
    toc: true
1 Like

Thank you for those details.

I found a possible cause, but I'm lost on how to fix it. Here is the top of the html files:

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang="">

<head>
  <meta charset="utf-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1"/>
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>
  <meta name="generator" content="distill" />

  <style type="text/css">
  /* Hide doc at startup (prevent jankiness while JS renders/transforms) */
  body {
    visibility: hidden;
  }
  </style>

If I remove the visibility: hidden;, the page will render but without css applied. Interestingly, that same html exists for the index.html file, but that page renders fine. I'm out of my depth here with html, but that looks to be part of my problem. I tried creating a theme with distill::create_theme() and specifying that file during rendering but no luck.

Hi @jameshwade,

This sounds like an interesting use case for Distill! I suspect you need to reknit individual (non-blog) articles to the distill::distill_article output format. And for maintaining, if you want a workflow where people add individual articles and they automatically populate to a listing page, you'll need to transition to articles organized as posts (https://rstudio.github.io/distill/blog.html#listing-pages) if you don't want to have to update a menu every time.

Thanks for the suggestion @apreshill. One complexity we have is that we have non-R users contributing to our site using markdown files. Not sure if this is worth noting, but it works as intended if we use a prettydoc template.

I haven't figured out a great workflow yet, but I'm going to keep playing around with the different options.

This topic was automatically closed 21 days after the last reply. New replies are no longer allowed.

If you have a query related to it or one of the replies, start a new topic and refer back with a link.

Hi @tom_rstudio, thanks for the link.

My issue may be from not using the "blog" format. The content was a community effort where we created interconnected articles that better match wiki style content versus linear blog posts. I saw that distill just got a significant update. I should have some time today to play around with it a bit more.

As an aside, people are genuinely blown away at work when we show them websites build with rmarkdown. It's such a fantastic tool.

1 Like