{
"Customization": {
"entries": {
"š Custom Sort Order": {
"id": "Customization/Custom-Sort-Order",
"title": "š Custom Sort Order",
"order": 3,
"content": "<h1 id=\"Custom-Sort-Order\" tabindex=\"-1\">Custom Sort Order</h1>\n<p>Entries (either folders or md files) can have a custom order assigned as follows:</p>\n<p><strong>Markdown Files</strong>\nPut this yaml metadata at the top of your file:</p>\n<pre><code class=\"language-yaml\"><span class=\"hljs-meta\">---</span>\n<span class=\"hljs-attr\">order:</span> <span class=\"hljs-number\">1</span>\n<span class=\"hljs-meta\">---\n</span></code></pre>\n<p><strong>Folder Customization</strong>\nAdd a metadata.yaml file to your folder, which contains the metadata:</p>\n<pre><code class=\"language-yaml\"><span class=\"hljs-meta\">---</span>\n<span class=\"hljs-attr\">order:</span> <span class=\"hljs-number\">1</span>\n<span class=\"hljs-meta\">---\n</span></code></pre>\n",
"isPage": true
},
"š Linking Between Pages": {
"id": "Customization/Linking-Between-Pages",
"title": "š Linking Between Pages",
"order": 2,
"content": "<h1 id=\"Linking-between-pages\" tabindex=\"-1\">Linking between pages</h1>\n<p>You can link between different pages by using the following syntax:</p>\n<pre><code>[Link to another page](#Core-Concepts/CodeTest)\n</code></pre>\n<p>Where <code>Core-Concepts/CodeTest</code> is the slugified path to the page you want to link to.</p>\n<p>You can also link to specific headings within a page by appending <code>?h=Heading-Name</code> to the URL:</p>\n<pre><code>[Link to another page with heading](#Core-Concepts/Understanding-Core-Concepts?h=Kelp-Settings-2)\n</code></pre>\n<p>Where <code>Kelp-Settings-2</code> is the slugified version of the heading you want to link to.</p>\n<p>This link here will take you to <a href=\"#Customization/Images\">Images</a> section and this to the <a href=\"#Quickstart?h=Building-the-docs\">Building the docs</a> heading.</p>\n",
"isPage": true
},
"šļø Theming": {
"id": "Customization/Theming",
"title": "šļø Theming",
"order": 3,
"content": "<h1 id=\"Theming\" tabindex=\"-1\">Theming</h1>\n<p>The builder uses <a href=\"https://picocss.com/\">Pico CSS</a> under the hood, which allows you to customize the color by providing a predefined scheme, that pico provides.\nYou can find an overview over all available color schemes here: <a href=\"https://picocss.com/docs/version-picker\">https://picocss.com/docs/version-picker</a></p>\n",
"isPage": true
},
"š¼ļø Images": {
"id": "Customization/Images",
"title": "š¼ļø Images",
"order": 2,
"content": "<h1 id=\"Images\" tabindex=\"-1\">Images</h1>\n<p>Images can be added to your documentation by placing them in a folder called <code>images</code> inside your <code>docs</code> folder.\nThese images will then be automatically included in the final build and can be referenced in your markdown files like this:</p>\n<pre><code class=\"language-markdown\">![<span class=\"hljs-string\">Alt-Text</span>](<span class=\"hljs-link\">../images/main-banner.png</span>)\n</code></pre>\n<p>Please note the <code>../</code> at the beginning of the path, is required, since this file here is located in the <code>Customization</code> subfolder of the <code>docs</code> folder.</p>\n<p>This will render the image like this:\n<img src=\"cachedImage-../images/main-banner.png\" alt=\"Alt-Text\"></p>\n",
"isPage": true
},
"š Emojis": {
"id": "Customization/Emojis",
"title": "š Emojis",
"order": 4,
"content": "<h1 id=\"Emojis\" tabindex=\"-1\">Emojis</h1>\n<p>Emojis can be added to your documentation by using standard emoji shortcodes, like <code>:smile:</code> (š), <code>:rocket:</code> (š), or <code>:tada:</code> (š).\nAdditionally, you can also use Unicode emojis directly in your markdown files, like this: ššš.</p>\n",
"isPage": true
}
},
"isPage": false,
"title": "Customization",
"order": 3
},
"š Welcome": {
"id": "Welcome",
"title": "š Welcome",
"order": 0,
"content": "<p><img src=\"cachedImage-/images/main-banner.png\" alt=\"\"></p>\n<h1 id=\"What-is-Offline-Markdown-Docs\" tabindex=\"-1\">What is Offline Markdown Docs?</h1>\n<p>Offline Markdown Docs is a CLI tool that allows you to create offline documentation from markdown files. It takes all your markdown files, processes them, and outputs a single HTML file that contains all your documentation, complete with embedded images and syntax highlighting for code blocks and much more.</p>\n<p>The created file is a <strong>standalone HTML file that can be opened in any web browser, without the need for an internet connection</strong> or any additional dependencies.</p>\n<p>Want to know how to get started? Check out the <a href=\"#Quickstart\">Quickstart</a> guide.</p>\n<h2 id=\"Features\" tabindex=\"-1\">āØ Features</h2>\n<ul>\n<li>Yields a singular .html file as it's output, that is ready for offline use (0 dependencies)\n<ul>\n<li>Embeds images as base64 (with caching to avoid duplicates)</li>\n<li>Embeds your md files</li>\n</ul>\n</li>\n<li>Syntax highlighting for code blocks</li>\n<li>Supports embedding images</li>\n<li>Supports folders to organize your docs</li>\n<li>Supports linking between different pages and headings</li>\n</ul>\n",
"isPage": true
},
"š Quickstart": {
"id": "Quickstart",
"title": "š Quickstart",
"order": 1,
"content": "<p><img src=\"cachedImage-/images/main-banner.png\" alt=\"\"></p>\n<h1 id=\"Quick-Start\" tabindex=\"-1\">Quick Start</h1>\n<ol>\n<li>Create a new folder and add a <code>config.yaml</code> to it with the following content:</li>\n</ol>\n<pre><code class=\"language-yaml\"><span class=\"hljs-attr\">title:</span> <span class=\"hljs-string\">My</span> <span class=\"hljs-string\">Documentation</span> <span class=\"hljs-string\">Title</span>\n<span class=\"hljs-attr\">theme:</span> <span class=\"hljs-string\">cyan</span>\n</code></pre>\n<ol start=\"3\">\n<li>Create a new folder called <code>docs</code></li>\n<li>Start creating new markdown files in that folder to get your documentation going</li>\n<li>Run <code>npx ...</code> to open the live preview of your documentation</li>\n<li>Once happy, run <code>npx offline-md-docs build</code> to build your final html file</li>\n</ol>\n<h2 id=\"Running-a-local-dev-server\" tabindex=\"-1\">Running a local dev server</h2>\n<p>To run a local dev server, which shows you a live preview of your docs, run:</p>\n<pre><code class=\"language-sh\">npx offline-md-docs start\n</code></pre>\n<p>This will start a local dev server, which will live reload as you make changes to your markdown files:</p>\n<pre><code class=\"language-sh\">\n> offline-md-docs@1.0.51 start\n> node ./src/server.js\n\nš offline-md-docs v1.0.51\n\nš Server running at http://localhost:3000\nš Watching docs/ <span class=\"hljs-keyword\">for</span> changes...\n</code></pre>\n<h2 id=\"Building-the-docs\" tabindex=\"-1\">Building the docs</h2>\n<p>To build your documentation, run:</p>\n<pre><code class=\"language-sh\">npx offline-md-docs build\n</code></pre>\n<p>This will create a new html file with your documentation in the root of your project folder:</p>\n<pre><code class=\"language-sh\">> offline-md-docs@1.0.51 build\n> node ./src/build.js\n\nš offline-md-docs v1.0.51\n\nš Processed docs with 5 pages and 2 images <span class=\"hljs-keyword\">in</span> 29 ms.\nš¦ Output size: 0.60 MB\n</code></pre>\n",
"isPage": true
}
}