Skip to content
Type something to search...
to navigateto selectESC to close
Ultimate Astro Theme GuidesDocs
Kivo Theme Documentation

Footer & Call To Action

Files: src/config/config.toml, src/i18n/en.json, src/config/social.json, src/content/sections/english/call-to-action.md · Skill level: Beginner

src/config/config.toml
[settings.layout]
  footer         = "default"       # default | minimal | large
  footerWordmark = "interactive"   # interactive | static
LayoutWhat it shows
defaultLogo, description, latest release pill, status badge, social icons, link columns, a large brand wordmark, copyright, and language switch
minimalOne row: logo, the last menu column (legal links), social icons, copyright, and language switch
largeLogo, description, and social icons beside a newsletter form, then the link columns, then a row with the status badge, language switch, and copyright

footerWordmark sets the large brand name at the bottom of the default footer: interactive draws it in dots that follow the cursor, static shows plain text. A page can use another layout with footerLayout: "minimal" in its frontmatter.

Footer Text

Edit footer in src/i18n/en.json (and fr.json):

"footer": {
  "description": "The developer cloud for shipping apps, APIs, databases, and background jobs without managing servers.",
  "copyright": "© {year} {brand}. All rights reserved.",
  "status": "All systems operational"
}
  • {year} becomes the year of the build and {brand} becomes site.title, so the year updates each time you rebuild the site.
  • status is the text of the green status badge, which links to /status/.
  • For a one-language site you can set the text in config.toml instead: footerDescription under [settings], and text under [settings.copyright].
PartWhere it comes from
Latest release pillThe newest entry in src/content/changelog/. Hidden when there are no entries
Status badgeLinks to /status/. To link elsewhere or remove it, edit src/layouts/components/global/footer/FooterStatus.astro
Social iconssrc/config/social.json
Link columnsfooter in src/config/menu.en.json. See Menus
AI links row”Ask AI about this page”, Markdown copy, and llms.txt. Turn off with [settings.pageActions] footer = false
Language switchShown when more than one language is enabled

src/config/social.json lists your profiles. Change url, set enable: false to hide one, or add a new one with an SVG icon from src/assets/images/icons/:

{
  "main": [
    {
      "enable": true,
      "label": "linkedin",
      "icon": "/images/icons/linkedin.svg",
      "url": "https://www.linkedin.com/company/your-company"
    }
  ]
}

Every page ends with a call-to-action band above the footer, except the 404 pages, /elements/, and the log-in, sign-up, and reset screens. Its default content is src/content/sections/english/call-to-action.md: eyebrow, title, description, two buttons, an animated deploy pipeline, and an install command.

options:
  layout: "default"      # default | split | band | newsletter
  appearance: "saas"     # saas | dark | light | accent
LayoutWhat it shows
defaultA centered card with floating icons and the deploy pipeline
splitCopy and button left, the install command card right
bandA slim row: title, one line, and a button
newsletterCopy left, an email form right (uses [settings.subscription])

To change or hide it on one page, add a ctaSection block to that page’s file:

ctaSection:
  enable: false          # hide it on this page
ctaSection:
  title: "Ready to migrate?"
  button:
    label: "Book a migration call"
    url: "/contact/"

Do It With AI

Set the footer to the [minimal | large] layout in src/config/config.toml. Change footer.description
in src/i18n/en.json and fr.json to "[TEXT]". Update src/config/social.json with my profiles: [LINKS],
and disable the others. Then rewrite src/content/sections/english/call-to-action.md (and french/)
for my product, keeping every key and option.