Homepage
Customize the first impression for your visitors: banner, featured events, calendar, and more.
Accessing the configuration
From the Fanz dashboard, go to Website → Homepage.
Browser preview
On the right side of the screen you'll see a browser previewer that shows exactly how your homepage looks in real-time.
- All changes are visible instantly in the preview
- No need to navigate to other pages since changes only affect the homepage
- Changes are not applied until you click Save
In the top right corner of the previewer you have:
- Desktop icon: See how it looks on computers
- Mobile icon: See how it looks on phones
- Arrow ↗: Open your actual site in a new tab
Sidebar menus
The sidebar has 5 menus to customize the homepage:
1. Banner
Configure the main banner that appears at the top of your homepage.
Banner layout
Choose from 5 layout options:
| Layout | Description |
|---|---|
| Default | Full width |
| Text Overlay | Contained with padding, text over the image |
| Side by Side | Image on the left, text on the right |
| Text Only | Only heading and subheading, no image |
| No Banner | Skip the header section completely |
Heading and subheading
Optional text fields that appear based on the chosen layout:
- Heading: Large main title
- Subheading: Smaller supporting text
Depending on the layout, these texts appear over the image, to the side, or alone.
Banner type
| Type | Description |
|---|---|
| Static | A single fixed image |
| Carousel | Multiple images that rotate automatically |
Image carousel
If you choose carousel, you can:
- Add slides: Upload as many images as you need
- Delete slides: Remove the ones you don't want
- Reorganize slides: Use the drag handle at the start of each item to change the order
- Add links: Each slide can have a link to redirect to an event or another page you want to promote
Images for desktop and mobile
You can upload separate images for desktop and mobile:
| Layout | Desktop | Mobile |
|---|---|---|
| Default | 3:1 | 2:1 |
| Text Overlay | 3:1 | 2:1 |
| Side by Side | 1:1 | 2:1 |
Tip: Always upload both versions so your site looks perfect on all devices.
2. Events Display
Configure how events are shown on the homepage.
Columns (desktop)
Choose how many columns of events to show on desktop:
| Columns | Ideal for |
|---|---|
| 1 | One featured event per row, maximum impact |
| 2 | Few events, large cards |
| 3 | Balance between size and quantity |
| 4 | Many events, medium cards |
| 5-6 | Extensive catalog, compact cards |
Image shape (aspect ratio)
The aspect ratio of event cards:
| Ratio | Description |
|---|---|
| 1:1 | Square, Instagram style |
| 2:1 | Horizontal, banner-like |
| 3:1 | Very horizontal, panoramic |
Show past events
A switch to control what happens with events that have ended:
| Status | Behavior |
|---|---|
| Enabled | Past events are shown grayed out as "finished". Visible but tickets cannot be purchased |
| Disabled | Past events don't appear on the site |
3. Calendar
A simple switch to show or hide the event calendar.
| Status | Behavior |
|---|---|
| Enabled | Shows an interactive calendar below the banner |
| Disabled | Hides the calendar |
The calendar allows users to browse events by date. Useful for theaters, cinemas, and venues with regular programming.
4. Logo Carousel
An infinite carousel of logos that appears below the banner. Ideal for showing sponsors, partners, or associated brands.
Configuration
You can add two types of logos:
| Type | Use |
|---|---|
| Filled | Logo with fill/colors |
| Outlined | Logo with outline only |
Recommended size: 2:1 ratio (double width than height)
Logos rotate automatically in an infinite carousel. If configured correctly, it looks very professional.
5. Layout
General homepage layout options.
Hide navigation bar
A switch to hide the navbar on the homepage.
| Status | Behavior |
|---|---|
| Enabled | Navbar is not shown |
| Disabled | Navbar is visible (default) |
When to use it? Useful if you're rendering your site inside an iframe or in situations where you don't want navigation to appear.
Saving changes
When you make any change, a save button appears at the bottom of the sidebar.
- Changes are visible in the previewer immediately
- Changes are only applied to your actual site when you click Save
- If you try to leave without saving, you'll be warned about pending changes
Next steps
It's not mandatory. In the Banner menu you can choose "No Banner" to completely skip the header section.
Yes. In "Events Display" you can choose 1 column, which shows events one below the other like a list.
Yes. In "Events Display" you can choose the 1:1 aspect ratio to make event cards have square images.
You can choose between 1 and 6 columns for desktop. The more columns, the smaller the cards.
In "Events Display" there's a "Show past events" switch. If you turn it off, finished events disappear from the site.
Yes. If you enable "Show past events", finished events appear grayed out marked as "finished". Users can see them but can't buy tickets.
Yes, but only if you use the carousel. Each carousel slide can have a link that redirects wherever you want (an event, another page, etc.).
Because the proportions are different. The desktop banner is wider, mobile is more vertical. If you upload both, your site looks good on all devices.
Yes. In the "Calendar" menu there's a switch to hide it. If you turn it off, the calendar won't appear.
Not right now. The banner only accepts static images or an image carousel.