Example: Custom font family for article content
By default, this theme uses Latoopen in new window for article content. This example shows how to use another font instead. For example, let's change article font family to Merriweatheropen in new window.
Create layouts/partials/head/custom.html
under your Hugo site folder, with following code:
<style>
/// Overwrite CSS variable
:root {
--article-font-family: "Merriweather", var(--base-font-family);
}
</style>
<script>
(function () {
const customFont = document.createElement('link');
customFont.href = "https://fonts.googleapis.com/css2?family=Merriweather:wght@400;700&display=swap";
customFont.type = "text/css";
customFont.rel = "stylesheet";
document.head.appendChild(customFont);
}());
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18