Quarto Test

Quarto
This post is has some quarto notes for myself and others wanting to build a similar website!
Published

2 September 2025

Logos

To get logos we need to install academicons:

quarto install extension schochastics/academicons

This allows use of things like the Google Scholar icon. See link for example icons.

The posts/_metadata.yml file gives the shared options for posts see

Selecting correct conda envirnoment

For VS Code, sometimes the wrong conda envirnoment can be selected. The following needs to be done:

  1. Open VS Code and click on the Command Palette1
  2. Type and select Python: Select Interpreter

1 Ctrl + Shift + P or Cmd + Shift + P

Live Python code

quarto-pyodide allows for pyodide-enabled code within a Quarto HTML document.

To install:

quarto add coatless-quarto/pyodide

The usage is then simply:

Show a molecule

Plot HTML of a molecular system:

Plot HTML of a molecular system with a border and different width & height:

Shiny

Shiny is a Python library for building interactive web apps. See the quarto dashboards-dashboard overview. Pay close attention to the context: setup method, as it will affect the efficiency of the website.

Giscus

Giscus allows for comments on blog post by leveraging GitHub discussions. This allows for vistors who have GitHub to leave comments on blog posts.

Scripting

In the _quarto.yml file in the root of a project the pre-render term can be set such that a python file (or other) is run before building the website. I use this functionality to run prepare.py, which extracts all my publications listed in papers/publications.bib and outputs the corresponding papers/publications.yml and papers/publications.qmd.

Citation

BibTeX citation:
@misc{ralli2025,
  author = {{Alexis Ralli}},
  title = {Quarto {Test}},
  date = {2025-09-02},
  langid = {en-GB}
}
For attribution, please cite this work as:
Alexis Ralli. 2025. “Quarto Test.”