P
PaperHouseastro theme ~
Get started

Astro Config & Site Settings

Set your domain, canonical URLs, and site-wide options for PaperHouse — an Astro 7 + Tailwind 4 portfolio theme.

Astro Config & Site Settings

Before deploying PaperHouse, set two things: your production domain in astro.config.mjs, and your site-wide data in src/data/site.json.

This page walks through both.

1. Set your domain

Open astro.config.mjs at the root.

import { defineConfig } from 'astro/config';
import tailwindcss from '@tailwindcss/vite';

export default defineConfig({
  site: 'https:/paperhouse-astro.studio',
  vite: {
    plugins: [tailwindcss()]
  }
});

Change site to your production URL:

site: 'https://your-domain.com',

Why this matters: Astro uses site to generate canonical URLs and sitemap entries. If it is wrong, search engines see duplicate pages and rankings drop.

Use the exact URL people will visit — no trailing slash.

2. Enable sitemap (optional)

Install the official sitemap integration:

npx astro add sitemap

This updates astro.config.mjs automatically and generates a sitemap-index.xml on build.

Your sitemap will be at:

https://your-domain.com/sitemap-index.xml

Submit that URL to Google Search Console after deploying.

3. Configure site data

All site-wide content lives in src/data/site.json. Open it and edit the sections below.

Brand

"brand": {
  "name": "PaperHouse",
  "initial": "P",
  "tagline": "astro theme ~",
  "homeHref": "/"
}
  • name — appears in navbar and footer
  • initial — single letter inside the logo circle
  • tagline — handwritten text next to the name
  • homeHref — where the logo links

SEO defaults

"seo": {
  "title": "PaperHouse — Premium Astro Bento Portfolio Theme",
  "titleTemplate": "%s — PaperHouse",
  "description": "...",
  "keywords": ["astro theme", "bento portfolio"],
  "author": "PaperHouse Studio",
  "ogImage": "/astro.svg",
  "ogType": "website",
  "twitterCard": "summary_large_image",
  "twitterHandle": "@paperhouse",
  "locale": "en_US",
  "themeColor": "#FFFCF7"
}
  • title — default page title (used on home)
  • titleTemplate — how other pages format their title. %s = page name.
  • description — default meta description
  • keywords — used for <meta name="keywords">
  • author — appears in <meta name="author">
  • ogImage — default social share image
  • ogType — website or article
  • twitterCard — summary_large_image for big previews
  • twitterHandle — your Twitter handle
  • locale — en_US, en_GB, id_ID
  • themeColor — browser chrome color on mobile

Pages

Each page has its own SEO entry:

"pages": {
  "home": {
    "title": "PaperHouse — Premium Astro Bento Portfolio Theme",
    "description": "...",
    "image": "/astro.svg",
    "type": "website"
  }
}

To change the title of a page: edit pages.<key>.title.

To change the social share image: edit pages.<key>.image.

Dynamic pages use templates:

"workSlug": {
  "titleTemplate": "%s — Case Study",
  "descriptionTemplate": "Case study: %s.",
  "type": "article"
}

%s is replaced with the actual work title.

"nav": [
  { "href": "/works", "label": "Works" },
  { "href": "/blog", "label": "Journal" },
  { "href": "/about", "label": "About" }
]

Add or remove items to change the navbar. Order matters.

CTA

"cta": {
  "label": "Buy — $45",
  "href": "https://creativitaz.gumroad.com/l/paperhouse-astro-bento",
  "shortLabel": "Buy"
}
  • label — full text on desktop
  • href — where it links
  • shortLabel — fallback for tight spaces
"footer": {
  "headline": "...",
  "body": "...",
  "ctaLabel": "Get PaperHouse — $45",
  "ctaHref": "https://creativitaz.gumroad.com/l/paperhouse-astro-bento",
  "email": "hello@paperhouse.studio",
  "columns": [ ... ],
  "copyright": "©2026 PaperHouse",
  "note": "Built with Astro 7 · Tailwind 4"
}

Columns are arrays of links. Rename, reorder, add, or remove.

4. Verify your changes

  1. Save the files
  2. If the dev server is running, it reloads automatically
  3. Check the browser
  • Navbar shows your brand name and links
  • Footer shows your headline, columns, and copyright
  • View source (Ctrl + U) — meta tags show your titles

5. Common mistakes

“My site still shows PaperHouse branding.”
You edited the wrong file. Check src/data/site.json.

“My sitemap shows localhost.”
You did not set site in astro.config.mjs.

“Title shows %s — PaperHouse.”
The page’s title is missing in site.json → pages.<key>.

“OG image not showing on social.”
Use an absolute URL, or place the image in public/ and reference with a leading /.