Guides

Build a website with Sprocket Rocket

Set up the theme, build pages, configure shared templates, and prepare the site for launch.

Before you begin

For the app workflow below, connect the HubSpot portal, create an installation, and complete the first steps. Child themes are neither required nor recommended for this workflow.

A Marketplace theme can also be used entirely in HubSpot without the app. If you choose that route, build pages in HubSpot's editor and use a child theme only when you need to customize source files.

If you plan to use the app, connect before building pages so you can start with its separate theme and avoid moving pages and recreating theme settings later. Follow Marketplace themes and the app to connect your purchase and prepare the app-managed theme.

An empty page in Page Builder, with the chat's starting cards and the empty canvas

Set the active theme

Pages you create in Page Builder already use the installation's theme and its drag-and-drop page template. When you create a page in HubSpot's own editor instead:

  1. In HubSpot, open Website Pages or Landing Pages.
  2. Create a page and enter its name.
  3. Find your Sprocket Rocket theme on the theme selection screen.
  4. Select a compatible page template.

Set up theme settings and the global header and footer before building many pages. Those shared choices reduce repeated work.

Build pages

Use Page Builder for work you would normally do in HubSpot's page editor. Select Editor in the rail, drag modules in from the module palette, and edit them on the canvas, or describe the page to Sprocket Rocket AI, or link an existing site for it to rebuild. Your edits and Sprocket Rocket's land on the same draft.

Select a module and Edit code for its HTML, CSS, JavaScript, and fields (Edit module code). When no module can do what a page needs, Sprocket Rocket AI proposes a module card. Confirm it and Sprocket Rocket builds, publishes, and places the module in the background.

The module palette open beside a page on the canvas, with Editor selected in the rail

Let Sprocket Rocket AI handle the details

Sprocket Rocket AI can take on the work that is easy to skip before launch:

  • Meta descriptions and titles: have it write them for every page, or fix a placeholder title. See Page settings and SEO.
  • Alt text: it looks at each image and writes alt text from what it sees. See Images and alt text.
  • PageSpeed: once a page is published, it can run PageSpeed Insights and fix what it can on the page. Drafts can't be tested.
  • Internal links: it can search the site for pages worth linking to. This uses HubSpot's site search, which needs Content Hub Professional.
  • Domains and redirects: it can move a page to the production domain and offer redirects from an old site's URLs to the new pages. See Domains and redirects.

Configure shared content

Prepare for launch

  • Review page content, metadata, links, and contact information.
  • Submit each form and confirm its follow-up behavior.
  • Check desktop, tablet, and mobile layouts.
  • Test keyboard focus and page headings.
  • Review the site with the performance guide.
  • Connect the production domain and verify its DNS settings.
  • Set up redirects from the old site's URLs to the new pages.