footer
Footer design reference — layout patterns, sticky footers, SEO, accessibility, legal requirements. Use when designing web page footers or implementing responsive footer components.
Install via CLI (Recommended)
clawhub install openclaw/skills/skills/bytesagain/footerFooter — Web Footer Design & Implementation Reference
Quick-reference skill for designing and implementing web page footers, covering layout patterns, accessibility, responsive behavior, and best practices.
When to Use
- Designing a website footer layout with proper structure
- Implementing sticky or fixed footer behavior
- Adding legal/compliance content (copyright, privacy, terms)
- Making footers accessible and SEO-friendly
- Building responsive footer components
Commands
intro
scripts/script.sh intro
Overview of footer design — purpose, anatomy, and design principles.
patterns
scripts/script.sh patterns
Common footer layout patterns — fat footer, minimal, mega footer, sitemap-style.
sticky
scripts/script.sh sticky
Sticky footer techniques — flexbox, grid, and classic methods.
html
scripts/script.sh html
Semantic HTML structure for footers — proper tags, ARIA roles, landmarks.
css
scripts/script.sh css
CSS patterns for responsive footer layouts — grid, flexbox, media queries.
legal
scripts/script.sh legal
Legal and compliance content — copyright notices, privacy links, cookie consent.
accessibility
scripts/script.sh accessibility
Accessibility best practices — navigation, contrast, screen readers, WCAG.
examples
scripts/script.sh examples
Real-world footer examples and code snippets.
help
scripts/script.sh help
version
scripts/script.sh version
Configuration
| Variable | Description |
|---|---|
FOOTER_DIR | Data directory (default: ~/.footer/) |
Powered by BytesAgain | bytesagain.com | [email protected]
Metadata
Not sure this is the right skill?
Describe what you want to build — we'll match you to the best skill from 16,000+ options.
Find the right skillPaste this into your clawhub.json to enable this plugin.
{
"plugins": {
"official-bytesagain-footer": {
"enabled": true,
"auto_update": true
}
}
}Tags
Related Skills
frontend-design
Generates production-ready UI components from natural language. Use when the user asks to design a component, create a button, build a form, prototype a layout, or generate React/Tailwind CSS code. NOT for: backend logic, API design, database schema, or non-UI tasks.
axure-prototype-generator
Axure 原型代码生成器 - 输出 JavaScript 格式 HTML 代码，支持内联框架直接加载可交互原型。
react-best-practices
Audits React code for performance, bundle size, and best practices. Use when reviewing React code, auditing bundle size, finding performance issues, checking React 18+ patterns, or evaluating a React codebase. NOT for: non-React projects, backend Node.js code, or CSS-only reviews.
SeedFlip Dashboard Theme
Re-theme your OpenClaw dashboard with 104 curated design seeds from SeedFlip. Fonts, colors, shadows, radii. One command, instant transformation.
snapapi
Give your agent web intelligence — screenshot any URL, extract structured page data, detect page changes, and analyze websites via the SnapAPI REST API.