baklib-theme-dev

Original：🇨🇳 Chinese

Translated

Baklib Site Theme (Template) Development: Liquid directory and naming conventions, objects and directives/filters, static page URLs, seeds and migrations; including 'Create Theme Scaffold' (themes/ directory and minimal files) and 'Reference Site Cloning Workflow' (requires confirmation gates and quality checklists). Used when users write or modify .liquid files, create new templates, clone reference sites, or troubleshoot template syntax and variables; detailed specifications can be found in references/.

2installs

Sourcebaklib-tools/skills

Added on2026-05-16

NPX Install

npx skill4agent add baklib-tools/skills baklib-theme-dev

SKILL.md Content (Chinese)

View Translation Comparison →

Baklib Template Development

Baklib's site frontend uses Liquid templates (similar to Shopify's template system). Template authors build pages by combining objects (variables), directives (control logic, officially called Tags), and filters (transform output).

Terminology

Term	Definition
Object	Variables or properties output in `{{ }}` , e.g., `{{ site.name }}`
Directive	Control flow in `{% %}` ; referred to as "directive" here to avoid confusion with site content "tags"
Filter	Connected with `\|` inside `{{ }}` , e.g., `{{ site.pages \| order_by: "-published_at" }}`

Workflow (Read as Needed)

Scenario	Document
Create `themes/[scope]/[name]/` in the product repository and generate minimal files	create-theme-scaffold.md
Clone Reference Website (analysis, adaptation, phased implementation, quality inspection; multiple steps require prior confirmation)	website-cloning-workflow.md

Document Index (

references/

)

Open the following files as needed for complete tables and examples:

File	Content
directory-and-naming.md	Theme directory, naming conventions for `templates` / `layout` / `snippets` / `statics` / `assets` / `config` / `locales` / `src` and files
liquid-tags.md	Custom directives in page templates and layouts, `render` , `form_tag` , `track_event` , `paginate_tag` , `query` , `search` , etc.
shared-snippets-source.md	The three built-in snippets in `{% render '@shared/…' %}` are identical to the original files in the repository's *`themes/shared/snippets/_.liquid`** , making them easy to copy and modify
objects-and-drops.md	Global variables, scenario-specific variables, and objects like `site` / `page` / `tag` / `search` / `paginate`
filters.md	Custom filters provided by the product (including site extensions)
limits-and-security.md	Theme name rules, pagination limits, `strict_filters` , reverse proxy and path prefix
seeds-and-migrations.md	`seeds/` initialization data and `migrations/` theme migrations

Scope

Target Audience: For developers writing Liquid for Baklib site themes; does not cover details of Baklib's application backend or Rails implementation.
Relationship with Standard Liquid: Except for the following custom capabilities, you can use standard Liquid syntax and built-in filters.
Version Differences: Whether functions like login, search, feedback, and AI are enabled for a specific site depends on tenant configuration; templates should handle null values (e.g.,
```
{% if current_user %}
```
).

Quick Example

liquid

{% layout "theme" %}
<h1>{{ site.name }}</h1>
{% for p in site.pages | limit: 5 %}
  <a href="{{ p.path }}">{{ p.link_text }}</a>
{% endfor %}