Using this theme

Getting Started

Install Hugo 0.158 or newer, then run hugo server in exampleSite/ to work on the site and hugo to produce it in public/. Start in hugo.toml: the site’s name, URL, owner, contact details, social links, menu and footer columns are all set there. The docs/ folder has the longer version of everything on this page.

Three Personas

The theme presents its owner in one of three ways, each with its own home, about and contact page:

• Investor: /, /investor/about/ and /investor/contact/
• Founder: /founder/, /founder/about/ and /founder/contact/
• Serial Entrepreneur: /serial-entrepreneur/, /serial-entrepreneur/about/ and /serial-entrepreneur/contact/

The ventures, thesis, podcast and blog pages, the legal pages and the header and footer are shared by all three. The personas’ names, firm and city are params.personas in hugo.toml; the menu lists them as Home, About and Contact A, B and C (menus.main). Keep the persona that fits you, put your own name in, then delete the other two’s folders in content/ and their entries in menus.main. The Investor home is /; to make another persona the home page, copy its template to layouts/home.html and update menus.main.

Content

Repeated content is read from content and data files, never pasted into the templates. Ventures and blog posts are Markdown files in content/ventures and content/blog, with their categories in content/ too; everything else is a JSON file in data/:

• Ventures and their categories, focus areas, milestones and experiences
• Blog posts and their categories
• FAQs, awards, events, testimonials and talks
• The podcast page’s topics, appearances and recorded talks (videos)

Add a file and its page appears: a venture at /ventures/its-name/, a post at /blog/its-name/, and a category page for every category that has an entry. Images are referenced from assets/images by path, so replacing a file keeps the layout intact.

Forms

The newsletter signup in the footer and the three contact forms post to the endpoints in params.forms (hugo.toml), which are empty when the theme ships. Until you set one, a form checks its fields, sends nothing and says so; it shows its success message only after your endpoint answers. Any service that accepts a form post will do. The protected page (/401/) is a design only: it is not connected to a password check, and its form sends nothing.

Motion

Reveals, counters and scrubbed sections use GSAP with ScrollTrigger and SplitText, and Lenis smooths scrolling on devices with a mouse. Pages ask for an effect with a data-anim attribute; every effect, with its timing, is in EFFECTS in assets/js/motion.ts. With reduced motion turned on in the visitor’s system settings, everything is shown at once, nothing moves and smooth scrolling is off. Strips that scroll on their own have a pause button. Videos play only when pressed, and a recorded talk on the podcast page loads YouTube’s player only when someone presses play (set its videoUrl in data/videos.json).

Colors, Type and Images

Colors, type sizes and spacing are design tokens in tailwind/theme.css; the style guide shows them in use. The two font families are served from static/fonts and declared in tailwind/fonts.css. Hand-written corrections belong in tailwind/additions.css; npm run build:css compiles the sheet the theme serves.

Before Publishing

• Set the site’s address (baseURL) and your own name, email and social links.
• Replace the demo content. Every person, company, award, event and figure in it is invented, and the photos and videos are placeholders (see Licenses).
• Replace the privacy policy and terms with your own, naming your form provider and host.
• Connect the forms, or remove the ones you will not use.
• Delete the persona pages you do not use, this page and the style guide.