Widget Agenda Infolocale
Exemple du widget Agenda
Infolocale met à disposition des réutilisateurs un widget pour chacun des contenus.
Chaque widget est composé en réalité de deux widgets :
– Widget accueil destiné à la page d’accueil du site afin de présenter un aperçu du contenu
– Widget liste et détail de contenu à insérer sur une page dédiée du site
Vous trouverez ci-dessous les informations utiles pour installer l’agenda sur votre site internet.
Exemple du widget Agenda
Vous pouvez choisir la couleur, le nombre d'événements et avez la possibilité d'annoncer des événements dans votre agenda depuis votre espace Infolocale.
Installation
Dans la page destinée à recevoir le widget, insérer la ligne de code permettant le chargement du javascript :
<script type="module" src="https://cdn.ouest-france.fr/widgets/editorial-app-infolocale-widget.esm.js"></script>
Widget agenda : bloc de présentation
A l’endroit de la page HTML où vous souhaitez intégrer le widget de la page d’accueil, insérer le composant en personnalisant la ligne de code suivante :
<infolocale-widget-home color="#2169F1" main-title="Agenda" page-size="3" text-color="#2169F1" list-url="url" list-submit="url" token="token fourni" fallback-image="data:image/jpeg;base64,......."><infolocale-widget-home>Les paramètres disponibles pour personnaliser sont :
| Attribut | Type | Default | Description |
| no-title | booléen | false | N’affiche pas de titre pour le widget |
| main-title | texte | Agenda des événements | Libellé du titre du widget |
| color | valeur hexadécimale | #759ef8 | Couleur principale de présentation |
| text-color | valeur hexadécimalz | #000000 | Couleur de la police du texte |
| page-size | entier | 4 | Nombre d’élément de contenu affiché |
| list-url | url | non défini | Adresse url de la page liste dédiée à l’agenda |
| all-events-label | texte | Voir tous les événements | Libellé du bouton pour être redirigé vers la page dédiée à l’agenda |
| submit-url | url | non défini | Adresse url du bouton « proposer des événements » (ou autres contenus : activités…) de la page co-chartée de connexion à infolocale |
| add-event-label | texte | Proposer un événement | Libellé du bouton pour ajouter un événement à l’agenda |
| show-content-proposal | Booléen | true | Permet de ne pas afficher le bouton « proposer un événement » |
| token | texte | non défini | Token d’authentification à l’API relatif au nom de domaine réutilisateur du widget |
| fallback-image | image base64 | non défini | Image de pré-chargement et image par défaut pour les contenus sans photos. Cette image doit faire une taille de 470 px * 400 px et être convertie en base64 en vous aidant du site https://www.base64encoder.io. Recopier la valeur du champ « Base64 Image source » et la mettre en valeur de ce paramètre du widget. |
Widget agenda : bloc page liste et page détail
A l’endroit de la page HTML où vous souhaitez intégrer le widget de la page liste et détail, insérer le composant en personnalisant la ligne de code suivante :
<infolocale-widget color="#2169F1" main-title="Agenda" page-size="3" text-color="#2169F1" list-submit="url" token="token fourni" fallback-image="data:image/jpeg;base64,......."><infolocale-widget>
Les paramètres disponibles pour personnaliser sont :
| Attribut | Type | Default | Description |
| no-title | booléen | false | N’affiche pas de titre pour le widget |
| main-title | texte | Agenda des événements | Libellé du titre du widget |
| color | valeur hexadécimale | #759ef8 | Couleur principale de présentation |
| text-color | valeur hexadécimale | #000000 | Couleur de la police du texte |
| page-size | entier | non défini | Nombre de vignettes affichées |
| submit-url | url | non défini | Adresse url du bouton « proposer des événements » qui correspond à la page co-chartée de connexion à infolocale |
| add-event-label | texte | Proposer un événement | Libellé du bouton pour ajouter un événement à l’agenda |
| show-content-proposal | booléen | true | Permet de ne pas afficher le bouton « proposer un événement » |
| token | texte | non défini | Token d’authentification à l’API relatif au nom de domaine réutilisateur du widget |
| fallback-image | image base64 | non défini | Image de pré-chargement et image par défaut pour les contenus sans photos. Cette image doit faire une taille de 470 px * 400 px et être convertie en base64 en vous aidant du site https://www.base64encoder.io. Recopier la valeur du champ « Base64 Image source » et la mettre en valeur de ce paramètre du widget. |
| hide-card-item-data | texte | non défini | Permet de retirer certaines informations des vignettes de contenus. Les valeurs possibles sont : hide-card-item-data='[« city »]’ |
| hide-filters | texte | non défini | Permet de ne pas afficher certains filtres de filtrage des contenus de la page liste.
Exemple : hide-filters='[« quand », « ou »]’ Par défaut, le filtre « permanent » est positionné à « false » pour ne pas afficher les événements ou activités permanentes. il faut cliquer sur la facette pour n’afficher que les permanents. |
Exemples de widget et site de démo
Les sites des radios :
Radios Hit West : Home / Agenda
Radio Océane :Home / Agenda
Radio Clazz : Home / Agenda
=> La solution widget est à disposition de la plateforme des radios indépendantes
Les démo sites de communes
Saint-Nazaire Renversante (office de tourisme)
Ville de Cesson-Sévigné
Le Pouliguen
Le parc du Marais Poitevin
On reste en contact !