Quarto Extension

Quarto is amazing, for reproducable reports, quick dashboards, websites and blogging sites like mine. Quarto has an extension ecosystem as well, so I started playing with these extensions, thus, this post will document some of example works around these extensions.

Share-post

This is an amazing extions that can add a social media post to your document. I wish they had named it Embed-post rather than share-post. Below is an example.

My Linkedin post:

Below is the markdown of the above post (it does not appear till the time I add space between {{ and <.)

{{ < share-post https://www.linkedin.com/feed/update/urn:li:activity:7335234505370169344 > }}

Ooops, markdown is not appearing, not sure why.

I tried Twitter post, initially had some challages and still it is not working.

Twitter post as markdown and it does not appear till the time I add space between {{ and <.

{{ < share-post https://x.com/mnabiahmad/status/1790665983985586553 > }} 

Somehow the twitter post is not appearing, thus, I tired using twitter’s embed option and it shows (see below).

For UKPack NbS project (funded by UKPack), @CIFOR_ICRAF conducted a capacity building workshop at county level to leverage citizen science for critical data collection to help in decision making.@OfficialMakueni, @UKinKenya, @lawinowiecki#RegreeningApp pic.twitter.com/75BGH6BCBb

— Muhammad Ahmad (@mnabiahmad) May 15, 2024

Quarto social share

Quarto social share is an other amazing extension. I am using this extension in this post as well so you can check at the bottom.

It is very easy to use and the offical github repo expians everything.

Quarto Badges

Qyarto Badges are small visual improvement but looks cool and has option of becoming a link.

First install the extions using quarto add mcanouil/quarto-badge command. Second, defind badge style either in the post under extension heading (see code section below) or in _quarto.yml file.

.
.
extensions:
  badge:
    - key: current
      colour: springgreen
      href: https://github.com/mcanouil/quarto-badge/releases/tag/{{value}}

Some examples, current badge 1.0.0, future badge 2.0.0, old badge 0.1.0, hmm old page is not appearing .

Lightbox

Allow photos to appear in separate popup (and a bit of zoom-in on photos), no need of installation as this extension is now part of deafult installation. You can read more about at Light box repo

An example below

Image using lightbox extension

The best part is that it can be used with code block as well, see the code block below. Note you also need R extension to run R code in VSCode. Of course, you need to install R on your machine + rmarkdown and languageserver package in R by using install.packages("rmarkdown").

#| fig-cap: Simple demo R plot 
#| lightbox:
#|   group: r-graph
#|   description: This is 1 to 10 plot
plot(1:10, rnorm(10))

plot(1:10, rnorm(10))

Simple demo R plot

Python require jupyter extension (working on it as it is a bit complicated, require jupyter package)

import matplotlib.pyplot as plt

# 1. Prepare data (if only one list is provided, it is used for the y-axis, 
#    and the x-axis defaults to the index starting at 0)
y_values = [1, 4, 2, 3]

# 2. Create and customize the plot
plt.plot(y_values) # Plots the data on the Axes
plt.xlabel('X-axis Label') # Adds a label to the x-axis
plt.ylabel('Y-axis Label') # Adds a label to the y-axis
plt.title('My Simple Matplotlib Plot') # Adds a title
plt.grid(True) # Adds a grid for better visualization

# 3. Display the plot
plt.show() # Shows the figure window

quarto-quizdown

This extension deserves a post of its own,github repo for Quiz down.

This is 1 to 10 plot