Dynamic Footer Component with JSON-Driven Content
Summary
Introduced a dynamic, data-driven Footer component for the site, enabling flexible updates via JSON content files and improving maintainability, consistency, and scalability of the site's global layout.
Why Care
This upgrade transforms the footer from a static, hardcoded element into a modular, maintainable, and easily extensible component. Content teams and developers can now update footer links, social icons, and organization locations by editing simple JSON files—no code changes required. This reduces deployment friction, enables rapid iteration, and ensures consistency across the site.
Implementation
Changes Made
- Component Refactor:
- Replaced the static footer with a new, dynamic implementation in
src/components/basics/Footer.astro
. - Footer now loads all content (links, social icons, org locations) from JSON files.
- Content Data:
- Added
src/content/basics/footerLinks.json
for link columns. - Added
src/content/basics/orgLocations.json
for organization names and locations. - Added
src/content/basics/socialIcons.json
andsrc/content/footer/socialIcons.json
for social media icons.
- Layout Integration:
- Updated
src/layouts/Layout.astro
to use the new Footer component.
- File Additions:
src/content/basics/footer/columns-links.json
(placeholder for future expansion)- All new JSON files are structured for easy editing by non-engineers.
Files Changed: