Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Comment ajouter un News Ticker défilant dans WordPress

De nombreux sites utilisent une ligne de texte défilant en haut pour mettre en évidence les nouvelles, les ventes ou les annonces.

Cette fonctionnalité, appelée “news ticker”, est un moyen simple et efficace de s’assurer que les mises à jour importantes ne passent pas inaperçues.

Nous avons utilisé les news tickers sur nos propres sites pour mettre en évidence des offres et des annonces à durée limitée, et ils nous ont aidés à tenir les internautes informés sans encombrer la page.

Dans ce guide, nous allons vous afficher comment ajouter un ticker d’actualités défilant à votre site WordPress.

How to Add a Scrolling News Ticker in WordPress

Qu’est-ce qu’un téléscripteur défilant ?

Un téléscripteur est une ligne de texte unique qui défile en continu sur l’écran. Il affiche généralement des articles d’actualité, des résultats sportifs, des informations financières et monétaires en direct, ainsi que des informations météorologiques.

Cela s’apparente à l’utilisation d’une barre de pied de page flottante et épinglée.

Les tickers sont un excellent moyen d’afficher de petits extraits d’informations d’une manière qui attire l’attention. Comme le contenu défile en permanence, vous pouvez également les utiliser pour afficher beaucoup d’informations dans un espace limité.

Par exemple, vous pouvez utiliser cet élément de conception WordPress pour afficher vos publications les plus performantes, annoncer une vente à venir ou partager d’autres informations utiles.

Ceci étant dit, voyons comment ajouter un ticker d’actualités défilant à votre blog ou site WordPress.

Comment ajouter un ticker de nouvelles défilant dans WordPress

Lorsque nous avons cherché comment créer un ticker de nouvelles, nous avons trouvé que la façon la plus simple est d’utiliser une extension. Bien que le CSS personnalisé offre un certain niveau de personnalisation, ce n’est pas le plus convivial pour les débutants.

Et la meilleure extension pour ce travail est le Ditty News Ticker. C’est l’une des meilleures extensions WordPress pour les actualités que nous ayons trouvées jusqu’à présent.

Il vous permet d’ajouter des contenus mobiles, défilants et diapositifs à votre site, puis de modifier la direction, l’espacement, la vitesse et le style de l’animation.

La première chose à faire est d’installer et d’activer l’extension. Pour plus de détails, consultez notre guide complet sur l’installation d’une extension WordPress.

Une fois activé, vous devez vous rendre dans Tableau de bord WordPress ” Ajouter nouveau “, puis cliquer sur le bouton ” Ajouter un défaut “.

Adding a ticker to your WordPress website

Vous pouvez maintenant créer le premier article du téléscripteur responsive. Dans le champ “Contenu”, tapez simplement le texte que vous souhaitez afficher sur le téléscripteur défilant.

Vous pouvez y faire une annonce ou partager des informations utiles, à l’instar d’une bannière de site web. Par exemple, vous pouvez informer les acheteurs d’une vente planifiée ou de publications récentes.

Adding content to an online ticker

Vous pouvez également ajouter des liens vers l’article afin que les gens puissent facilement visiter la page ou la publication mise en avant dans le ticker.

Pour ce faire, il suffit d’ajouter une URL dans le champ “Link”.

Adding links to a website ticker

Vous pouvez également ajouter un titre de lien, marquer l’URL comme nofollow, etc.

Pour tirer le meilleur parti du téléscripteur, vous pouvez ajouter plusieurs articles en cliquant sur le bouton “Mettre à jour les Réglages de l’article”.

Adding a scrolling news ticker to WordPress

La Prévisualisation s’actualise et affiche l’article que vous venez de créer.

Pour ajouter un autre article au téléscripteur, cliquez sur le bouton “Ajouter un article”.

Adding items to a scrolling news ticker

Vous pouvez maintenant cliquer sur “Ajouter un défaut” et créer l’article en suivant la procédure décrite ci-dessus.

Il suffit de répéter ces étapes pour ajouter d’autres articles au téléscripteur.

Lorsque vous êtes satisfait de vos articles, vous pouvez souhaiter modifier l’ordre dans lequel ils apparaissent dans le téléscripteur. Pour ce faire, il vous suffit de saisir l’article à modifier et de le faire glisser vers une nouvelle position.

Changing the order of ticker items in a scrolling newsfeed

Par défaut, Ditty affiche vos articles dans une liste.

Comme vous souhaitez créer un téléscripteur défilant, cliquez sur l’onglet “Affichage”.

Creating an animated ticker in WordPress

Dans cet écran, cliquez sur le lien “Modifier le type”.

Dans la fenêtre surgissante, sélectionnez “Ticker”, puis cliquez sur “Type de mise à jour”.

How to create a scrolling ticker in WordPress

Vous pouvez désormais modifier l’apparence et le comportement du téléscripteur sur votre site WordPress.

Il s’agit notamment de modifier le sens et la vitesse de défilement, ainsi que l’espacement entre les articles du téléscripteur.

Customizing an animated ticker

Vous pouvez également choisir entre différents styles pour le conteneur du téléscripteur, les articles, les titres, etc. La plupart de ces réglages s’expliquent d’eux-mêmes, il est donc utile de les passer en revue pour voir quelles modifications vous souhaitez apporter.

Lorsque vous êtes satisfait de la façon dont le téléscripteur est configuré, cliquez sur le bouton “Enregistrer le texte”.

Saving the ticker settings in WordPress

Après cela, vous êtes prêt à ajouter le téléscripteur à votre site à l’aide d’un code court. Pour obtenir ce code court, cliquez sur l’onglet “Réglages”.

Copiez maintenant la valeur dans le champ “Shortcode”.

Adding a ticker to a website using shortcode

Ceci fait, vous pouvez ajouter le code court à n’importe quelle page, publication ou zone prête pour les widgets. En savoir plus sur la façon de placer le code court, Veuillez consulter notre guide sur l’ajout d’un code court.

Une fois que vous avez fait cela, il suffit de mettre à jour ou de publier vos modifications pour que le téléscripteur soit en direct sur votre site WordPress.

News Ticker Preview

🎁 Bonus : Ajouter une barre de pied de page épinglée pour un impact maximal

Alors qu’un défilement de nouvelles aide à mettre en évidence les annonces en rotation, sa combinaison avec une barre flottante de page permet d’attirer efficacement l’attention de l’internaute à des fins différentes.

La barre de pied de page permet de garder visibles les informations essentielles et statiques, tandis que le téléscripteur garantit que les mises à jour sont bien visibles.

Avec des outils comme OptinMonster, vous pouvez créer des barres de pied de page attrayantes et les coordonner avec votre ticker d’actualités pour présenter des offres spéciales, des nouvelles urgentes ou des publications populaires.

OptinMonster footer bar preview

Le pied de page est un appel à l’action constant, tandis que le fil d’actualité fournit des mises à jour importantes à court terme.

Ensemble, ces fonctionnalités améliorent l’expérience de l’utilisateur et peuvent augmenter les taux de conversion en encourageant un engagement opportun avec des offres et des contenus clés.

Pour Premiers pas, consultez notre tutoriel sur la création d’une barre flottante collante en pied de page dans WordPress.

Nous espérons que ce tutoriel vous a aidé à apprendre comment ajouter un ticker d’actualités défilant dans WordPress. Vous voudrez peut-être aussi apprendre comment mettre en évidence les nouvelles publications pour les internautes qui reviennent ou voir nos choix d’experts sur les meilleures astuces de la colonne latérale de WordPress pour obtenir un maximum de résultats.

Si vous avez aimé cet article, veuillez alors vous abonner à notre chaîne YouTube pour obtenir des tutoriels vidéo sur WordPress. Vous pouvez également nous trouver sur Twitter et Facebook.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPBeginner is funded, why it matters, and how you can support us. Here's our editorial process.

The Ultimate WordPress Toolkit

Get FREE access to our toolkit - a collection of WordPress related products and resources that every professional should have!

Reader Interactions

15 commentairesLeave a Reply

    • While the ticker would not transmit the information to your other site, you can certainly add the same information in the ticker.

      Admin

  1. I this may be the ticker I want but, as in many online videos about plugins, you talked and moved so fast I could get the instructions.

  2. How do i add the Latest News: title to the scrolling news, it shows on my site, but i didnt see where to add if its lastest news or latest update etc

  3. very good plugin but i have aquestion
    i use artisteer to make my themes can you tell me where can i add php function to widget
    in this or from where can i add to my themes

  4. Hello, Please how can I add the direct function, kindly provide the ste by step instruction in adding the direct funtction.

    I added the shortcode in my about page and it worked but i added it on my home page but it didnt work…..kindly advice

    • Simply copy the Direct function as shown in the last screenshot of the article and paste in your theme’s home.php or header.php. Paste it at the location where you would like your news ticker to appear.

      Admin

  5. hey,
    thanks for giving the instructions clearly.. i had a a question where should we put the shortcode and direct function?
    do we place it in the post/page?

    Thanks,
    Sujani

  6. It seems a great theme, as I am not a PHP developer but I want to use this theme and integrate this theme on my wordpress blog. I just want you to describe ho can I use this theme in my Blog so my latest news can be shown on top of my menu or below my main menu like a slide shown on Television. Please I need a procedure.

    Thanks

Leave A Reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.