From c8f0304ade50185d085f39d474c6c9632606e240 Mon Sep 17 00:00:00 2001 From: Zef Hemel Date: Mon, 16 Jan 2023 12:06:37 +0100 Subject: [PATCH] Better onboarding page --- common/util.ts | 5 ++++- web/cm_plugins/wiki_link.ts | 2 +- website/Cloud Links.md | 5 +++++ website/Getting Started.md | 31 +++++++++++++++++++++++++++++++ 4 files changed, 41 insertions(+), 2 deletions(-) create mode 100644 website/Cloud Links.md create mode 100644 website/Getting Started.md diff --git a/common/util.ts b/common/util.ts index 237694c..2dc2cee 100644 --- a/common/util.ts +++ b/common/util.ts @@ -63,7 +63,10 @@ export async function ensureAndLoadSettings( } catch { await space.writePage( settings.indexPage, - `Welcome to your new space!`, + `Hello! And welcome to your brand new SilverBullet space! + + +`, ); } diff --git a/web/cm_plugins/wiki_link.ts b/web/cm_plugins/wiki_link.ts index 59edf7f..5a4c829 100644 --- a/web/cm_plugins/wiki_link.ts +++ b/web/cm_plugins/wiki_link.ts @@ -39,7 +39,7 @@ export function cleanWikiLinkPlugin(editor: Editor) { break; } } - if (cleanPage === "") { + if (cleanPage === "" || cleanPage.startsWith("💭")) { // Empty page name, or local @anchor use pageExists = true; } diff --git a/website/Cloud Links.md b/website/Cloud Links.md new file mode 100644 index 0000000..71ed325 --- /dev/null +++ b/website/Cloud Links.md @@ -0,0 +1,5 @@ +You can access the “markdown web” through SilverBullet directly. The idea of the the markdown web (we really need a better name) is simple: the Internet is a messy place — tracking everywhere, tons of banners and other stuff — let’s bring it back to the basics. How about Markdown? + +SilverBullet supports navigating this markdown web via cloud links, they’re simply wiki links that start with “💭 “. For instance: [[💭 silverbullet.md/Silver Bullet]]. When you click one of these links, SilverBullet will simply pull in its content and present it to you in read-only mode (and do some clever internal link rewriting). What it does is simply fetch the link via HTTPs and postfixes the url with `.md`, so [[💭 silverbullet.md/Silver Bullet]] will simply fetch [this page](https://silverbullet.md/Silver%20Bullet.md). You can access all of the SilverBullet website this way, for instance here’s the [[💭 silverbullet.md/CHANGELOG]]. + +To publish your own content this way, simply create an `index.md` on your host (this will be fetched as the main page), and publish all the rest of your content as `.md` files along side it. That’s all there’s to it. \ No newline at end of file diff --git a/website/Getting Started.md b/website/Getting Started.md new file mode 100644 index 0000000..fe52f34 --- /dev/null +++ b/website/Getting Started.md @@ -0,0 +1,31 @@ +## Getting started +The best way to get a good feel for what SilverBullet is like to use, is to get your hands dirty (after washing your hands first, always wash your hands before touching a keyboard). + +Here are some things for you to try _right now_: + +* Click on the page picker (book icon) icon at the top right, or hit `Cmd-k` (Mac) or `Ctrl-k` (Linux and Windows) to open the **page switcher**. + * Type the name of a non-existent page to create it. + * You can pages in folders (if you’re into that type of thing) simply by putting slashes (`/`) in the name (even on Windows), e.g. [[My Folder/My Page]] (note that although you only see the last bit of the name in live preview, the page is in fact nested in a folder). +* Click on the terminal button (top right) or hit `Cmd-/` (Mac) or `Ctrl-/` (Linux and Windows) to open the **command palette** (note that not all commands will work in this mode). On mobile you can tap the screen with 3 fingers at the same time to open the command palette. +* Select some text and hit `Alt-m` to ==highlight== it, or `Cmd-b` (Mac) or `Ctrl-b` (Windows/Linux) to make it **bold**, or `Cmd-i` (Mac) or `Ctrl-i` (Windows/Linux) to make it _italic_. +* Click a link somewhere on this page to navigate there. When you link to a [[New Page]] it will initially show up in red (to indicate it does not yet exist), but once you click it — you will create the page automatically (only for real when you actually enter some text). +* Start typing `[[` somewhere to insert a page link (with completion). +* [ ] Tap this box 👈 to mark this task as done. +* Start typing `:party` to trigger the emoji picker 🎉 +* Type `/` somewhere in the text to invoke a **slash command**. +* Hit `Cmd-p` (Mac) or `Ctrl-p` (Windows, Linux) to show a preview for the current page on the side. +* Click this button {[Editor: Toggle Vim Mode]} to toggle Vim mode + +Note that as you move your cursor around on this page and you get close to or “inside” marked up text, you will get to see the underlying [[💭 silverbullet.md/Markdown|Markdown]] code, this is what we refer to as “live preview” — generally your text looks clean, but you still can see what’s under the covers. To move your cursor somewhere by mouse without navigating or activating (e.g. a wiki, regular link, or a button) hold `Alt` when you click. + +Hadn’t we mentioned [[💭 silverbullet.md/Markdown|Markdown]] yet? Yeah, that’s the markup language you’ll use to markup your documents. It’s pretty simple to learn if you don’t know it already. + +You will notice this whole page block is wrapped in a [[💭 silverbullet.md/%F0%9F%94%8C_Directive|Directive]] (in this case `#include`), which means that its content is automatically updated every time you run the {[Directives: Update]} command or navigate back to the page. In the case of `#include` this means the body will be replaced with the page included, so don’t be surprised when whatever you update inside of this directive block will be undone later. Just sayin’. [[💭 silverbullet.md/%F0%9F%94%8C_Directive|Directives]] are a powerful feature, so you should definitely look into them once you get comfortable with the basics. + +Feel free to completely remove all content on this page and make it your own, it’s just to get you started. + +## What next? +Generally, you can find more information about SilverBullet on its official website. You have two ways to access it: + +1. Through its [regular website link](https://silverbullet.md/) +2. Directly, through your local SilverBullet instance using [[💭 silverbullet.md/Cloud Links]]: [[💭 silverbullet.md/Silver Bullet]] (note that all of these will be read-only, for obvious reasons) \ No newline at end of file