{"id":370767,"date":"2022-11-12T13:51:00","date_gmt":"2022-11-12T10:51:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=370767"},"modified":"2022-11-12T13:51:03","modified_gmt":"2022-11-12T10:51:03","slug":"comment-ajouter-une-barre-de-defilement-personnalisee-dans-wordpress","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/fr\/comment-ajouter-une-barre-de-defilement-personnalisee-dans-wordpress\/","title":{"rendered":"Comment ajouter une barre de d\u00e9filement personnalis\u00e9e dans WordPress"},"content":{"rendered":"\n

La barre de d\u00e9filement peut \u00eatre un petit d\u00e9tail sur votre site Web, mais ce n’est pas parce qu’elle est petite que vous devez vous en tenir \u00e0 son apparence par d\u00e9faut. Si basculer une identit\u00e9 visuelle unique est l’une de vos priorit\u00e9s, voici la bonne nouvelle – sur les sites Web WordPress, il y a toujours une possibilit\u00e9 de changer la barre de d\u00e9filement et de l’ajuster \u00e0 votre th\u00e8me, style et palette de couleurs<\/strong>.<\/p>\n

\"Comment<\/a><\/p>\n

Il existe deux mani\u00e8res de personnaliser la barre de d\u00e9filement<\/strong>. Le plus simple est d’installer le plugin, qui ne n\u00e9cessite aucune comp\u00e9tence en codage. L’autre m\u00e9thode consiste \u00e0 ins\u00e9rer du CSS suppl\u00e9mentaire dans les param\u00e8tres de WordPress.<\/p>\n

Utilisation du plugin Advanced Scrollbar<\/h2>\n

La barre de d\u00e9filement avanc\u00e9e<\/a> est un plugin gratuit, vous pouvez donc le trouver dans la biblioth\u00e8que de plugins WordPress. Acc\u00e9dez au panneau d’administration et cliquez sur Plugins> Ajouter nouveau pour ouvrir la biblioth\u00e8que. Dans la barre de recherche, tapez "Barre de d\u00e9filement avanc\u00e9e" et cliquez sur le r\u00e9sultat.<\/p>\n

Installez le plugin et n’oubliez pas de l’activer en<\/strong> utilisant le lien d’activation. Les plugins ne fonctionnent pas s’ils ne sont pas activ\u00e9s.<\/p>\n

\"Comment<\/a><\/p>\n

Apr\u00e8s avoir activ\u00e9 le plugin, vous pourrez modifier ses param\u00e8tres. Acc\u00e9dez aux param\u00e8tres dans le menu principal du tableau de bord. Cliquez sur Param\u00e8tres de barre de d\u00e9filement de couleur personnalis\u00e9e.<\/p>\n

\"Comment<\/a><\/p>\n

Ce sont les param\u00e8tres par d\u00e9faut.<\/p>\n

\"Comment<\/a><\/p>\n

Voici \u00e0 quoi ressemble la barre de d\u00e9filement avec les param\u00e8tres par d\u00e9faut.<\/p>\n

\"Comment<\/a><\/p>\n

Si vous souhaitez modifier les param\u00e8tres de base, vous pouvez modifier la couleur d’arri\u00e8re-plan de la barre de d\u00e9filement et du rail.<\/p>\n

\"Comment<\/a><\/p>\n

De plus, vous pouvez d\u00e9finir la vitesse de d\u00e9filement de la souris, la vitesse de<\/strong> la barre de d\u00e9filement et l’option permettant de masquer automatiquement la barre de d\u00e9filement<\/strong>. Vous pouvez \u00e9galement choisir si la barre de d\u00e9filement aura un alignement \u00e0 gauche ou \u00e0 droite. Il existe \u00e9galement une option permettant d’ activer l’affichage de la barre de d\u00e9filement sur les appareils tactiles<\/strong> tels que les t\u00e9l\u00e9phones mobiles et les tablettes.<\/p>\n

\"Comment<\/a><\/p>\n

Les param\u00e8tres suppl\u00e9mentaires pour modifier le style de votre barre de d\u00e9filement se trouvent dans le deuxi\u00e8me onglet, Param\u00e8tres de style personnalis\u00e9 de la barre de d\u00e9filement. Ici, vous pouvez modifier la largeur de la barre de d\u00e9filement, la bordure CSS et le rayon de la bordure<\/strong>.<\/p>\n

\"Comment<\/a><\/p>\n

C’est le r\u00e9sultat final de nos changements.<\/p>\n

\"Comment<\/a><\/p>\n

Utilisation du CSS suppl\u00e9mentaire<\/h2>\n

La deuxi\u00e8me solution pour ajouter une barre de d\u00e9filement personnalis\u00e9e \u00e0 votre site WordPress n\u00e9cessite un peu de connaissances en codage. Si vous n’avez aucune exp\u00e9rience en programmation mais que vous souhaitez tout de m\u00eame ajouter une barre de d\u00e9filement personnalis\u00e9e de cette mani\u00e8re, suivez attentivement les instructions<\/strong>.<\/p>\n

Pour ajouter un CSS personnalis\u00e9 \u00e0 l’\u00e9chelle du site, acc\u00e9dez au menu principal du tableau de bord et cliquez sur Apparence > Personnaliser.<\/p>\n

\"Comment<\/a><\/p>\n

Cliquez sur le champ CSS suppl\u00e9mentaire.<\/p>\n

\"Comment<\/a><\/p>\n

Collez le code suivant dans la zone CSS suppl\u00e9mentaire.<\/p>\n

::-webkit-scrollbar {\n-webkit-appearance: none;\n}\n::-webkit-scrollbar {\nwidth: 12px;\n}\n::-webkit-scrollbar-track {\nbackground: #f8c1c0; \nborder:1px solid #fff;\n} \n::-webkit-scrollbar-thumb {\nbackground: #bededa; \nborder:1px solid #fff;\nheight:300px;\nborder-radius:4px;\n}<\/code><\/pre>\n
\"Comment<\/a><\/p>\n
Lorsque vous ajoutez du CSS, cliquez sur le bouton Publier et v\u00e9rifiez le r\u00e9sultat. Gardez \u00e0 l’esprit que ce code fonctionnera sur tous les navigateurs Internet, \u00e0 l’exception de Firefox et Edge<\/strong>.<\/p>\n
Ce sont deux fa\u00e7ons simples d’ajouter une barre de d\u00e9filement personnalis\u00e9e dans WordPress. Les deux sont un choix viable pour les utilisateurs ayant peu ou pas d’exp\u00e9rience en codage.<\/p>\n
Vous voulez en savoir plus sur les moyens rapides et simples d’am\u00e9liorer la conception et les performances de votre site Web\u00a0? Consultez cette liste de plugins WordPress indispensables pour d\u00e9marrer un nouveau site Web<\/a>! <\/p>\n
Source d’enregistrement:  wpklik.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
L’ajout d’une barre de d\u00e9filement personnalis\u00e9e dans WordPress est un excellent moyen d’aligner m\u00eame les plus petits d\u00e9tails de votre site Web avec votre identit\u00e9 visuelle unique.<\/p>\n","protected":false},"author":1,"featured_media":363788,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[568],"tags":[844],"class_list":["post-370767","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-les-bases-de-wordpress","tag-affiai-fr"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/posts\/370767","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/comments?post=370767"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/posts\/370767\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/media\/363788"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/media?parent=370767"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/categories?post=370767"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/fr\/wp-json\/wp\/v2\/tags?post=370767"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}