Website

Modern Website Builder

Build modern website content with blocks and example layouts, save drafts automatically, preview your design and publish when ready.

Permissions: Edit Club Website

The modern website builder creates page content from blocks: headings, text, images, buttons, columns and live club information. You can start with an example section layout and adjust its blocks to suit your club.

Choose your website-wide layout, colours, fonts and header in Website Templates. The builder uses those settings when displaying and previewing your content.

Enable and Open the Builder

  1. Open Setup > Website > Settings, then find Website Template.
  2. Use Modern Layout & Theme, switch on Enable block editor, and click Update.
  3. Go to Setup > Website > Pages or News and add a new item. New content opens in the block builder after you create it.
  4. To return to that content later, open its details and click Edit Page Content.

Page details such as the title, description, homepage selection and members-only setting are managed on the page's details screen. The builder edits the content itself.

Existing pages and news items that already contain legacy content keep their current editor. Enabling the block editor does not automatically rebuild those pages. See Drag & Drop Page Editor for that editor.

The Edit buttons beside built-in page information in Website Settings, such as trial requests, waiting list, contact, documents, login, calendar and who's who, also open the block builder when it is enabled.

Add and Edit Content

The builder has an Add a block library, a central content area and a Block settings panel.

Click a block in the library to add it, then select it in the content area to edit its settings. Use Search blocks and layouts to find what you need.

Expand Example section layouts for ready-made groups of blocks, including welcome sections, trial invitations, training information, pool directions, safeguarding, download centres, team introductions, membership fees, sponsors and FAQs. Some layouts ask you to choose an image, document, location or video first. Replace the example text and links with your club's details before publishing.

These example layouts are starting points made from editable blocks. They are separate from the website-wide Modern Layout setting and the older saved Page Templates.

Available Blocks

Group Blocks
Content Heading, Text, HTML snippet, Table, Testimonial, Callout, FAQ, Buttons and Document.
Media Image, Icon, Cards, Image collection, Video and Map.
Layout Divider, Space, Columns and Section.
SwimClub Manager Gallery, Event results, Meet results, Club feed, Noticeboard, Featured news, Latest news, Featured pages, Who's who and Sessions.

For a Document, choose a public club document. Text links can also use Choose a website page or Choose a public document in the link editor. You can insert these directly in the builder.

Club content blocks use information already held in SCM. Choose the relevant gallery, event or meet where prompted. Featured news, latest news and featured pages let you set how many items to display.

Design and Arrange Blocks

Select a block to see its content and design controls. The available settings depend on the block:

  • Heading and Text provide font, size, colour, alignment and spacing options.
  • Buttons provide styles based on your main and accent colours, plus shape and emphasis options.
  • Columns provide responsive layouts, with controls for gaps, backgrounds, padding, borders, corners and content position.
  • Section groups blocks with a background, content width and inner, top and bottom spacing.

Use Reset design, where available, to return design settings to their defaults.

Use a block's up/down controls to reorder it, Duplicate to make a copy, and Remove to delete it. Blocks inside columns also have controls to move them to the previous or next column. Undo and Redo let you step through edits in the current editing session.

Images and Image Collections

Add an Image block to choose an uploaded image or upload a new JPEG or PNG. Select the block to set alternative text, a caption, alignment, width, crop shape and image focus. Mark purely decorative images as decorative. You can link an image to a page or let visitors open the full-size image.

Use Image collection for a grid or slideshow of selected images. Use Gallery to display an existing SCM club image gallery.

The Images button opens the image library, where you can search uploads and review where they are used. Images used by saved drafts, published content or retained revisions cannot be deleted while those references remain.

Tables, Maps, Video and HTML

Table provides controls to insert, duplicate, move and remove rows and columns. Add a caption, choose whether the first row contains headings, select a simple, striped or bordered style, and set the text size to inherit, small, standard or large. Wide tables can scroll horizontally on smaller screens.

For Map, enter an address or place, or choose Embed URL and provide a Google Maps or OpenStreetMap embed URL. Add an accessible title.

For Video, paste an HTTPS YouTube or Vimeo URL, then add an accessible title and optional caption.

HTML snippet accepts Bootstrap 5 HTML or trusted widget code when you need custom content. Forms, inline styles and inline event attributes are not supported. Most page content can be built with the standard blocks.

Drafts, Preview and Publish

Changes automatically save as a draft. Wait for Saved in the top bar before leaving the editor. Saving a draft does not update the public page.

Click Preview to see the draft within your website's saved theme and layout. Switch between Desktop, Tablet and Mobile widths, or open the private preview in a new tab. The preview expires after five minutes; open a fresh preview if needed.

When ready, click Publish and confirm. The saved draft replaces the published content. Check for the success message before leaving.

Website design settings are applied separately when you update Website Settings. Draft saving and publishing here control the content you are editing.

History and Recovery

Click History to view retained revisions. Restore to draft replaces the current draft with the selected revision. Preview it, then publish if you want it to appear on the website. Restoring alone does not change the live content.

If an unsent browser copy is available when you return, the editor offers Recover it. If another session has saved a newer draft, the editor keeps your browser copy and offers Reload newer draft or Copy my version. Resolve that conflict before continuing to publish.

Existing Content

Some built-in page information may appear as Existing content, a protected block containing the original content. You can keep it, move it or remove it after rebuilding that information with new blocks. You cannot edit the original HTML inside that protected block.

Existing pages and news items can continue to be edited with their previous editor even after you choose a modern design. For a page built with blocks, continue using the block builder; the older inline editor is not available for that content. Keep Enable block editor on while maintaining block-built content.