Changer le curseur de votre forum

[SoraNoHime]

Changer le curseur de votre forum

Installation Pour installer un curseur sur votre forum, il faut passer par la CSS. Vous avez deux possibilités : Utiliser les curseurs par défaut installés sur tous les navigateurs ; Créer, héberger et utiliser votre propre curseur. Les curseurs s'utilisent par le biais de la propriété cursor en CSS, vous pouvez les utiliser de différentes façons. Pour le forum en général, dans ce cas il s'applique sur l'élément body, exemple : Code: body { cursor : move ; } Pour le passage sur les liens, dans ce cas, il s'applique sur l'élément a, exemple : Code: a { cursor : help; } mais vous pouvez aussi les associer à des éléments en particulier tel que les images, exemple : Code: img {   cursor: pointer; } ou toute autre partie du forum en l'associant à sa classe ou nom de tag correspondant. Les curseurs par défaut Ils possèdent déjà une sous-propriété qui leurs permettent d'être utilisé sans avoir à être créé ou hébergé ^^ En voici une liste non exhaustive : default pointer text help wait progress move crosshair n-resize s-resize e-resize w-resize ne-resize se-resize nw-resize sw-resize none help cell alias copy no-drop grab grabbing Il suffit donc de recopier une de ces valeurs derrière la propriété cursor dans votre CSS : Citation : Panneau d'administration  Affichage  Couleurs - Feuille de style CSS Par exemple : Code: a {   cursor : move; } Les curseurs personnalisés Ils se présentent sous deux formes : .cur qui sont les curseurs fixes, ou .ani pour les curseurs animés.  Les curseurs animés sont une particularité d'Internet Explorer et n'apparaissent pas sur les autres navigateurs Vous pouvez trouver sur le web pas mal de site offrant l'utilisation de curseurs gratuitement, liens d'hébergement à l'appui à intégrer tel quel dans le code css de votre forum. Vous pouvez également créer votre propre curseur (voir le point suivant). Créer son curseur Pour ce faire, il y a plusieurs moyens : Les logiciels de création de curseurs : vous en trouvez pas mal de gratuits sur le web, tel que RealWorld Cursor Editor, ZNsoft icone maker, AWicon Lite, Greenfish Icon Editor Pro, Sib Icon Editor etc... La plupart fonctionnant comme Paint, donc assez simplement, certains acceptant l'import d'images sous format jpeg, png, gif ou même encore bmp. Les logiciels de graphisme : Photofiltre propose une exportation des images en icône soit un fichier.ico. Il vous suffit au moment d'enregistrer cette image en icone de mettre .cur à la fin de son nom. Et vous aurez ainsi votre image en format curseur enregistré dans votre ordinateur. Pour les logiciels comme Photoshop ou Gimp, vous devez exporter votre image en icône. Puis une fois celle-ci enregistrée en format .ico, d'utiliser un convertisseur d'icone en curseur. Là plupart des logiciels que je vous ai cité ci-dessous le font. Les générateurs en ligne : des générateurs pour icônes tel que Converthub, I-Convert et bien d'autres qui permettent de transformer une image en format .ico. Comme pour les logiciels de graphisme, l'astuce est de renommer cette icône en .cur ensuite grâce aux logiciels qui convertissent les icones en curseur cités ci-dessus. Dans tous les cas, pensez en créant votre image à quelques points : l'image ne doit pas être trop grande, la plupart des logiciels préconisent une taille 32 x 32 maximum, soit la plus grande taille autorisée déjà pour les icônes ; le fond autour de votre image doit être transparent, sous peine d'avoir un carré imagé pour curseur. Donc utilisez une image de base en .gif ou .png ; Il vaut mieux que l'image pointe vers le coin en haut à gauche, indiquant alors exactement ce qu'elle désigne. Héberger son curseur Une fois votre curseur créé, il vous faut l'héberger pour qu'il puisse ensuite être appelé par la feuille de style CSS. Pour cela, il suffit d'uploader votre curseur à partir de votre ordinateur sur un hébergeur acceptant le format .cur ou .ani. Vous pouvez trouver une liste d'hébergeurs ici : Divers hébergeurs d'images et autres. N'oubliez pas de récupérer le lien donné par l'hébergeur que vous avez choisi une fois que votre curseur a été hébergé. Placer votre curseur sur votre forum Nous allons à nouveau utiliser la propriété cursor, avec cette fois comme valeur l'url de votre curseur. Citation : Panneau d'administration  Affichage  Couleurs - Feuille de style CSS Pour le lien général, c'est exactement comme pour les curseurs par défaut nous allons installer notre curseur dans body Code: body {     cursor: url(LIENDUCURSEUR), auto; } Remplacez LIENDUCURSEUR par l'URL obtenu après avoir hébergé votre image-curseur.

Cette astuce a été proposée par Macema. Aucune reproduction possible sans accord, conformément à l’article L122-1 du CPI. Pour proposer une astuce, merci de l'envoyer par MP à un Aidactif ou un Modéractif.