More Features Than You'd Expect From A Theme!
The developer of this theme worked in the technology industry, in a position known as Developer Relations. In early-stage startup companies, the "DevRel" usually gets the honor of owning all of the documentation, and this theme was made out of the experiences of helping companies get set up.
This theme is designed for anyone who has to deal with a large amount of text content, who is comfortable working with Markdown, and is adventurous enough to try some components to ease the workload.
These are the main features, though there are perks built into unexpected places.
Static Doesn't Have To Mean Stagnate! Interactive Stuff Is Included!
The first two features to offer interactive engagement experiences will be a content rating system that's currently visible on every page [in our docs site])(/docs/), with an accompanying admin plugin to view and delete feedback.
Things are working fine with DenoKV; we're also looking to implement a way to use Github Issues as well as Discord to receive submissions.
The [content rating plugin])(/docs/content-rating/) (aka anonymous feedback) is live right now.
A Fully-Featured, Interactive & SEO Optimized Blog
The blog configuration brings a lot of robust features such as:
- Tagging & Community Tag Wiki System
- Automatic OG Image Generation. Built for writing tutorial-style content as well as essays or even galleries.
- RSS/JSON Feeds for all posts, as well as individual, per-tag feeds.
- Archive Pages For Posts, Authors & Tags
- Blog Homepage, which can become the site homepage if you want.
- Code Syntax Highlighting with MDX lets you use a wide variety of components.
- Auto Image Resizing: Upload blog images to
uploadsand fahhhhhhh-get about it. - Interactive Content Rating System Powered by DenoKV, Discord, GH Issues or whatever you want to use to receive the feedback. Includes DenoKV and Discord by default.
- Uses Lume's archetype scripts for new content creation.
- Multi-instance capable: Uses "waypoints" to bucket content by blog installs for navigation and search discernment.
- Is still in very active development; more features are coming.
The blog is designed with a lone technical community manager or product marketing manager in mind, and has everything they'd want to handle things from release notes all the way to tutorial and thought leadership content.
Yes, documentation and landing pages are important parts of any kind of user or community portal, which is the primary use-case for Cushy Text, but the blog is where many new groups tend to spend the majority of their time in content development.
Speaking of new content development, do you want to write a new blog post? Just do this:
> lume new blog "new blog post title"
You'll have a draft in blog/ with all frontmatter filled out with defaults, and a
generated image based off of the title and description that will update as you edit
in serve mode. The creation experience is as important as the reading experience, from
the theme's perspective.
A Bare Bones But Effective Documentation System
Documentation is written like blog posts, with a few key differences:
- You set your own H1 heading in the document (in blogs, this is automatic)
- The sidebar is auto-generated based on file / title / menu order that
you control in frontmatter via
menu.orderandmenu.visiblefor pages you want generated but not linked. - No archive pages are generated. While tags can be applied to documentation files, they aren't really used in the UI outside of search. You can of course change that.
But like Blogs, Documentation also has features that make your life as the site maintainer easier:
- Multi-instance and independent with very minimal configuration (a few fields in
_data.yml). - Waypoint-isolated so you can bring docs from specific sections of your site
into different feeds and navigation. Grab documentation from
%api-docs%or%quickstart-tips%or%javascript-sdk%easily. - Automatic search via Pagefind
- Content rating system so users can give direct feedback
- SEO Optimized
- MDX With whatever plugins you'd like to bring beyond the default that come with Infima CSS.
- Can also bring in content from other parts of the site (e.g. release notes blog)
The bar for the Documentation feature to reach in order to be deemed worthy of inclusion is its ability to document itself and the rest of the theme, which I think it managed to meet quite a few revisions and additional features ago.
It's still under active development, but I think the focus is more on perfecting the features it has, not adding more. It's not supposed to outgrow something you can plop in a directory and control with a very minimal amount of YAML in whatever directories you use it.
Like blogs, you'll be able to create a new documentation entry easily from templates
that the theme provides, but some work will have to go into managing paths of installs
for those that have many and need to specify a destination. That's outside the scope
of the current lume CLI script.
A Comprehensive Static Analysis SEO Plugin
The theme handles setting up your content with all of the frontmatter present and even pre-configured with default values where it makes sense. And, when you publish, Lume makes sure that all of your content is presented exactly as the theme designed it, so it looks great on all screens.
But it's us pesky humans who write content, and forget or exceed certain things that make search robots not like our content very much, and all that planning gets wasted.
That's why the theme includes a plugin that runs a lot of comprehensive checks on your content such as:
- Meta information presence, length, percentage of common words
- Content length checks (titles and content-body separately) as well as common word density analysis in important fields like titles and descriptions
- Checks on images and other HTML elements to be sure all properties are set correctly (alt, title)
- Checks to make sure the semantic document structure is correct (headings in order, one main idea per page, etc)
It's not possible to produce a plugin that can forever guarantee amazing SEO results or make magic promises, and I'd caution anyone to treat anything that did with extreme skepticism. Search engines are proprietary black boxes, so SEO is basically just religion you can grok through meaningful coincidences.
This plugin just helps make sure you're not getting in your own way with common mistakes, so your content has a fair chance.
Fully Responsive & Working On Becoming Fully-Accessible
Infima makes creating 100% responsive themes easier than many frameworks, because it mostly handles it behind the scenes for you. The theme includes Infima CSS plus a style sheet for overrides and some classes to make everything work. Content looks great on screens of all sizes.
This theme also features light and dark themes with auto detection, the ability to
toggle Open Dyslexic for long blocks of content, which
you can apply by just adding a font-selectable class to the text container.
Now that major development has slowed and the structure of the pages themselves isn't changing drastically every day, the process of "finishing" the markup is under way, where special attention is also paid to labels that help guide readers as well as tab index settings that help keyboard navigation. Help in this area is greatly appreciated for anyone looking to work on something.
Ready For Translation
No localization plugin has been installed yet, but all strings have been separated into
two different locale files: locale.yml and demo.yml, located in the main _data/
directory.
The locale.yml file contains strings that you're probably going to keep no matter how much
you customize the template. That's the file you should build on and take time to curate.
The other file demo.yml contains all the strings that make this website's features work,
like the front page cards and such. Do whatever you want with those, they were kept out because
they would most likely be noise for translators.
Includes Lume 3 Components Built On Infima's Design System
Take a look at the Infima documentation site to see everything included with the framework. You have everything from a grid and markup-friendly spacing system to alerts and buttons, pills, tabs and many other components that technical / text sites need.
Things that take advantage of these components are built as Lume 3 components, loading additional CSS and JS on top of the framework only when they're used. Alerts, Content Rating, and more coming like tabs, carousels and other things content-heavy sites frequently need.
If you're curious and a little adventurous, you can have a look at our component testing page, which also shows most of the Infima utility components and helpers.
Includes A Ton Of Pre-Configured Plugins!
Everything from automatic OG image generation to broken link detection and plenty of optimization. Have a look at what's under the hood:
| Plugin | Description | Type | Author | Installed? | Custom Configured? |
|---|---|---|---|---|---|
| expires | Server Middleware | base | Lume Official | Yes | No |
| precompress | Server Middleware | base | Lume Official | Yes | No |
| router | Server Middleware | base | Lume Official | Yes | Yes |
| cache-buster | Server Middleware | base | Lume Official | Yes | No |
| toc | Table Of Contents Generator | base | Tim Post | Yes | Yes |
| og-images | Generate OG Images From Templates | base | Lume Official | Yes | Yes |
| picture | Create Responsive Images Automatically | base | Lume Official | Yes | No |
| basepath | Core Lume Plugin | base | Lume Official | Yes | No |
| nav | Nav helper for Lume | base | Lume Official | Yes | No |
| transform-images | Transform Images | base | Lume Official | Yes | No |
| icons | Easily Use Open Source Icon Sets | base | Lume Official | Yes | No |
| inline | HTML Helper | base | Lume Official | Yes | No |
| mdx | Default Document, Built On SSX | base | Lume Official | Yes | No |
| lightningCSS | CSS Processor & Minifier | css | Lume Official | Yes | No |
| purgecss | CSS Cleaner | css | Lume Official | Yes | No |
| feed | Generate Feeds | seo | Lume Official | Yes | Yes |
| sitemap | Generate Sitemap | seo | Lume Official | Yes | No |
| robots | Generate robots.txt | seo | Lume Official | Yes | No |
| check_urls | Check link validity | seo | Lume Official | Yes | Yes |
| slugify_urls | Slugify URLs | seo | Lume Official | Yes | Yes |
| redirects | Manage Redirects | seo | Lume Official | Yes | No |
| seo | Static SEO Analysis | seo | Tim Post | Yes | No |
| metas | Meta Tag Generation | seo | Lume Official | Yes | No |
| readinginfo | Display Reading Time | user | Lume Official | Yes | No |
| prism | Fancy Code Highlighting | user | Lume Official | Yes | Yes |
| terser | JavaScript Minifier | perf | Lume Official | Yes | Yes |
| brotli | Compression | perf | Lume Official | Yes | No |
| pagefind | Provides Search | search | Lume Official | Yes | Yes |
| source maps | Source Maps (Dev Plugin) | devEx | Lume Official | Yes | No |