Remarque : même si nos guides les plus populaires ont été traduits en français, certains guides sont uniquement disponibles en anglais.

Styling the Events Page

You can use the Site Styles panel to customize the way your Events Page appears. This is a great way to align your events' design and presentation with your site's brand.

Note: The discontinued Marquee family has different style tweaks.
This guide is for version 7.0. To style Events Pages in version 7.1, visit Version 7.1 style and design options.

Landing page vs. event item pages

Before styling your events, it's a good idea to understand how Squarespace structures them on all sites. Events are organized in two parts: Events Pages, which create a browsable landing page, and then individual event item pages. These areas share some style tweaks, but also have their own style options.

To learn more, visit Using the Events Page.

Choose a layout

Remarque : l’affichage Calendrier n’est pas disponible dans la version 7.1. Pour obtenir un effet similaire, utilisez un bloc Calendrier sur une page Disposition après avoir configuré votre page Événements.

You can display events as a list or a calendar. Switch the display at any time in page settings.  If you have multiple Events Pages, you can display some as calendars and some as lists. You might want to pick one to keep a consistent look.

  1. In the Pages panel, hover over an Events Page and click the gear-icon.
  2. Use the Default Event View drop-down to select either List or Calendar.
  3. Cliquez sur Enregistrer et actualisez la page.

List layout

La vue Liste est recommandée si vous souhaitez que votre page Événements ressemble plus à un blog qu’à un calendrier.

  • Events display in a list with descriptions, excerpts, and thumbnail images.
  • Use the List view option if you want to display upcoming and past events.
  • You can display up to 250 upcoming and 30 past events.

Calendar layout

In Calendar view (version 7.0 only), events display in a calendar with interactive features:

  • If an event has a thumbnail image, the thumbnail displays. It's cropped to fit the square.
  • If an event has an excerpt, it displays on hover.
  • Arrow controls appear at the top to navigate by month.
  • Any days without events will be gray.
  • If a day has more than one event, every event's time and title display in the day's box. The height of the week expands, and thumbnails won't display.

The calendar adjusts to fit the browser window so it looks great on any device.

  • Lorsque la largeur du bloc est inférieure à 600 pixels, les titres, l’heure des événements et les extraits s’affichent, mais pas les images miniatures.
  • Si la largeur du bloc est inférieure à 300 pixels, seuls les titres s’affichent.


Style the Events Page

After choosing between List or Calendar view:

  1. Go to the Events Page.
  2. From the Home Menu, click Design, then Site Styles
  3. Use the Events tweaks to adjust the landing page style.
  4. For tweaks specific to individual event item pages, first ensure Disable Item Pages is unchecked. Then exit Site Styles, open an event, and re-enter Site Styles.

For more help with opening Site Styles, visit Making style changes.

Astuces :

  • Cliquez n’importe où sur la page dans l’aperçu pour afficher uniquement les ajustements de style disponibles pour cette zone et masquer les autres.
  • If you have multiple Events Pages, style changes will apply to all of them to create a consistent look.
  • Your template may support more features, such as banner images or page headers, that affect how the Events Page looks.

Style the landing page

In both List and Calendar view:

  • Check Disable Item Pages to disable the title links to individual event pages. When left unchecked, clicking an event's title opens the individual event page.
  • Check 24-Hour Time to display event times in 24-hour international standard time display.

List view tweaks

Landing pages in List view have more style options.

Choose how the list displays with the Stacked View tweak.

These tweaks adjust the thumbnail and date that can display next to or below the event details. Where they display depends on your Stacked View setting.

  • Show Past Events - Show or hide past events.
  • Show Thumbnails - Show or hide the thumbnail image that displays above or to the left of the event.
  • Thumbnail Size - Set the shape of the thumbnail image.
  • Show Date Tag - Show or hide the date tag that displays over or in place of the thumbnail image.
  • Show Date Tag w/ Time - Include a time stamp with the date tag.

These tweaks affect the event listing:

  • Show Categories - Show or hide the categories.
  • Show Date - Show or hide the date.
  • Show Time - Show or hide the time.
  • Show Location - Show or hide the location.
  • Show Export Links - Show or hide export links to Google Calendar or iCal.
  • Show Social Buttons - Show or hide likes and a Share button.
  • Show Show Excerpt - Show or hide the event description or excerpt text.
  • Show Button - Show or hide a View Event button.

Style individual events

These tweaks affect individual event pages:

  • Show Export Links - Add export links to Google Calendar or iCal.
  • Show Social Buttons - Add likes and a Share button.
  • Show Back Link - Add a Back To All Events link.
  • 24-Hour Time - Display your event time using the 24-hour international standard time display.
  • Stacked View - Choose the layout.

Cet article vous a-t-il été utile ?
Utilisateurs qui ont trouvé cela utile : 42 sur 135