Guide - NeuroSites

Quick Start

Browse

Use category tabs (Lab Websites, Personal Pages, Event Promotions, Package Wikis), search, and filters to narrow options on the Templates page.

Preview

Click View Template to see layout and interactions before you commit.

Use It

Open View Code on GitHub, download the folder, and make it yours.

Tip: most templates have a README.md with template-specific notes (sections to edit, image sizes, deployment hints).

Customize Your Template

Once you've chosen a template, here's how to make it your own:

Content & Text

Edit text directly in index.html and any section files. Replace placeholder content with your own research, bio, or project information.

Images & Media

Replace files in assets/images/ with your own photos, logos, or graphics. Update the <img> paths accordingly.

Colors & Branding

Customize the color scheme by tweaking CSS variables, usually found at the top of style.css. Perfect for lab or personal branding.

Basic Customization

Content: edit text in index.html (and section files if present).
Images/Logo: replace files in assets/images/ and update the <img> paths.
Colors: tweak CSS variables (usually at the top of style.css):

:root {
  --bg: #101532;
  --fg: #fafdff;
  --accent: #6288a7; /* try your lab color */
}

Fonts: update the font-family on body or :root.

Customization Tip

Start with small changes like colors and text before diving into layout modifications. Most templates are designed to work great with minimal adjustments.

Advanced (optional)

Layout: adjust Grid/Flex in section wrappers.
Interactions: edit script.js for menus, tabs, or animations.
Responsive: refine @media breakpoints.
SEO: set <title>, meta description, and Open Graph tags.
Accessibility: add alt text, check contrast, and keep headings in order.

Publish Your Website

Ready to go live? Here are the best free options for hosting your NeuroSites template:

Free

GitHub Pages

Create a repo and add your files (ensure index.html at the publish root)
Settings → Pages → Build from main (or /docs) → Save
Wait ~2 minutes for the site to go live at username.github.io/repo

Free Tier

Netlify

Sign in → "Add new site" → Deploy manually (drag & drop) or connect Git
Get an instant URL; turn on automatic deploys if using Git

Free Tier

Vercel

Import from GitHub → Framework: Other/Static
Deploy; add a custom domain if you want

Quick Deploy Tip

For the fastest deployment, try Netlify's drag-and-drop feature. Just zip your template folder and drop it on their deployment page!

Troubleshooting

Common issues and how to fix them:

404 on Pages

The selected branch/folder must contain index.html at its publish root.

Images not showing

Check file paths and filename casing (GitHub Pages is case-sensitive).

CSS not applying

Confirm the <link href="style.css"> path and hard refresh.

Fonts look off

Ensure font files/URLs exist and load over HTTPS.

Browse Templates Get Support View on GitHub