Aller au contenu principal

🗞️ Feed Ticker (RSS)

Le calque Feed Ticker permet d'afficher en direct des actualités, des mises à jour ou tout autre contenu dynamique issu de flux RSS ou JSON. Il est idéal pour créer des bandeaux défilants, des titres fixes ou des entrées en rotation, avec un contrôle total sur la source du contenu, la fréquence d'actualisation, le style visuel et la mise en forme du texte.

Nécessite une connexion active

L'appareil récupère ce contenu pendant la diffusion du calque. Sans connexion réseau, il n'y a rien à afficher, et aucune nouvelle donnée n'arrive tant que la connexion n'est pas rétablie.

Ajout d'un calque Feed Ticker dans l'éditeur de projet

Champs de contenu​

  • Source : collez ici l'URL du flux RSS ou JSON souhaité (p. ex. https://news.yahoo.com/rss/world).

    astuce

    Les sites WordPress proposent généralement un flux RSS par défaut à l'adresse www.wordpress-website.com/rss.

  • Source Type : sélectionnez le format du flux, rss ou json.

  • Refresh time (en minutes) : la fréquence à laquelle l'appareil met à jour le flux avec de nouveaux contenus (60 minutes par défaut).

  • View Style : choisissez la façon dont le contenu du flux est affiché.

    • static : affiche un seul élément, sans mouvement (élément unique).
    • fit : ajuste le texte pour qu'il tienne dans le calque (élément unique).
    • scrolling : fait défiler le contenu du flux en continu (élément unique).
    • ticker : fait défiler les éléments un par un (par défaut, à conserver pour la rotation).

  • Ticker Speed : définit la vitesse de défilement du texte.

    • Sur les appareils SpinetiX, plus la valeur est élevée, plus le défilement est rapide.
    • Sur les autres appareils, plus la valeur est basse, plus le défilement est rapide.

  • Text : sélectionnez l'information du flux à afficher (vérifiez que le champ choisi existe bien dans le flux).

    • (this.title) : affiche en rotation les titres des éléments (p. ex. le titre d'un article).
    • (this.description) : affiche en rotation les descriptions des éléments.
    • (this.link) : affiche en rotation les URL menant au contenu complet de chaque élément.
    • (this.pubDate) : affiche en rotation les dates de publication.
    • (this.author) : affiche en rotation les auteurs (facultatif en RSS 2.0).
    • (this.category) : affiche en rotation les catégories (facultatif en RSS).

  • Font Family : la police à utiliser (p. ex. Montserrat, News Cycle, Open Sans).

  • Font Size : taille de la police en pixels (px).

  • Line Height : espacement entre les lignes de texte (px).

  • Font Color : couleur du texte au format hexadécimal (p. ex. #FFFFFF).

  • Font Weight : épaisseur de la police.

    • normal
    • bold
    • bolder
    • lighter

  • Font Style : style de la police.

    • normal
    • italic

  • Vertical Align : alignement vertical dans le calque (Top, Center, Bottom).

  • Horizontal Align : alignement horizontal dans le calque (Left, Center, Right, Justify).

  • Text Shadow : ajoute une ombre au texte (p. ex. 8px 10px rgba(0, 0, 0, 0.75)).

  • Text Transform : contrôle la casse du texte.

    • Inherit : conserve le texte tel qu'il est saisi.
    • lower case
    • UPPER CASE
    • Capitalize

  • Bg Color : couleur d'arrière-plan au format hexadécimal (p. ex. #FFFFFF).

  • Bg Opacity : transparence de l'arrière-plan, de 0 à 1.

  • Fr Color : couleur du cadre (bordure) au format hexadécimal (p. ex. #FFFFFF).

  • Fr Border : épaisseur du cadre, en pourcentage.

  • Font Padding : marge intérieure autour du texte, en pixels.

🙋🏼 Problèmes courants​

Comment savoir si un lien est un flux RSS ?​

Ouvrez le lien dans un navigateur (p. ex. https://news.yahoo.com/rss/world). Un flux RSS valide renvoie du XML structuré plutôt qu'une page web classique : vous devriez voir des balises telles que <rss>, <channel> et une liste d'entrées <item>, chacune avec des champs comme <title>, <link> et <pubDate>.

Si vous voyez à la place une page web mise en forme ou une erreur, le lien n'est pas un flux utilisable.

Un flux RSS ouvert dans un navigateur, montrant sa structure XML

Je ne vois pas le flux RSS dans l'éditeur de projet ou dans l'aperçu. Pourquoi ?​

L'éditeur de projet et l'aperçu s'exécutent dans votre navigateur, qui applique des restrictions d'origine croisée (CORS). De nombreux fournisseurs de flux n'autorisent pas le chargement de leur flux depuis un autre site web, si bien que le navigateur le bloque pendant l'aperçu, même lorsque l'URL est valide.

Il s'agit généralement d'une limitation propre à l'aperçu. Le lecteur de l'appareil récupère le flux différemment et n'est pas soumis aux règles CORS du navigateur : publiez donc le projet sur l'écran et vérifiez-y le résultat avant de conclure que le flux ne fonctionne pas.

Je ne vois pas le flux RSS sur l'écran. Pourquoi ?​

L'appareil a besoin d'un accès Internet sortant vers l'URL du flux. Si un pare-feu, un proxy ou un filtre de contenu de votre réseau bloque cette adresse, l'appareil ne peut pas récupérer le flux.

Assurez-vous que votre réseau autorise le domaine du flux. Consultez Domaines et ports, qui précise que tous les domaines supplémentaires utilisés par la plateforme, y compris les flux RSS, doivent être autorisés.