# Flatsome

> Flatsome is a theme & site builder for WooCommerce. It offers a large collection of pre-designed websites, patterns and blocks, ready for humans and AI agents to use.

## Getting started

- [Introduction](/docs/introduction.md): What Flatsome is made of and how the pieces fit together.
- [Installation](/docs/installation.md): Download the Flatsome Site Builder plugin from your account and install it in WordPress. The setup wizard installs the theme.
- [Setup wizard](/docs/setup-wizard.md): Activate, install WooCommerce, pick modules, and import a demo site in one guided flow.
- [Your first page](/docs/first-page.md): A tour of the Flatsome Builder: canvas, inserter, block settings, breakpoints, and publishing.
- [Activate your license](/docs/activate-license.md): Register your license key to unlock one-click updates, and choose which release channel you follow.
- [Start from a demo site](/docs/demo-site.md): Import a complete demo site from the setup wizard and make it your own.
- [Server recommendations](/docs/server-recommendations.md): Minimum requirements and recommended PHP settings for running Flatsome.

## Site setup

- [Set your homepage and blog page](/docs/homepage-and-blog-page.md): Choose which page is the front page and where posts are listed.
- [Add a logo and favicon](/docs/logo-and-favicon.md): Set the site logo, a light version for dark headers, and the site icon shown in browser tabs.
- [Turn modules on and off](/docs/enable-modules.md): Enable only the features your site needs from the Modules screen.
- [Enable maintenance mode](/docs/maintenance-mode.md): Show a coming-soon page to visitors while you keep working on the site.
- [Build a custom 404 page](/docs/404-page.md): Design the page visitors see when a URL does not exist.
- [Set up SEO](/docs/seo.md): Title templates, social previews, structured data, and sitemaps with the built-in SEO module.
- [Add a cookie notice](/docs/cookie-notice.md): Turn on the cookie notice and edit its text, look, and timing.
- [Add an age gate](/docs/age-gate.md): Ask visitors to confirm their age before they see the site.
- [Speed up your site](/docs/speed-up-your-site.md): Performance settings, caching plugins, and image habits that keep pages fast.
- [Give support access to your site](/docs/support-access.md): Create a temporary administrator account for the support team and remove it afterwards.

## Design

- [Change fonts and add custom fonts](/docs/fonts.md): Pick site-wide fonts, install fonts from a collection, or upload your own font files.
- [Change site colors](/docs/site-colors.md): Set brand colors in the palette so buttons, links, and badges follow automatically.
- [Add custom CSS](/docs/custom-css.md): Add site-wide CSS in Global Styles, and know when block settings are the better tool.
- [Add custom code and scripts](/docs/custom-code.md): Where embeds, tracking scripts, and PHP snippets belong.

## Header and footer

- [Edit the header](/docs/edit-header.md): Change the header layout, logo, sticky behavior, and what shows on mobile.
- [Edit the footer](/docs/edit-footer.md): Change the footer columns, add menus and payment icons, and set its colors.
- [Create a mega menu](/docs/mega-menu.md): Turn a menu item into a full-width dropdown panel filled with any blocks.
- [Set up the mobile menu](/docs/mobile-menu.md): Build the slide-out menu shown on phones and tablets with the Off-Canvas Menu block.
- [Add social follow and share links](/docs/social-links.md): Set your profile URLs once and show follow icons and share buttons anywhere.

## Content

- [Reuse content with patterns](/docs/patterns.md): Insert ready-made layouts from the Flatsome library and turn your own blocks into synced or unsynced patterns.
- [Build a slider](/docs/build-a-slider.md): Create a slider from banners or any blocks, with autoplay, arrows, and dots.
- [Add a video background to a banner](/docs/banner-video.md): Use a video layer behind banner or section content, with an image layer as the fallback.
- [Open images in a lightbox](/docs/lightbox.md): Let visitors enlarge images and galleries in an overlay.
- [Create a popup](/docs/popup.md): Open a size guide, a form, or any content in a popover from a button.
- [Link to a section on the page](/docs/anchor-links.md): Give a heading an anchor and link to it from a button or menu item.
- [Add a contact form](/docs/contact-form.md): Build a form with the Forms module, get notified by email, and review submissions in the inbox.
- [Add a newsletter signup](/docs/newsletter-signup.md): Collect email addresses with a form and export them to your mailing list.
- [Show an Instagram feed](/docs/instagram-feed.md): Connect an Instagram account and show its latest posts in a grid or slider.
- [Add a Google map](/docs/google-map.md): Add a Google Maps API key and place a styled map with an overlay on any page.
- [Design the blog](/docs/blog-layout.md): Edit the blog archive and single post templates and show posts anywhere with the Posts block.

## WooCommerce

- [Customize the product page](/docs/product-page.md): Edit the Single Product template, change tabs and related products, and give specific products their own layout.
- [Customize the shop and category pages](/docs/shop-page.md): Edit the Product Catalog template, change the page header and product cards, and add a banner to a category.
- [Show products on any page](/docs/products-block.md): Use the Products block to list featured, on-sale, or hand-picked products as a grid or slider.
- [Enable catalog mode](/docs/catalog-mode.md): Show products without selling them: hide add-to-cart buttons, and optionally prices, for everyone or for guests only.
- [Add a wishlist](/docs/wishlist.md): Let shoppers save products with the Add to Wishlist button and a wishlist icon in the header.
- [Add product quick view](/docs/quick-view.md): Open products in a popup from listings and design the Quick View template part.
- [Customize cart, checkout, and account pages](/docs/cart-checkout-account.md): Edit the cart, checkout, and my account templates, the mini-cart, and the checkout breadcrumbs.
- [Create automatic discounts](/docs/automatic-discounts.md): Set up sales, quantity breaks, and buy-X-get-Y deals with Dynamic Pricing.
- [Set quantity rules](/docs/quantity-rules.md): Require minimum, maximum, or stepped quantities per product or category.
- [Show estimated delivery dates](/docs/estimated-delivery.md): Show when an order will arrive on product pages, based on business days, a cut-off time, and delivery windows per product.

## AI agents

- [Connect an AI assistant](/docs/connect-ai-assistant.md): Let Claude, Claude Code, Codex, or any MCP client manage your site, and decide what each connection may do.

## Blocks

- [Banner](/docs/banner.md)

## Migration

- [From Flatsome Classic](/docs/from-flatsome-classic.md): Migrate a site built with the Flatsome Classic theme and UX Builder to the Site Builder.