Certainly. Here is a technical documentation article for the Axcora SSG Search Component, in clear and structured English.
installation
npm i axcora-search
The Axcora SSG (Static Site Generator) provides a flexible component system to enhance your website with interactive features, such as the search
component. This system allows you to use components both at the template level (site-wide) and within individual content (per-article), offering granular control over your site's features.
1. Component Usage Patterns
a. Template-level Import
Template-level usage means you load and configure the component directly in your site or layout files (e.g., for blog posts or pages). Once imported, the component is available for use throughout the rendered content or markdown files processed by that template.
Example: Enabling the Search Component in a Blog Post Template
Suppose you are editing the file templates/blog/single.axcora
:
---
layouts: base
css:
theme: 'essentials'
components:
- search
js:
- search
---
<main>{{content}}</main>
- Under the
components
list, addsearch
to ensure the necessary search styles are included. - Under
js
, includesearch
so the interactive logic is loaded.
Result:
Once this is set, the search
component (and any other specified components) is available to be used anywhere in content or templates associated with this layout.
b. Content-level Usage
If you want to use the search
component within a specific article/content file (markdown or rich content), you can do so as long as the relevant template imports the required components.
Tip: If you expect several different articles to use various components, it is best to import all needed components in your theme or base template.
2. Using the Search Component
Once you've imported the search component as above, you can instantiate it either directly in templates or within markdown article content using the designated shortcode:
{% axcora-search /%}
ouptut
The component will be rendered in the output HTML wherever the shortcode appears.
For example, inside a markdown article or as part of a post template, simply insert the shortcode to display the search widget at that position.
3. Technical Notes
- Component import at template level ensures code reusability and performance (the search code is bundled for all associated content/pages).
- Shortcode usage in content or templates
axcora-search
provides flexibility to position the widget wherever needed. - Dependency management: Components that rely on JavaScript (like search) must be declared in both
css.components
andjs
lists in the template frontmatter.
This documentation applies to Axcora SSG 2025 Edition and later. Syntax and configuration may differ for older releases.