How can I get a secure https:// css citation style for my Distill website?

[kamaulindhardt]

Hi all,

I am building a website using the Distill package in RMarkdown. I absolutely love it so far! However I seem to be running into some issues with the css style im using as it does not use a secure https:// instead it gets the style using a http://

This is causing some security errors, that according to Netlify are quite serious and should be fixed. They are saying it’s Mixed Content as in, I am tying to load content over http:// instead of https:// when the original website (my website – I guess) is using https://. It’s important to use the latter for improved security. It looks like I am loading some fonts from Google, and that I should be able to simply change http:// to https://. But how to do this?

Anyone has an idea how to fix this?

This is the error I get on JavaScript in Google Chrome:

THANK YOU!

I am getting the citation style from this website: https://www.zotero.org/styles and I am using frontiers-in-ecology-and-the-environment.csl

The source code looks like this:

This XML file does not appear to have any style information associated with it. The document tree is shown below.

<style xmlns="http://purl.org/net/xbiblio/csl" class="in-text" version="1.0" default-locale="en-US" page-range-format="minimal">
<info>
<title>Frontiers in Ecology and the Environment</title>
<id>
http://www.zotero.org/styles/frontiers-in-ecology-and-the-environment
</id>
<link href="http://www.zotero.org/styles/frontiers-in-ecology-and-the-environment" rel="self"/>
<link href="http://www.zotero.org/styles/elsevier-harvard" rel="template"/>
<link href="http://www.frontiersinecology.org/instructions-to-authors/research-communications/" rel="documentation"/>
<author>
<name>Ben Gilna</name>
<email>[email protected]</email>
</author>
<contributor>
<name>Sebastian Karcher</name>
</contributor>
<category citation-format="author-date"/>
<category field="biology"/>
<issn>1540-9295</issn>
<eissn>1540-9309</eissn>
<summary>
ESA Journal Frontiers in Ecology and the Environment. Originally based on Fungal Ecology, which is now dependent
</summary>
<updated>2013-11-23T02:49:43+00:00</updated>
<rights license="http://creativecommons.org/licenses/by-sa/3.0/">
This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License
</rights>
</info>
<macro name="editor-translator">
<names variable="editor translator" prefix="(" suffix=")" delimiter=", ">
<name and="text" initialize-with="" delimiter=", "/>
<et-al font-style="italic"/>
<label form="short" prefix=", " text-case="capitalize-first" strip-periods="true"/>
</names>
</macro>
<macro name="author">
<names variable="author">
<name name-as-sort-order="all" sort-separator=" " initialize-with="" delimiter=", " and="text"/>
<et-al font-style="italic"/>
<label form="short" prefix=" (" suffix=")" text-case="capitalize-first" strip-periods="true"/>
<substitute>
<names variable="editor"/>
<names variable="translator"/>
<text macro="title"/>
</substitute>
</names>
</macro>
<macro name="author-short">
<names variable="author">
<name form="short" and="text" delimiter=", " initialize-with=". "/>
<et-al font-style="italic"/>
<substitute>
<names variable="editor"/>
<names variable="translator"/>
<choose>
<if type="bill book graphic legal_case legislation motion_picture report song" match="any">
<text variable="title" form="short"/>
</if>
<else>
<text variable="title" form="short" quotes="true"/>
</else>
</choose>
</substitute>
</names>
</macro>
<macro name="title">
<text variable="title"/>
</macro>
<macro name="publisher">
<group delimiter=": ">
<text variable="publisher-place"/>
<text variable="publisher"/>
</group>
</macro>
<citation collapse="year-suffix" et-al-min="3" et-al-use-first="1" disambiguate-add-year-suffix="true" year-suffix-delimiter=", ">
<sort>
<key variable="issued"/>
<key macro="author-short"/>
</sort>
<layout prefix="(" suffix=")" delimiter="; ">
<group delimiter=" ">
<text macro="author-short"/>
<date variable="issued">
<date-part name="year"/>
</date>
<group>
<label variable="locator" form="short"/>
<text variable="locator" prefix=" "/>
</group>
</group>
</layout>
</citation>
<bibliography hanging-indent="true" line-spacing="2" et-al-min="5" et-al-use-first="3">
<sort>
<key macro="author-short"/>
<key variable="issued"/>
</sort>
<layout>
<text macro="author" suffix="."/>
<date variable="issued" prefix=" " suffix=".">
<date-part name="year"/>
</date>
<choose>
<if type="bill book graphic legal_case legislation motion_picture report song" match="any">
<group suffix=".">
<text macro="title" prefix=" "/>
<text macro="editor-translator" prefix=" "/>
</group>
<text prefix=" " suffix="." macro="publisher"/>
</if>
<else-if type="chapter paper-conference" match="any">
<text macro="title" prefix=" "/>
<group prefix=".">
<group prefix=" In:">
<names variable="editor translator">
<name name-as-sort-order="all" sort-separator=" " initialize-with="" delimiter=", " delimiter-precedes-last="always" prefix=" "/>
<et-al font-style="italic"/>
<label form="short" prefix=" (" suffix="). " text-case="capitalize-first" strip-periods="true"/>
</names>
<text variable="container-title" prefix=" " suffix="."/>
<group suffix=".">
<text macro="publisher" prefix=" "/>
</group>
</group>
</group>
</else-if>
<else-if type="webpage">
<text macro="title" prefix=" "/>
<text variable="URL" suffix="."/>
<text value="Viewed" prefix=" "/>
<date variable="accessed" prefix=" " suffix="." delimiter=" ">
<date-part name="day"/>
<date-part name="month" form="short" strip-periods="true"/>
<date-part name="year"/>
</date>
</else-if>
<else>
<group suffix=".">
<text macro="title" prefix=" "/>
<text macro="editor-translator" prefix=" "/>
</group>
<group prefix=" " suffix=".">
<text variable="container-title" form="short" font-style="italic" strip-periods="true"/>
<group prefix=" ">
<text variable="volume" font-weight="bold"/>
</group>
<text variable="page" prefix=": "/>
</group>
</else>
</choose>
</layout>
</bibliography>
</style>

[cderv]

The error points to url for some fonts: rosarivo & incosolata. Are you using one of those ? Could it be used by your theme ? I don't think distill itself is using those.

Does this happens only when you are using the CSL file ? What is your YAML header exactly ? Are you using the CSL file from a url or is it a local file ?

We need more information in order to help.

Having access to your website source code could be helpful also.

As of now, I don't see a possible issue with the package, but maybe something with the configuration.

[kamaulindhardt]

I see 👀! Thanks @cderv ,

I have this YAML and there is not really any specified theme..

---
title: "Explorortive Data Analysis"
favicon: ./IMAGES/ERA_logo_circle.png
description: |
  On this page we are going to get more familiar [....]
bibliography: library.bib
csl: frontiers-in-ecology-and-the-environment.csl
output: 
  distill::distill_article:
    toc: true
    toc_float: true
    toc_depth: 3
    number_sections: true
    code_folding: true
---

[cderv]

Can you answer the other question ?

Does this happens only when you are using the CSL file ?

Have you the issue if you don't use the CSL file ?

I am trying to pinpoint the cause with your help. I'll need a reproducible example otherwise.