VersBinarii/hermit_zola

Some features proposals

Closed this issue · 2 comments

Hi folks !

I didn't want to bother you with some pull request with features you didn't want. Then I forked the repository and made these features in my own fork.

My first intentions were to play with Zola and this theme, and not to maintain my own fork.

If you want to have these you can pick these from this : https://github.com/pawndev/hermit_zola/pulls?q=is%3Apr+is%3Aclosed

New features

highlightjs

You can enable highlightjs to replace the built-in syntax high lighting.
But, make sure to disable the built-in syntax highlighting.
In your config.toml

highlight_code = false

[extra.highlightjs]
enable = true

You can change the highlightjs theme with this:

highlight_code = false

[extra.highlightjs]
enable = false
theme = "vs2015"

For all themes, see: https://unpkg.com/browse/highlightjs-badge@0.1.9/highlightjs/styles/

clipboard

You can enable the display of a button to copy the content of a pre>code tag.

Custom buttom

This will display a "copy" button on the bottom of each pre tag.
Only when highlightjs is disable.

highlight_code = true
       
[extra.highlightjs]
enable = false

With highlightjs

Enable it in the highlightjs config block.

highlight_code = false

[extra.highlightjs]
enable = true
clipboard = true

Jupyter notebook

You can display a jupyter notebook from a ipynb file. Only if you have enable highlightjs

highlight_code = false

[extra.highlightjs]
enable = true
clipboard = true
theme = "vs2015"
notebook = true

Featured image

You can add a background image when you set an extra variable in a page section:

+++
title="Test bg image"
date=2020-10-14
draft=false

[taxonomies]
tags=["test", "image"]

[extra]
featuredImg = "https://picsum.photos/1024/768/?random"
+++

Shortcodes

Figure

This theme provide a figure shortcode. You can use it like this:

{{ figure(src="https://via.placeholder.com/1600x800",
          class="big"
          caption_position="center",
          caption="figure-big",
          caption_style="font-style: italic;") }}
  • src: The url of the image
  • class: Can be "big" | "left" | "right" (default to "") This define how to display the image
  • caption_position: Can be "center" | "left" | "right" (default to "center")
  • caption: string, describe the image
  • caption_style: Custom CSS style to apply to caption

image

This theme provide a image shortcode. You can use it like this:

{{ image(src="https://via.placeholder.com/1600x800", class="boulou" alt="Hello Friend", style="border-radius: 8px;") }}
  • src: The url of the image
  • class: You can apply class to the current img
  • alt: The alt of the image
  • style: Custom CSS style to apply on the img element

Fix footnotes css

In an article you can do footnotes like this:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.[^1]

> An apple is a sweet, edible fruit produced by an apple tree (Malus pumila). Apple trees are cultivated worldwide, and are the most widely grown species in the genus Malus. The tree originated in Central Asia, where its wild ancestor, Malus sieversii, is still found today. Apples have been grown for thousands of years in Asia and Europe, and were brought to North America by European colonists. Apples have religious and mythological significance in many cultures, including Norse, Greek and European Christian traditions.[^2]

[^1]: From [https://www.lipsum.com/](https://www.lipsum.com/)

[^2]: From [https://en.wikipedia.org/wiki/Apple](https://en.wikipedia.org/wiki/Apple)

I just started with Zola, if you see some mistakes in my repository, please tell me on issue or made a PR 😃

Thanks for the suggestions . I totally stole the syntax highlighting from your fork ;)

If it can help, my pleasure :)