Backend & Editor
A powerful documentation system that puts you in control. Edit your content locally or remotely with plain text and Markdown, while seeing your changes instantly.
All content is stored locally in plain text and Markdown format. Edit with your favorite tools, no vendor lock-in.
See your changes instantly with built-in preview. No need to save or publish - everything updates in real-time.
Work seamlessly across desktop and mobile environments. Your workflow, your choice.
Access and modify any part of the system. Your site, your rules, your customizations.
Desktop Environment
Upon first build, bnkops Change Maker V3 comes bundled with the current theme, documentation, and front-page. All can be updated within the app in plain text and notes are written using Markdown.
Live Preview
Click the double headed arrow to open and close live preview panel. The live preview panel shows your site updates inside the editor live. All changes to .md files are automatically pushed to site; no need to save or manage publication details. V4 will ship with state management (publish, draft, etc.) however if you want to work with drafts we suggest that users write files in obsidian and then copy/paste content to site.
Files
You will have a files section, which allows you to create, delete, and organize your websites structure.
Hidden Content
Folders that start with a period (.example) are hidden from navigation in cmeditor and public site. If using obsidian as content management system, this allows for folders to contain files, images, gifs, and website organization essentials without making them public. V4 will come with more fine grain control of what files are served to public and cmeditor.
Editor
The editor is where you can write and edit your content. The editor is a plain text editor that supports markdown. Markdown is a simple way to format text that is easy to read and write.
Backlinks
The backlinks panel on the right hand side is where your you can monitor your internal linking. See where all your files are being referenced and if internal linking is working properly.
Settings
Along the top bar are the settings. The double arrows opens/closes the live preview. The cog icon opens the mkdocs.yml which is how you set your sites features, plugins, and layout. The table icon opens the home.html in which you can edit your websites home page.
mkdocs.yml
The mkdocs.yml is accessed by clicking the cog icon or by opening the mkdocs.yml file inside your top level /Change Maker V3 folder. This is a plain text file. Edits made to this file, upon save, reload site and update universally. If preview shows site down, it is because syntax for your .yml file is incorrect. To fix, you can check the guides, or you can ask any capable LLM for assistance. See Customize Your Landing Page for prompting manual.
Change Maker ships with several dozen features pre-installed and a navigation tree. Features, plugins, and references can be found on the Material for MkDocs site. Many future features will ship as features that are enabled through this plain text system.
Check out Material for MkDocs Documentation
Change Maker mkdocs.yml
mkdocs.yml Configuration
site_name: Change Maker # The name of the site
site_description: A powerful documentation system combining simplicity with professional features. # A brief description of the site
site_url: https://changemaker.bnkops.com/ # The URL where the site is hosted
site_author: Bunker Ops # The author or organization responsible for the site
site_dir: docs # The directory where the documentation files are stored
theme:
logo: logo.svg # The logo file for the site
name: material # The theme name, in this case, 'material'
custom_dir: docs/overrides # Directory for custom theme overrides
palette:
scheme: slate # The color scheme for the theme
primary: amber # The primary color for the theme
accent: deep purple # The accent color for the theme
features:
- navigation.sections # Enable navigation sections
- navigation.instant # Enable instant navigation
- navigation.instant.progress # Show progress in instant navigation
- navigation.instant.preview # Enable instant preview in navigation
- navigation.tracking # Enable navigation tracking
- navigation.indexes # Enable navigation indexes
- toc.integrate # Integrate table of contents
- content.code.copy # Enable copy button for code blocks
- navigation.path # Show navigation path
- navigation.top # Enable top navigation
- navigation.footer # Enable footer navigation
markdown_extensions:
- pymdownx.highlight:
anchor_linenums: true # Enable line numbers in code blocks
line_spans: __span # Add spans to lines in code blocks
pygments_lang_class: true # Use Pygments language class for code blocks
- pymdownx.inlinehilite # Enable inline highlighting
- pymdownx.snippets # Enable snippets
- pymdownx.superfences # Enable superfences for code blocks
- admonition # Enable admonitions
- pymdownx.details # Enable details extension
- attr_list # Enable attribute lists
extra_css:
- stylesheets/extra.css # Additional CSS file for custom styles
copyright: Copyright © 2024 The Bunker Operations # Copyright information
extra:
generator: false # Disable generator meta tag
social:
- icon: material/web # Icon for the social link
link: https://repo.bnkops.com/Home.html # URL for the social link
plugins:
- social # Enable social plugin
- search # Enable search plugin
nav:
- Welcome to Bnkops Change Maker: index.md # Navigation link to the welcome page
- Why Change Maker: Why Change Maker.md # Navigation link to the 'Why Change Maker' page
- Bnkops Deploy: bnkops Deploy.md # Navigation link to the 'Bnkops Deploy' page
- Manuals: # Navigation section for manuals
- Getting Started: manuals/index.md # Link to the 'Getting Started' manual
- Prerequisites: manuals/prerequisites.md # Link to the 'Prerequisites' manual
- Installation: manuals/Installation.md # Link to the 'Installation' manual
- Backend & Editor: manuals/Backend & Editor.md # Link to the 'Backend & Editor' manual
- Simple Markdown Guide: manuals/Simple Markdown Guide.md # Link to the 'Simple Markdown Guide' manual
- Use Obsidian as Site Editor: manuals/obsidian.md # Link to the 'Use Obsidian as Site Editor' manual
- Customize Your Landing Page: manuals/Customize Your Landing Page.md # Link to the 'Customize Your Landing Page' manual
- Example Political Apps: manuals/Examples.md # Link to the 'Example Political Apps' manual
- Get Online: manuals/Get Site Online.md # Link to the 'Get Online' manual
- Visit repo.bnkops.com for more!: https://repo.bnkops.com/Home.html # External link to the repository
- Admin Log: Admin Log.md # Navigation link to the 'Admin Log' page
Navigation
Site wide navigation can be set purposefully by declaring it inside the .yml file or can be left to automatic alphabetical rendering. To switch to alphabetical approach, delete nav section in .yml file. Hybrid approaches are possible for things like blogs; see Material for MkDocs for more.
QR Code Maker
Qr code maker is a feature that allows you to generate QR codes for your site. This is useful for sharing your site with others. You can access the feature by clicking on the icon above the editor or by typing [[qr]] in the editor.
Landing Page HTML Panel
Click on the table icon to open the landing page HTML panel. See Customize Your Landing Page for more instruction for updating this section.
Mobile Environment
The mobile development currently deploys folded on load. This can be intimidating on first glance; trust us it is okay. To get to editor smoothly:
- Select a file and collapse the file menu
- Close the preview menu by clicking the double header arrow icon
- Collapse the backlinks section
Editing on Mobile Browser
Diving Further
The entire site is built locally, which means all your files are available for updates locally. You can use any editor, such as VSCode, Obsidian, Texteditor, or your preferred platform to do site wide updates. As there are no blackbox code sections, you can access and modify any part of the system.
extra.css
Want to spruce up your site even further? Access the extra.css file docs/stylesheets/extra.css and add in any site wide css styling you would like to add. Shipped by default are code block improvements.
Again, Learn More At Mkdocs-Material
The system uses mkdocs-material as the backend that builds your site. Material for Mkdocs is also a open-source project that has a massive community behind it. They have extensive documentation to setup a vast array of features and customization.
Exciting to us, and coming to you all soon, is support for site creation in over 60 languages. and built in features like data privacy.
Check out Material for MkDocs Documentation
