{"id":821086,"date":"2022-11-11T02:14:50","date_gmt":"2022-11-11T02:14:50","guid":{"rendered":"https:\/\/www.lafactory.com\/blog\/how-to-show-a-number-count-animation-in-wordpress-2\/"},"modified":"2022-12-10T12:44:44","modified_gmt":"2022-12-10T12:44:44","slug":"how-to-show-a-number-count-animation-in-wordpress-2","status":"publish","type":"post","link":"https:\/\/www.lafactory.com\/blog\/comment-afficher-une-animation-de-comptage-de-nombres-dans-wordpress\/","title":{"rendered":"Comment afficher une animation de comptage de nombres dans WordPress"},"content":{"rendered":"

Vous cherchez un moyen d’afficher un compteur num\u00e9rique anim\u00e9 sur votre site WordPress ?<\/p>\n

L’affichage d’un compteur num\u00e9rique aide \u00e0 capter l’attention de vos visiteurs et vous permet d’afficher les \u00e9tapes importantes, les clients satisfaits, les projets r\u00e9ussis et d’autres statistiques importantes sur votre site Web.<\/p>\n

Dans cet article, nous allons vous montrer comment afficher une animation de compteur num\u00e9rique sur WordPress.<\/p>\n

\"How<\/figure>\n

Pourquoi ajouter une animation de comptage de nombres sur WordPress ?<\/h4>\n

Afficher un compteur num\u00e9rique sur votre site Web WordPress<\/a> est un excellent moyen d’engager les utilisateurs et de capter leur attention.<\/p>\n

Vous pouvez l’utiliser pour afficher des statistiques importantes sur votre site, comme le nombre de visiteurs mensuels ou le nombre d’articles sur un blog WordPress<\/a>.<\/p>\n

De m\u00eame, vous pouvez utiliser un compteur num\u00e9rique anim\u00e9 pour afficher les projets termin\u00e9s, le nombre de clients satisfaits, le nombre de clients, les \u00e9tapes franchies par votre entreprise et d’autres informations cruciales.<\/p>\n

Par exemple, OptinMonster<\/a> utilise le compteur de nombres pour afficher les sessions de visiteurs mensuelles optimis\u00e9es.<\/p>\n

\"Number<\/figure>\n

L’ajout et la personnalisation d’un compteur num\u00e9rique dans WordPress n\u00e9cessitent g\u00e9n\u00e9ralement de modifier le code. Cela peut \u00eatre d\u00e9licat pour les d\u00e9butants qui ne savent pas comment \u00e9crire du code.<\/p>\n

Cela dit, voyons comment vous pouvez afficher un compteur de chiffres anim\u00e9 dans WordPress. Nous allons couvrir 2 m\u00e9thodes simples en utilisant un constructeur de site web premium et un plugin gratuit.<\/p>\n

Vous pouvez cliquer sur les liens ci-dessous pour passer \u00e0 la section de votre choix.<\/p>\n

M\u00e9thode 1 : Afficher un compteur num\u00e9rique anim\u00e9 en utilisant SeedProd<\/h4>\n

La meilleure fa\u00e7on d’ajouter un compteur num\u00e9rique anim\u00e9 dans WordPress est d’utiliser SeedProd<\/a>. C’est le meilleur constructeur de site web WordPress<\/a> qui offre un constructeur de page par glisser-d\u00e9poser et beaucoup d’options de personnalisation.<\/p>\n

Pour ce tutoriel, nous utiliserons la version SeedProd Pro car elle inclut des blocs avanc\u00e9s et vous permet d’ajouter un compteur. Il existe \u00e9galement une version SeedProd Lite<\/a> que vous pouvez essayer gratuitement.<\/p>\n

La premi\u00e8re chose que vous devez faire est d’installer et d’activer SeedProd. Si vous avez besoin d’aide, veuillez consulter notre guide sur l’installation d’un plugin WordPress<\/a>.<\/p>\n

Lors de l’activation, SeedProd vous demandera d’entrer la cl\u00e9 de licence. Vous pouvez trouver la cl\u00e9 de licence dans votre espace de compte et dans l’email de confirmation d’achat.<\/p>\n

\"Entering<\/figure>\n

Ensuite, vous aurez besoin de vous rendre sur SeedProd \u00a0\u00bb Landing Pages<\/strong> \u00e0 partir de votre panneau d’administration WordPress.<\/p>\n

SeedProd vous permet de cr\u00e9er des pages de destination personnalis\u00e9es de conception professionnelle, y compris une page coming soon<\/a>, une page en mode maintenance, une page de connexion et une page 404.<\/p>\n

Allez-y et cliquez sur le bouton \u00a0\u00bb Add New Landing Page \u00ab\u00a0.<\/p>\n

\"Creating<\/figure>\n

Apr\u00e8s cela, vous pouvez s\u00e9lectionner un mod\u00e8le pour votre page de destination et afficher le compteur de num\u00e9ros anim\u00e9.<\/p>\n

Il suffit de passer la souris sur un mod\u00e8le et de cliquer sur le bouton orange de v\u00e9rification.<\/p>\n

\"Select<\/figure>\n

Une fen\u00eatre popup s’ouvre alors. Saisissez simplement le nom et l’URL de la page.<\/p>\n

Ensuite, cliquez sur le bouton \u00ab\u00a0Enregistrer et commencer \u00e0 modifier la page\u00a0\u00bb.<\/p>\n

\"Enter<\/figure>\n

Cela lancera le constructeur drag-and-drop de SeedProd.<\/p>\n

Ensuite, vous pouvez modifier votre mod\u00e8le de page en ajoutant diff\u00e9rents blocs ou en cliquant sur des \u00e9l\u00e9ments existants sur la page.<\/p>\n

Pour ajouter un compte num\u00e9rique anim\u00e9, il suffit de faire glisser le bloc \u00ab\u00a0Compteur\u00a0\u00bb du menu de gauche et de le d\u00e9poser sur le mod\u00e8le.<\/p>\n

\"Add<\/figure>\n

Ensuite, vous pouvez s\u00e9lectionner le bloc \u00ab\u00a0Compteur\u00a0\u00bb pour le personnaliser davantage.<\/p>\n

Par exemple, vous pouvez modifier le num\u00e9ro de d\u00e9but et de fin du compteur, entrer un pr\u00e9fixe et un suffixe num\u00e9rique et modifier le titre.<\/p>\n

<\/figure>\n

Ensuite, vous pouvez passer \u00e0 l’onglet \u00ab\u00a0Avanc\u00e9\u00a0\u00bb sous les param\u00e8tres du bloc compteur sur votre gauche.<\/p>\n

Vous y trouverez d’autres options pour modifier le style, la couleur, l’espacement, la police<\/a>, etc. de votre bloc compteur.<\/p>\n

<\/figure>\n

Apr\u00e8s cela, vous pouvez acc\u00e9der \u00e0 l’onglet \u00ab\u00a0Param\u00e8tres de la page\u00a0\u00bb en haut de la page.<\/p>\n

Cliquez maintenant sur le bouton \u00ab\u00a0\u00c9tat de la page\u00a0\u00bb et mettez-le sur \u00a0\u00bb Publier\u00a0\u00bb<\/strong>.<\/p>\n

\"Publish<\/figure>\n

Ensuite, cliquez sur le bouton \u00ab\u00a0Enregistrer\u00a0\u00bb en haut de l’\u00e9cran et quittez le Cr\u00e9ateur de pages de destination.<\/p>\n

Pour voir le compteur num\u00e9rique anim\u00e9 en action, rendez-vous sur votre site Web.<\/p>\n

\"Number<\/figure>\n

M\u00e9thode 2 : Afficher une animation de comptage de nombres \u00e0 l’aide de Counter Number<\/h4>\n

Une autre fa\u00e7on d’ajouter une animation de compteur num\u00e9rique dans WordPress est d’utiliser le plugin Counter Number<\/a>.<\/p>\n

Il s’agit d’un plugin WordPress<\/a> gratuit, facile \u00e0 utiliser, qui vous permet de cr\u00e9er des compteurs simples pour votre site.<\/p>\n

Tout d’abord, vous devrez installer et activer le plugin Counter Number. Pour plus de d\u00e9tails, veuillez consulter notre guide sur l’installation d’un plugin WordPress<\/a>.<\/p>\n

Apr\u00e8s l’activation, vous pouvez aller \u00e0 Counter Numbers \u00a0\u00bb All counters<\/strong> depuis votre tableau de bord WordPress et cliquer sur le bouton \u00a0\u00bb Add New Counter \u00ab\u00a0.<\/p>\n

\"Add<\/figure>\n

Apr\u00e8s cela, vous pouvez entrer un titre pour votre num\u00e9ro de compteur.<\/p>\n

Dans la version gratuite, vous ne pouvez s\u00e9lectionner que le mod\u00e8le de design simple. Si vous voulez plus de mod\u00e8les et d’options de personnalisation, nous vous sugg\u00e9rons d’utiliser SeedProd<\/a>.<\/p>\n

\"Enter<\/figure>\n

Ensuite, vous pouvez ajouter les d\u00e9tails du num\u00e9ro de compteur. Il y a des options pour \u00e9diter le titre du compteur, s\u00e9lectionner une ic\u00f4ne, et entrer la valeur du num\u00e9ro du compteur.<\/p>\n

Vous pouvez ajouter autant de num\u00e9ros de compteur que vous le souhaitez en cliquant sur le bouton \u00ab\u00a0Add New Counterbox\u00a0\u00bb en bas de la page.<\/p>\n

\"Add<\/figure>\n

En outre, vous disposez d’autres options de personnalisation dans le panneau de droite.<\/p>\n

Par exemple, le plugin vous permet de modifier la couleur du titre du compteur, la couleur des chiffres, la taille de l’ic\u00f4ne, la taille de la police<\/a>, la famille de polices, et plus encore.<\/p>\n

Apr\u00e8s avoir effectu\u00e9 les modifications, faites d\u00e9filer vers le haut et publiez votre compteur.<\/p>\n

\"Publish<\/figure>\n

Ensuite, vous pouvez vous diriger vers Num\u00e9ros de compteur \u00a0\u00bb Tous les compteurs<\/strong> \u00e0 partir de votre tableau de bord WordPress.<\/p>\n

Allez-y et copiez le Shortcode du compteur. Il ressemblera \u00e0 quelque chose comme ceci :[COUNTER_NUMBER id=41]<\/code><\/p>\n

\"Copy<\/figure>\n

Ensuite, vous pouvez placer votre compteur de nombres anim\u00e9 n’importe o\u00f9 sur votre site Web, des articles et pages<\/a> aux barres lat\u00e9rales.<\/p>\n

Il suffit d’ajouter un nouveau message ou une nouvelle page ou de modifier un message ou une page existants. Une fois que vous \u00eates dans l’\u00e9diteur de contenu, cliquez simplement sur le signe \u00ab\u00a0+\u00a0\u00bb et ajoutez un bloc Shortcode.<\/p>\n

\"Adding<\/figure>\n

Ensuite, vous pouvez coller le shortcode du num\u00e9ro de compteur dans le bloc.<\/p>\n

\u00c0 partir de l\u00e0, pr\u00e9visualisez et publiez votre page ou votre article pour voir le compteur num\u00e9rique anim\u00e9 en action.<\/p>\n

\"Free<\/figure>\n","protected":false},"excerpt":{"rendered":"

Vous cherchez un moyen d’afficher un compteur num\u00e9rique anim\u00e9 sur votre site WordPress ? L’affichage d’un compteur num\u00e9rique aide \u00e0 capter l’attention de vos visiteurs et vous permet d’afficher les \u00e9tapes importantes, les clients satisfaits, les projets r\u00e9ussis et d’autres statistiques importantes sur votre site Web. Dans cet article, nous allons vous montrer comment afficher […]<\/p>\n","protected":false},"author":1,"featured_media":818320,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"categories":[1551],"tags":[],"class_list":["post-821086","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tips-tricks-2"],"_links":{"self":[{"href":"https:\/\/www.lafactory.com\/blog\/wp-json\/wp\/v2\/posts\/821086","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.lafactory.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.lafactory.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.lafactory.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.lafactory.com\/blog\/wp-json\/wp\/v2\/comments?post=821086"}],"version-history":[{"count":0,"href":"https:\/\/www.lafactory.com\/blog\/wp-json\/wp\/v2\/posts\/821086\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.lafactory.com\/blog\/wp-json\/wp\/v2\/media\/818320"}],"wp:attachment":[{"href":"https:\/\/www.lafactory.com\/blog\/wp-json\/wp\/v2\/media?parent=821086"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.lafactory.com\/blog\/wp-json\/wp\/v2\/categories?post=821086"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.lafactory.com\/blog\/wp-json\/wp\/v2\/tags?post=821086"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}