From 916c51c19c3aa5406cf1d5062f10a0b858f487cc Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Wed, 29 Jun 2022 06:21:25 +0000
Subject: [PATCH] Merge pull request #150 from aidenybai/bump-million
---
content/notes/config.md | 85 +++++++++++++++++++++++++++++++++++++++++-
1 files changed, 83 insertions(+), 2 deletions(-)
diff --git a/content/notes/config.md b/content/notes/config.md
index a5c194f..c9cbd0a 100644
--- a/content/notes/config.md
+++ b/content/notes/config.md
@@ -12,6 +12,7 @@
```yaml
name: Your name here! # Shows in the footer
enableToc: true # Whether to show a Table of Contents
+enableLinkPreview: true # whether to render card previews for links
description: Page description to show to search engines
page_title: Quartz Example Page # Default Page Title
@@ -22,6 +23,68 @@
link: https://github.com/jackyzha0
```
+### HTML Favicons
+
+A Favicon is most commonly seen as the **image preceding the URL in a browser**.
+Some other examples include (but are not limited to) bookmarks, search history,
+and app icons (i.e. "save page to home screen" on mobile devices).
+[File format support](https://en.wikipedia.org/wiki/Favicon#File_format_support)
+and the [use of favicons](https://en.wikipedia.org/wiki/Favicon#Use_of_favicon)
+differ across the combination of platforms and browsers.
+
+If you would like to customize the favicons of your quartz-based website, you
+can add them to the `data/config.yaml` file. The **default** without any set
+`favicon` key is:
+
+```html
+<link rel="shortcut icon" href="icon.png" type="image/png">
+```
+
+The default can be overridden by defining a value to the `favicon` key in your
+`data/config.yaml` file. Here is a `List[Dictionary]` example format, which is
+equivalent to the default:
+
+```yaml
+favicon:
+ - { rel: "shortcut icon", href: "icon.png", type: "image/png" }
+# - { ... } # Repeat for each additional favicon you want to add
+```
+
+In this format, the following keys are available:
+- `rel`: The `rel` attribute of the `<link>` tag.
+- `type`: The `type` attribute of the `<link>` tag.
+- `href` (optional): The `href` attribute of the `<link>` tag.
+- `sizes` (optional): The `sizes` attribute of the `<link>` tag.
+
+If you plan to add multiple favicons generated by a website (see list below), it
+may be easier to define it as HTML. Here is an example which appends the
+**Apple touch icon** to quartz's default favicon:
+
+```yaml
+favicon: |
+ <link rel="shortcut icon" href="icon.png" type="image/png">
+ <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
+```
+
+This second favicon will now be used as a web page icon when someone adds your
+webpage to the home screen of their Apple device. If you are interested in more
+information about the current, and past, standards of favicons, you can read
+[this article](https://www.emergeinteractive.com/insights/detail/the-essentials-of-favicons/).
+
+Some websites that **generate favicons** for you (ordered alphabetically) include:
+- [`favicon.io`](https://favicon.io/)
+- [`realfavicongenerator.net`](https://realfavicongenerator.net/)
+- [`www.favicon.cc`](https://www.favicon.cc/)
+
+These sites will take a base image and generate a set of favicons for you,
+one of which will be, for example, the `apple-touch-icon` favicon. These sites
+will often **also provide the HTML** for the favicon, which can be simply
+added to the `data/config.yaml` using the HTML format of the `favicon`
+argument.
+
+**Note** that all generated favicon paths, defined by the `href`
+attribute, are relative to the `static/` directory.
+
### Graph View
To customize the Interactive Graph view, you can poke around `data/graphConfig.yaml`.
@@ -36,7 +99,7 @@
## Styling
-Want to go even more in-depth? You can add custom CSS styling and change existing colours through editing `assets/custom.scss`. If you'd like to target specific parts of the site, you can add ids and classes to the HTML partials in `/layouts/partials`.
+Want to go even more in-depth? You can add custom CSS styling and change existing colours through editing `assets/styles/custom.scss`. If you'd like to target specific parts of the site, you can add ids and classes to the HTML partials in `/layouts/partials`.
### Partials
Partials are what dictate what actually gets rendered to the page. Want to change how pages are styled and structured? You can edit the appropriate layout in `/layouts`.
@@ -45,4 +108,22 @@
More info about partials on [Hugo's website.](https://gohugo.io/templates/partials/)
-Still having problems? Checkout our [FAQ and Troubleshooting guide](notes/troubleshooting.md).
\ No newline at end of file
+Still having problems? Checkout our [FAQ and Troubleshooting guide](notes/troubleshooting.md).
+
+## Multilingual
+[CJK + Latex Support (测试)](notes/CJK%20+%20Latex%20Support%20(测试).md) comes out of the box with Quartz.
+
+Want to support languages that read from right-to-left (like Arabic)? Hugo (and by proxy, Quartz) supports this natively.
+
+Follow the steps [Hugo provides here](https://gohugo.io/content-management/multilingual/#configure-languages) and modify your `config.toml`
+
+For example:
+
+```toml
+defaultContentLanguage = 'ar'
+[languages]
+ [languages.ar]
+ languagedirection = 'rtl'
+ title = 'مدونتي'
+ weight = 1
+```
--
Gitblit v1.10.0