Ajouter des modèles

Remarque : les modèles personnalisés sont une fonctionnalité réservée aux abonnements payants.

L'écran « Modèles » vous permet de télécharger, de prévisualiser et de mettre à jour des modèles personnalisés.

Changing the logo

You can use the upload logo panel to upload your logo. This will be used in all standard templates. The logo upload box supports PNGs, GIFs, and JPEGs. The logo will be inserted into the template at actual size, so crop and resize your logo to suit the waiting room layout before uploading. We recommend in the region of 300 pixels for height and width.

Previewing a Template

Cliquez sur l'icône d'aperçu pour voir à quoi ressemble le modèle en situation réelle. Des boutons vous permettent de simuler différents états de la salle d'attente, par exemple « en attente » ou « pré-vente ».

Download a template

Vous pouvez télécharger un modèle standard pour voir comment il est structuré, ou télécharger l'un de vos propres modèles personnalisés au cas où vous auriez égaré votre mot de passe GitHub.

Templates will download as zip files. You can edit the template in your favorite HTML editor, and re-upload as a custom template. The template uses Vue 3 directives to conditionally render sections based on the queue state.

<!-- Container that shows when loaded -->
<div id="crowdhandler-template" :class="{ 'active': ch.isLoaded }" role="main">
  <!-- Screen reader announcements -->
  <div class="ch-sr-only" aria-live="polite" aria-atomic="true">{{ ch.announcement }}</div>

  <!-- Your template content -->

  <!-- Captcha container (required if captcha is enabled) -->
  <div id="ch-captcha-form"></div>

  <!-- Script inclusion -->
  <script type="module" src="/src/main.js"></script>
</div>

The defaults in the template are used while the connection is being established. This means that all of the language on the page either comes directly from the template, or from the content you have added to the control panel, or is numeric, making templates language-agnostic.

To get started with custom templates take a look at our guide.

Upload a template

Les modèles peuvent être importés sous forme de fichier ou chargés en direct à partir d'une URL.

Incorporating a template by URL

Le principal avantage du chargement par URL est que vous pouvez créer le modèle sur votre propre site web sous la forme d'un simple fichier HTML. Une fois l'URL ajoutée au panneau de configuration, toute modification apportée à votre modèle sera automatiquement répercutée dans CrowdHandler. Cela signifie que vous pouvez intégrer la mise en page du modèle à votre site web.

Mieux encore : si vous utilisez un CMS, l'URL peut être dynamique, ce qui signifie que vous pouvez gérer le contenu de votre page « salle d'attente » comme n'importe quelle autre page de votre site. Veillez simplement à utiliser les bons identifiants et à ne pas perturber le code JavaScript de la salle d'attente.

Nous mettrons en cache le contenu de votre page pendant environ une minute ; ainsi, même si des milliers d'utilisateurs accèdent à votre salle d'attente, nous ne vous interrogerons qu'une fois par minute pour obtenir les mises à jour.

Uploading a template

You can upload a template directly as an attachment. Please be aware, this is HTML file only. Any external files you may use, including JavaScript, CSS, and images, must be hosted separately on secure (https://) domains to avoid insecure content warnings.

Important: relative URLs, for links and assets, etc., will not resolve to your domain. You can either ensure all URLs are absolute or add a base element to your template. e.g. <base href="https://www.crowdhandler.com/"> This will affect all of your relative URLs.