Build engaging pages with HugoFox content blocks
HugoFox lets you build vibrant, information-rich pages without any code. Simply stack the content blocks you need, drag them into position and publish – it’s that quick.
1 Adding and reordering blocks
You can place up to eight blocks on a single page, choosing from 14 different block types. .
Drag-and-drop lets you change the order instantly, so the flow of text, images and interactive elements always feels natural.
Tip: plan your page first, then add blocks in any order – you can rearrange them later with zero fuss.
2 Text block
Use a Text block for headings, paragraphs, bullet lists and links. The editor is a familiar WYSIWYG toolbar, so you can style content quickly. Keep paragraphs short for easy reading and insert links to other pages on your site by clicking the chain icon.
Important: a page must contain at least one Text block for accessibility.
3 Image block
Upload a PNG, JPG or GIF (max 12 MB) from your computer or pick from Select existing image if it’s already in your library. Add an optional caption and choose where it displays – below or rollover. You can also turn any image into a link that points to another page on your website or an external site.
4 Gallery block
Showcase multiple images in a grid or slider. Drop each file in or browse from your computer; reorder with drag-and-drop until the sequence looks right. Each image inherits its own alt text for better SEO and screen-reader support.
5 Video block
Paste a YouTube or Vimeo URL and HugoFox pulls in the player automatically. Add a caption for context and you’re done.
Note: ensure your video is set to public or unlisted so visitors can view it without restrictions.
6 Table block
Present data clearly. Set the number of rows and columns, then click into each cell to enter text. Need to change the order? Drag rows up or down. Choose one of four colour and border themes to match your site palette.
7 Tournament block
Perfect for sports leagues or knockout events. Define phases, participant numbers and fixture creation rules, then add teams or players. Results tables can show club, games played, points and more – tick the columns you want. When scores are in, press Generate rankings to publish an automatically calculated leaderboard.
8 Map block
Help visitors find you. Enter a title, your HugoFox account name, address and contact number; the block displays a Google Map. A click opens the full map in a new tab so users can get detailed directions.
9 Form block
Create custom forms to gather names, emails, documents and even e-signatures. Choose from text boxes, dropdowns, checkboxes, date/time pickers and more. Rearrange fields with drag-and-drop so the form flows naturally.
Tip: add a Terms and Conditions attachment if you need consent.
10 Quote block
Highlight testimonials, mission statements or inspirational phrases. Type or paste the quotation, then add an optional author/source line.
11 Attach block
Share brochures, agendas or newsletters as downloadable files. Supported formats: PDF, DOC/DOCX, RTF, TXT, PPS/PPSX (max 12 MB). Visitors click the attachment link to open or save the document.
12 Audio block
Upload MP3, WAV or OGG files up to 12 MB – ideal for podcasts, choir rehearsals or meeting minutes. You can add descriptive text beneath the player for context.
13 Calendar block
Keep everyone on schedule by embedding your Google Calendar. Copy the iCal link from Google Calendar settings, then paste it into the block. Visitors can add events to their own calendars by clicking Add to Calendar. For detailed Google steps, click this link.
14 Contact block
Add a friendly face and key details. Upload a profile image, press Add/Edit description and enter the name, role and any other information in the text box beneath.
15 Text scroller block
Draw attention to announcements such as road closures or late results. Give the scroller a title, then add up to three short lines of text that cycle automatically.
16 Customise your site design
Open the Website (Customise) tab – found in your dashboard, not inside the page builder – to fine-tune the overall look of your site. Any changes you make here apply to every page. You can set:
-
Menu background, text and hover colours
-
Page background, content borders and link styles
-
Button colours (normal and hover)
-
Footer background and text colour
-
Global fonts and sizes
Six pre-built layouts appear at the bottom; pick one, preview on the right-hand panel and click Save in the top-right corner when you’re happy.
Tip: use the yellow magnifying-glass icon beside each page in the Website list to preview your design tweaks before they go live.
Conclusion
With drag-and-drop blocks and site-wide design controls, building an engaging HugoFox site is as simple as click, customise and publish.
Need a hand? Our support team is here 24/7:
-
Email us at team@hugofox.com
-
Use the contact page
-
Silver or Gold customer? Call us on 01635 888 442