Hugo site via blogdown doesn't render stylesheet due to http/https protocol

62 views Asked by At

[Added Docker tag since it looks like running rstudio in Docker is what's causing the issue described in my post]

I recently posted about an issue I'm having rendering a stylesheet (deleting the old post at the time of posting this new one) on a new Hugo site made via R's blogdown package. Since posting there I have new info and created a repo for reproducibility.

When building a new site with a theme that I like, the styling does not match on the version created locally. The reason is that a particular stylesheet does not render, in the console I see a message:

stylesheet could not be loaded http://localhost:4321/css/styles.min.64a6643395c6.....

Presumably this is due to the http protocol. The other stylesheets are using https:

enter image description here

enter image description here

To recreate:

  1. clone the repo

  2. docker-compose build; docker-compose pull, docker-compose up -d

  3. In the browser go to http://localhost:8787/ and login with creds user: rstudio, password: test. You should see the rstudio console after logging in.

  4. Run the following line of R code in the console:

    blogdown::new_site(theme = "miguelsimoni/hugo-initio")

In the viewer pane you can click 'show in new window' and a tab should open with the site running on local: enter image description here

Then, if you open the console and either look at the style editor tab of the console you should see the error about not being able to load the stylesheet, or just type document.styleSheets into the console and you should see that one of them, /css/styles.min.64a6643395c6..... is using http not https.

Here's sessionInfo()

xfun::session_info('blogdown')
R version 4.2.2 (2022-10-31)
Platform: x86_64-pc-linux-gnu (64-bit)
Running under: Ubuntu 22.04.1 LTS, RStudio 2022.7.2.576

Locale:
  LC_CTYPE=en_US.UTF-8       LC_NUMERIC=C               LC_TIME=en_US.UTF-8       
  LC_COLLATE=en_US.UTF-8     LC_MONETARY=en_US.UTF-8    LC_MESSAGES=en_US.UTF-8   
  LC_PAPER=en_US.UTF-8       LC_NAME=C                  LC_ADDRESS=C              
  LC_TELEPHONE=C             LC_MEASUREMENT=en_US.UTF-8 LC_IDENTIFICATION=C       

Package version:
  base64enc_0.1.3  blogdown_1.13    bookdown_0.29    bslib_0.4.1      cachem_1.0.6     digest_0.6.30   
  evaluate_0.17    fastmap_1.1.0    fs_1.5.2         glue_1.6.2       graphics_4.2.2   grDevices_4.2.2 
  highr_0.9        htmltools_0.5.3  httpuv_1.6.6     jquerylib_0.1.4  jsonlite_1.8.3   knitr_1.40      
  later_1.3.0      magrittr_2.0.3   memoise_2.0.1    methods_4.2.2    mime_0.12        promises_1.2.0.1
  R6_2.5.1         rappdirs_0.3.3   Rcpp_1.0.9       rlang_1.0.6      rmarkdown_2.17   sass_0.4.2      
  servr_0.24       stats_4.2.2      stringi_1.7.8    stringr_1.4.1    tinytex_0.42     tools_4.2.2     
  utils_4.2.2      xfun_0.34        yaml_2.3.6      

Hugo version: 0.92.2

The demo site for the theme loads this stylesheet OK. How can I get this stylesheet to render on local?

[EDIT]

Per suggestion in the comments, I tried updating to the latest version of hugo, but this introduces a new error when trying to build:

blogdown::hugo_version()
[1] ‘0.114.1’
> blogdown::build_site(build_rmd = T)
Rendering content/post/2020-12-01-r-rmarkdown/index.Rmd... Warning message:
In do_once((if (is_R_CMD_check()) stop else warning)("The function xfun::isFALSE() will be deprecated in the future. Please ",  :
  The function xfun::isFALSE() will be deprecated in the future. Please consider using base::isFALSE(x) or identical(x, FALSE) instead.
Done.
Start building sites … 
hugo v0.114.1-e9b716ad9869b79e7c374bbdae4daf5ee6406bd4+extended linux/amd64 BuildDate=2023-06-23T11:02:58Z VendorInfo=gohugoio

ERROR render of "page" failed: "/home/rstudio/themes/hugo-initio/layouts/_default/single.html:13:84": execute of template failed: template: _default/single.html:13:84: executing "main" at <.Site.Params.DateForm>: invalid value; expected string
Total in 44 ms
Error: error building site: render: failed to render pages: render of "page" failed: "/home/rstudio/themes/hugo-initio/layouts/_default/single.html:13:84": execute of template failed: template: _default/single.html:13:84: executing "main" at <.Site.Params.DateForm>: invalid value; expected string
Warning message:
In do_once((if (is_R_CMD_check()) stop else warning)("The function xfun::isFALSE() will be deprecated in the future. Please ",  :
  The function xfun::isFALSE() will be deprecated in the future. Please consider using base::isFALSE(x) or identical(x, FALSE) instead.

My config.yaml looks like this:

baseURL: /
languageCode: en
title: Initio - Free, multipurpose html5 template by GetTemplate
theme: hugo-initio
params:
  DateForm: January 2, 2006
  address: 234 Hidden Pond Road, Ashland City, TN 37015
  author: Sergey Pozhilov (GetTemplate.com)
  avatar: images/guy.jpg
  avatarclass: circle
  background: ''
  banner: images/bg_head.jpg
  description: A mystery person
  disqus:
    site: hugo-initio-site.disqus.com
  email: [email protected]
  favicon: images/gt_favicon.png
  google:
    analytics:
      trackerID: GA-000000000-0
  name: Anthony Russel
  phone: +234 23 9873237
  sharethis:
    custom: yes
    property: '123456789012345678901234'
  showClients: yes
  showDownloads: yes
  showFooterContact: yes
  showFooterFollowMe: yes
  showFooterFormWidget: yes
  showFooterTextWidget: yes
  showRecentWorks: yes
  showServices: yes
  showSubheader: yes
  social:
    - footer: yes
      icon: fab fa-facebook-square
      network: facebook
      sharethis: yes
      title: facebook
      url: https://www.facebook.com/nickname
    - footer: yes
      icon: fab fa-twitter-square
      network: twitter
      sharethis: yes
      title: twitter
      url: https://twitter.com/nickname
    - footer: yes
      icon: fab fa-instagram
      network: ''
      sharethis: no
      title: instagram
      url: https://www.instagram.com/nickname
    - footer: no
      icon: fab fa-google-plus-square
      network: googleplus
      sharethis: yes
      title: google+
      url: https://plus.google.com/+nickname
    - footer: no
      icon: fab fa-linkedin
      network: linkedin
      sharethis: yes
      title: linkedin
      url: https://www.linkedin.com/in/nickname
    - footer: no
      icon: fab fa-tumblr-square
      network: tumblr
      sharethis: no
      title: tumblr
      url: https://nickname.tumblr.com
    - footer: yes
      icon: fab fa-github
      network: ''
      sharethis: no
      title: github
      url: https://github.com/nickname
    - footer: no
      icon: fas fa-envelope-square
      network: email
      sharethis: yes
      title: email
      url: mailto:[email protected]
  year: 2017
menu:
  main:
    - name: home
      url: /
      weight: 1
    - name: blog
      url: /post/
      weight: 5
0

There are 0 answers