# Floggy Documentation > Full documentation corpus for Floggy. Each section below is one page, in sidebar order, separated by a horizontal rule. ## For coding agents: install the Floggy skill If you are an AI coding agent (Claude Code, Codex, Cursor, and friends) setting up Floggy for a user, install the Floggy skill first so you keep the knowledge of how to publish to and read from their blog: 1. Find the user's agent config directory. It is a `.claude/` or `.agents/` folder, either in the project root (project-local, preferred) or in their home directory (global). 2. Inside it, make sure a `skills/` folder exists. Create it if missing. 3. Inside `skills/`, create a `floggy/` folder. 4. Fetch `/skills/floggy/SKILL.md` and save it verbatim as `skills/floggy/SKILL.md`. Resulting layout: ``` .claude/skills/floggy/SKILL.md ``` That is all. The skill loads as `floggy` on your next run. It teaches the `floggy` CLI (publish and manage posts, notes, tasks, uploads) and the `@floggy/cms` library (read published content into any site), and points back to these docs for exact commands. Every action is scoped by an API key the user creates in the dashboard (Settings then Developer), so a key only ever has the access they grant it. --- # Getting started / Introduction Source: /docs/introduction Floggy is your corner of the internet. One place to publish writing, show your work, keep your notes and tasks, and let people book time with you - all under a domain and identity you own. Most tools make you choose: a blog here, a portfolio there, a scheduling link somewhere else. Floggy puts them together so your readers meet one coherent version of you, and you keep control of your address and your data. ## What Floggy is Floggy is a hosted platform for building an independent presence on the web: - **A blog** written in a full-screen editor, not a cramped text box. - **A portfolio** with custom sections for projects, experience, links, galleries, and more. - **Notes and tasks** that live right beside your writing. - **Bookings** so readers can grab time on your calendar. - **Your own address**, either a free `you.floggy.xyz` subdomain or a custom domain you already own. Your content is yours. You can export everything to a single JSON file at any time. ## Who it's for Floggy fits anyone building a personal, independent tech identity: writers, engineers, designers, founders, and freelancers who want a real home online instead of a profile on someone else's platform. If you can write a document, you can run a Floggy site. Nothing here needs code. There is also a developer path (SDK and CLI) for people who want to pull their content into other apps, but that is entirely optional. ## What you can build - A writing-first blog with tags, drafts, and scheduled posts. - A portfolio homepage that leads with who you are and what you've shipped. - A newsletter your readers can subscribe to, sent straight from your posts. - A booking page where people schedule calls against your real availability. - A private workspace of notes and tasks that only you see. ## Free and Pro Floggy has a Free tier and a Pro tier. Free covers the core: your blog, portfolio, subdomain, and recent analytics. Pro unlocks premium themes, a custom domain, the newsletter, calendar bookings, notes, tasks, full analytics history, and the headless CMS. You can see the current plan details and pricing in **Settings > Billing**. ## Map of the docs Start here, then branch out: | Guide | What it covers | |-------|----------------| | [Quickstart](/docs/getting-started/quickstart) | Signup to a live blog in a few minutes | | [Your blog](/docs/getting-started/your-blog) | Subdomain, custom domain, profile, sections, navigation | | [Writing](/docs/getting-started/writing) | The editor, drafts, publishing, visibility, images | | [Custom domain](/docs/getting-started/custom-domain) | Connecting a domain you own | | [Themes](/docs/getting-started/themes) | Choosing and customizing your look | | [Calendar](/docs/getting-started/calendar) | Connecting a calendar and taking bookings | | [Analytics](/docs/getting-started/analytics) | Who's reading, and how you'd know | Building something on top of Floggy? The [CMS SDK](/docs/cms) (`@floggy/cms`) and the [CLI](/docs/cli) (`@floggy/cli`) have their own docs. --- # Getting started / Quick start Source: /docs/quickstart This is the fastest path from a fresh signup to a live blog you can share. Plan for a few minutes. You don't need any technical setup. ## 1. Create your account Go to the signup page and create an account. Once you're in, Floggy takes you straight into onboarding. ## 2. Pick your username Your username becomes your web address. Whatever you choose here, your blog goes live at: ``` https://your-username.floggy.xyz ``` Pick something short and recognizable. You can connect a custom domain later without losing this address. ## 3. Fill in your profile Onboarding walks you through a few short steps. Add: - A **display name** and a one or two line **bio**. - A **profile photo**. - Your **work status** (hidden, "Open to opportunities", or "Currently employed" with your role and company). - **Social links** to the places people can find you. Every step is skippable. You can change all of it later in **Settings > Profile**. ## 4. Add sections and choose a theme Still in onboarding, you can add portfolio **sections** (like Projects or Experience), set up your **navigation** menu, and choose a **theme**. The live preview on the side updates as you go. Skip anything you're not ready for. ## 5. Write your first post From your dashboard, open **Posts** and click **New Post**. This opens the full-screen editor. Give the post a title, write your content, and optionally add a cover image and a short excerpt. For the full tour of the editor, see [Writing](/docs/getting-started/writing). ## 6. Publish it In the editor, set the post's **Status** to **Published** and its **Visibility** to **Public**. That's it - the post is live. ## 7. View your public site Open your blog in a new tab: ``` https://your-username.floggy.xyz ``` You'll see your profile, your sections, and your new post exactly as visitors do. Copy that link and share it anywhere. ## Where to go next - Shape your public presence in [Your blog](/docs/getting-started/your-blog). - Use a domain you own in [Custom domain](/docs/getting-started/custom-domain). - Change your look in [Themes](/docs/getting-started/themes). --- # Getting started / Create your blog Source: /docs/your-blog Your Floggy site is your public presence: your address, your profile, your portfolio sections, and your navigation. This guide covers what visitors see and how you shape it. ## Your address Every account gets a free subdomain: ``` https://your-username.floggy.xyz ``` This is live from day one and never expires. On the Pro tier you can also connect a domain you already own, like `yourname.com`, and it becomes your blog's main address. See [Custom domain](/docs/getting-started/custom-domain) for the setup. You'll find your address any time in **Settings > Domain**, which shows both your subdomain and any custom domain you've added. ### Preview vs public There are two ways to look at your site: - **Public view** is what everyone sees, at your subdomain or custom domain. - **Preview** is the owner-only editor and admin view at `/preview/your-username`. Only you can open it. If someone else tries, they're sent to your public site instead. You'll use preview to write posts and customize your theme, and the public URL to share. ## Your profile Your profile is the top of your homepage. Edit it in **Settings > Profile**: - **Profile picture**, **display name**, and **bio**. - **Work status**: choose "Don't display", "Open to opportunities" (shows a badge), or "Currently employed" (shows your role and company, with an optional company logo and website). - **Social links** to your other accounts. There's also a **Co-authoring** toggle here. When it's on, other Floggy users can invite you to co-author their posts. ## Portfolio sections Sections are the custom blocks that make up your homepage below your profile - things like Projects, Experience, Skills, or a gallery. Manage them in **Settings > Sections**. Sections come in a few shapes so you can present different kinds of content: | Layout | Good for | |--------|----------| | Text | An about blurb or any prose | | List | Links, roles, or simple line items | | Cards | Projects or featured work | | Timeline | Experience or a history | | Gallery | Images and visual work | Add as many as you like and reorder them to control how your homepage reads. ## Navigation Your navigation menu is the set of links at the top of your site. Edit it in **Settings > Navigation** to add links to your own pages or to external sites. This is how visitors move between your homepage, your blog, and anywhere else you want to point them. ## Your blog page and homepage layout In **Settings > Blog** you control how your posts appear: - **Blog layout** sets how posts show on your homepage. - **Posts section title** is the heading above them (default is "Latest" - try "Writing", "Posts", or "Articles"). - **Blog page layout** sets how posts look on your full blog page, as a **List**, **Grid**, or **Compact** view. ## What visitors see Put together, a visitor landing on your site sees: 1. Your profile - photo, name, bio, and status. 2. Your portfolio sections in the order you set. 3. Your posts, in the layout you chose. 4. Your navigation menu to reach everything else. To change the overall style and colors, head to [Themes](/docs/getting-started/themes). --- # Getting started / Writing posts Source: /docs/writing Writing on Floggy happens in a full-screen editor, not a small box wedged into the dashboard. This guide covers writing, publishing, and managing your posts. ## The editor From your dashboard, open **Posts** and click **New Post**. This opens the full-view editor, built on a rich (Tiptap) writing surface. You get a clean, distraction-light page with room to actually write. A post has these parts: - **Cover image** - an optional image shown at the top of the post. - **Title** - required. - **Excerpt** - an optional short summary used in listings and previews. - **Content** - your main writing, with rich formatting (headings, lists, quotes, links, images, and more). Your work is saved as you go, so you can leave and come back. ## Drafts vs published Every post has a **Status**: - **Draft** - only you can see it. This is where posts start. - **Published** - live on your site (subject to visibility, below). You can flip a post between draft and published at any time from the editor, or in bulk from the posts list. ## Visibility Separate from status, each post has a **Visibility** setting that controls who can reach it once published: | Visibility | Who can see it | |------------|----------------| | Public | Anyone. Shows up on your blog and in listings. | | Link only | Anyone with the direct link, but it's not listed publicly. | | Private | Only you. | Use **Link only** for something you want to share with a few people without putting it on your homepage. ## Images and uploads Add a **cover image** at the top of the editor, and drop images directly into your content while writing. Uploads are hosted for you - no separate image host needed. ## Publishing and promoting When you create a post, you can opt into a **publishing flow** that automatically creates a small set of linked tasks (draft, edit, publish, promote) so you can track a post from idea to launch. This is optional and off unless you turn it on. The first time you publish a public post, Floggy can offer to send it to your newsletter subscribers, if you have the newsletter set up. See the newsletter section in **Settings** for details. ## Scheduling and backdating Posts can be **scheduled**: a published post with a future date shows up in your posts list with a "scheduled" badge until its time comes. In the posts list you can filter by **All**, **Published**, **Scheduled**, and **Draft** to keep track. Setting a specific future publish time or backdating a post to an earlier date is handled through the [CLI](/docs/cli), which gives you precise control over publish dates. ## Managing your posts The **Posts** page is your control center: - **Search** posts by title. - **Filter** by status (all, published, scheduled, draft). - **Sort** by date, title, or views. - **Bulk actions**: select multiple posts to publish, unpublish, or delete them at once. - **Copy URL** to grab a post's public link, or open it in a new tab. - **Views** show next to each post so you can see what's landing. Tags help you group related posts together and are carried with your content when you export. If you invite collaborators, co-authored posts appear under the **Co-Authored** tab. --- # Getting started / Custom domain Source: /docs/custom-domain Your blog lives at `your-username.floggy.xyz` by default. On the Pro tier you can point a domain you own at it instead, so your site loads at your own address. This guide walks through it. ## Before you start - Connecting a custom domain is a **Pro** feature. You can check your plan in **Settings > Billing**. - You need a domain you already own, and access to its DNS settings (at your registrar or DNS provider, like Cloudflare, Namecheap, or GoDaddy). ## 1. Add your domain Go to **Settings > Domain**. You'll see your Floggy subdomain listed, and a **Custom Domain** field below it. Type in the domain you want to use and click **Save**. You don't need to include `https://` - just the domain itself: ``` yourdomain.com ``` ## 2. Add the DNS record After you save, Floggy shows the exact DNS record to add. Copy it into your DNS provider. It's a **CNAME** record that points your domain at Floggy's hosting: | Type | Name | Value | |------|------|-------| | CNAME | your domain | (shown in the dashboard) | Always use the exact value shown in **Settings > Domain** - that screen is the source of truth. DNS providers word their fields slightly differently, but you're looking for "Type: CNAME", the host/name set to your domain, and the target value pasted in. ## 3. Verify Back in **Settings > Domain**, click **Verify**. Floggy checks whether your DNS record is live and pointing the right way. DNS changes can take a little time to spread across the internet - sometimes minutes, occasionally longer. Floggy also re-checks automatically in the background while you're on the Domain tab, so if it doesn't verify immediately, leave it a bit and check again. Once it succeeds, you'll see a "Domain verified and active" confirmation. ## 4. You're live Once verified, your custom domain becomes your blog's main address. Everything - your homepage, posts, booking page, and links - now uses it. ## Managing your domain - To stop using a custom domain, open **Settings > Domain** and click **Remove**. Your `your-username.floggy.xyz` subdomain keeps working as always. - Your subdomain never goes away, even with a custom domain connected. It stays available as a fallback. ## Troubleshooting - **Verify keeps failing.** Double-check the record against what the dashboard shows, and confirm you added it to the correct domain. Newly added records can take time to propagate. - **The domain loads the wrong site.** Make sure there isn't an older conflicting record (for example an existing A or CNAME on the same name) at your DNS provider. --- # Getting started / Themes Source: /docs/themes A theme sets the overall look of your site - its layout, typography, and feel. Floggy ships with a handful of themes, and you can fine-tune colors and details on top of any of them. This guide covers choosing and customizing your theme. ## Choosing a theme Go to **Settings > Theme**. You'll see a card for each available theme with a small preview. Click one to select it, then click **Save Theme**. Your site reloads with the new look. The built-in themes: | Theme | Style | |-------|-------| | Floggy | Clean, minimal blog theme (the default) | | Void | Dark, focused, typography-first | | Snow | Light, warm, minimal portfolio (Pro) | | Memento | Dark editorial, typographic, compact | **Floggy** is the default and a safe starting point. Some themes are marked **Pro** and show a lock until you upgrade. ## Customizing your theme Choosing a theme sets the foundation. To adjust colors, typography, and spacing, you customize on the live blog itself rather than inside the dashboard. From **Settings > Theme**, click **Open Blog & Customize**. This opens your blog in customize mode (the owner-only preview) where you can tweak the details and see changes on your real content as you make them. ## Blog layout options Separate from the visual theme, you control how your posts are laid out in **Settings > Blog**: - **Blog layout** - how posts appear on your homepage. - **Blog page layout** - how posts appear on your full blog page: **List**, **Grid**, or **Compact**. These work with any theme, so you can mix a theme's style with the post layout you prefer. ## Favicon While you're in **Settings > Theme**, you can upload a custom **favicon** - the small icon shown in browser tabs and bookmarks. A 32x32 or 64x64 PNG works well. Leave it blank to use the default. ## Premium themes Premium themes are part of **Pro**. Beyond the Pro themes shown in the picker, some themes unlock with a code: on the Theme tab, use **Import Theme** and enter a theme code to add it to your account. ## Exporting your look Your theme choice, colors, and favicon are included when you export your data from **Settings > Export/Import**, so you can back them up or move them between accounts. --- # Getting started / Calendar & bookings Source: /docs/calendar Floggy can turn your site into a booking page. Connect your calendar, set your availability, and visitors can grab time with you against your real schedule. This guide covers the setup. ## Before you start Calendar booking is a **Pro** feature. You can check your plan in **Settings > Billing**. You manage everything from the **Calendar** section of your dashboard, which is organized into tabs: Connection, Availability, Meeting, Anti-Spam, and Bookings. ## 1. Connect your calendar Open **Calendar > Connection** and click **Connect Google Calendar**. You'll be sent to Google to grant access, then returned to Floggy. Once connected, your account and email show here, and you can disconnect at any time. Google Calendar is supported today. Microsoft is marked "Coming Soon". ## 2. Turn on bookings With a calendar connected, flip on **Accept Bookings**. Floggy shows your public booking page URL, which lives at: ``` https://your-username.floggy.xyz/catchup ``` If you've connected a custom domain, it uses that instead. Share this link, or let visitors reach it from your site. ## 3. Set your availability In the **Availability** tab: - **Timezone** - Floggy auto-detects yours; you can search and change it. Visitors see times converted to their own timezone automatically. - **Weekly schedule** - enable the days you're available and set start and end times for each. Use "Copy to all active days" to apply the same hours across your open days quickly. ## 4. Configure the meeting In the **Meeting** tab: | Setting | Options | |---------|---------| | Duration | 15, 30, 45, 60, 90, or 120 minutes | | Buffer between meetings | None, 5, 10, 15, or 30 minutes | | Minimum notice | None up to 1 day | | Maximum advance | 1 week up to 3 months | Add a **meeting title** and optional **description**, then pick how video calls are handled: - **Google Meet** - a Meet link is generated automatically for each booking. - **Custom link** - use your own Zoom, Around, or other meeting link. - **No video call** - for phone or in-person meetings. ## 5. Keep spam out The **Anti-Spam** tab covers protection. Floggy has built-in safeguards (rate limiting, a bot honeypot, and input validation) always on. You can also block specific email domains by listing them, one per line, to keep throwaway addresses out. ## Managing bookings When someone books, the event lands on your connected calendar and the attendee gets the details. The **Bookings** tab shows your booking history - each with the booker's name, email, date and time, and status. You can cancel a confirmed booking from here, and the attendee is notified. ## Where it appears for visitors Visitors book at your `/catchup` page. They pick a slot from your available times (shown in their own timezone), enter their details, and confirm. That's it - the meeting shows up on both calendars. --- # Getting started / Analytics Source: /docs/analytics Floggy has built-in analytics so you can see who's reading without adding a tracking script or wiring up a third-party dashboard. This guide covers what's tracked and where to find it. ## Where to find it Open **Analytics** from your dashboard. If tracking is still being set up for your site, you'll see a short "not configured yet" note; otherwise your numbers load right in. ## The headline numbers At the top you get four stat cards, each compared against the previous period: | Metric | What it means | |--------|---------------| | Visitors | Unique people who came to your site | | Pageviews | Total pages loaded | | Bounce rate | Share of visits that left after one page | | Avg. time | Average time spent per visit | Below that, a chart plots visitors and pageviews over time so you can spot trends. ## Real-time When people are on your site right now, a live **"X online"** badge appears at the top. It refreshes automatically every 30 seconds. ## Digging in Tabs break your traffic down further: - **Overview** - top pages and top referrers side by side. - **Pages** - your most-visited pages, including individual posts. - **Referrers** - where visitors came from (search, social, direct, other sites). - **Devices** - browsers, operating systems, and device types. - **Countries** - where your readers are in the world. There's also a quick insights strip that surfaces highlights from your data. ## Time ranges and tiers Use the period selector (top right) to change the window. **Free** accounts see the last **7 days**. **Pro** unlocks the longer ranges: 30 days, 90 days, 6 months, 1 year, and all-time. You can check your plan in **Settings > Billing**. ## Privacy-friendly by design Floggy's analytics are privacy-first. They focus on aggregate traffic - views, sources, rough location and device - rather than tracking individuals across the web, so you get what you need to understand your audience without invasive profiling. ## If your numbers look empty - **Brand-new site?** Data appears as you start getting traffic. Give it time. - **Everything reads zero or fails to load?** An ad blocker or privacy extension in your own browser may be blocking the analytics request. Try disabling it for your site, or check from another browser. --- # CMS SDK / Overview Source: /docs/cms `@floggy/cms` is the single dependency you install to build a blog on [Floggy](https://floggy.xyz). It returns your content fully typed and ready to render - html, markdown, SEO metadata, JSON-LD, and feeds - so you drop it straight into your pages. Zero runtime dependencies. ## Install ```install npm install @floggy/cms pnpm add @floggy/cms bun add @floggy/cms yarn add @floggy/cms ``` ## Quickstart A working blog index plus a post page, with SEO, in about 15 lines. ```ts import { createClient } from "@floggy/cms"; const floggy = createClient({ project: "projecta" }); // Blog index const { posts, pageInfo } = await floggy.posts.list({ page: 1, perPage: 10 }); for (const post of posts) { console.log(post.title, "/" + post.slug); } // Post page (rendered HTML + adjacent nav + SEO block + JSON-LD) const post = await floggy.posts.get("hello-world", { format: "html" }); console.log(post.rendered); // ready-to-inject HTML string console.log(post.adjacent.prev); // { slug, title } | null const metadata = floggy.seo.meta(post); // plain Next.js-compatible Metadata object ``` ## Configuration ```ts createClient({ project: "projecta", // required: the Floggy username/project key: process.env.FLOGGY_KEY, // optional: flg_ key for drafts/private content site: { // optional: used by feeds.* url: "blog.example.com", // public origin (protocol auto-added) name: "Example", // defaults to project name description: "My blog", // defaults to "'s blog" locale: "en", // defaults to "en" }, fetch: customFetch, // optional: custom fetch implementation }); ``` ## Auth Public reads need no key. Pass an `flg_` key only to read drafts or private content. Use a Read-only key in any frontend - a leaked read key only exposes content that is already public. Never embed a Full-access key in a frontend. ```ts const floggy = createClient({ project: "projecta", key: process.env.FLOGGY_KEY }); ``` ## Methods at a glance The client exposes four namespaces: - `posts` - `list`, `get`, `search` - `tags` - `list` - `seo` - `meta`, `jsonLd` - `feeds` - `sitemap`, `rss`, `robots` See the [SDK reference](/docs/cms/sdk) for full signatures, options, and return shapes. ## Errors Every non-2xx response throws a typed error. ```ts import { FloggyError, RateLimitError } from "@floggy/cms"; try { await floggy.posts.get("missing"); } catch (err) { if (err instanceof RateLimitError) { console.log("retry after", err.retryAfter, "seconds"); } else if (err instanceof FloggyError) { console.log(err.status, err.message, err.code); } } ``` `FloggyError` carries `status`, `message`, `code`, and `url`. `RateLimitError` (status 429) adds `retryAfter` (seconds, parsed from the Retry-After header). ## Next - [Quickstart](/docs/cms/quickstart) - list, fetch, render, and add SEO in about 15 lines. - [SDK reference](/docs/cms/sdk) - every `@floggy/cms` method, with Next.js and TanStack Start examples. - [Authentication](/docs/cms/authentication) - creating `flg_` keys, the scope table, presets, and key-safety rules. - [Webhooks](/docs/cms/webhooks) - subscribe to `post.published` / `post.updated` and verify signatures. --- # CMS SDK / Quickstart Source: /docs/cms/quickstart A blog index, a rendered post, and SEO metadata. About 15 lines. ## Install ```install npm install @floggy/cms pnpm add @floggy/cms bun add @floggy/cms yarn add @floggy/cms ``` ## The loop: list, fetch, render, describe ```ts import { createClient } from "@floggy/cms"; // No key needed for published, public content. const floggy = createClient({ project: "projecta" }); // Blog index const { posts, pageInfo } = await floggy.posts.list({ page: 1, perPage: 10 }); for (const post of posts) { console.log(post.title, "/" + post.slug); } console.log(`page ${pageInfo.page}, hasMore: ${pageInfo.hasMore}`); // One post, rendered to HTML, with SEO ready to drop in const post = await floggy.posts.get("hello-world", { format: "html" }); console.log(post.rendered); // ready-to-inject HTML string const metadata = floggy.seo.meta(post); // Next.js-compatible Metadata object ``` That is the whole loop: list, fetch, render, describe. ## Next.js App Router A complete post page with metadata, rendered HTML, and JSON-LD. ```tsx // app/[slug]/page.tsx import { createClient } from "@floggy/cms"; const floggy = createClient({ project: "projecta" }); export async function generateMetadata({ params }: { params: { slug: string } }) { const post = await floggy.posts.get(params.slug); return floggy.seo.meta(post); // title, description, openGraph, twitter, alternates.canonical, robots } export default async function PostPage({ params }: { params: { slug: string } }) { const post = await floggy.posts.get(params.slug, { format: "html" }); return (

{post.title}

{floggy.seo.jsonLd(post).map((node, i) => (