Comment ajouter un gif animé "new" dans le menu de gauche ?

Information importante

En raison d'un grand nombre d'inscriptions de spammers sur notre site, polluant sans relache notre forum, nous suspendons la création de compte via le formulaire de "sign up".

Il est néanmoins toujours possible de devenir adhérent•e en faisant la demande sur cette page, rubrique "Inscription" : https://www.drupal.fr/contact


De plus, le forum est désormais "interdit en écriture". Il n'est plus autorisé d'y écrire un sujet/billet/commentaire.

Pour contacter la communauté, merci de rejoindre le slack "drupalfrance".

Si vous voulez contacter le bureau de l'association, utilisez le formulaire disponible ici, ou envoyez-nous un DM sur twitter.

Bonjour,

Je suis novice je gère le site pour mon CE (http://cesird.free.fr) et je souhaiterais ajouter un petit gif animé new clignotant dans le menu de gauche mais j'ai aucune idée de la manière de faire.

Par avance merci de vos réponses.

Version de Drupal : 

Tout dépend de ce que tu veux faire.

Tu peux modifier le fichier css du thème (minelli) pour ajouter une image en fond de la DIV sidebar-left.

Si tu veux plus de souplesse, tu peux aussi créer un bloc, avec l'image dans ce bloc, et l'affecter à la région "sidebar-left". Ceci permettra de l'ajouter / l'enlever assez facilement, sans passer par les feuilles de style.

Tout d'abord merci pour la réponse,

Par contre comme je le disais je suis novice, et l'idée de créer un bloc avec l'image dans ce bloc je n'arrive pas a comprendre et surtout a imaginer ce que ca va donner ?

Salut,

On pourrait mieux te répondre si tu nous disais à quoi correspond ce picto "new" : est-ce un picto statique que tu veux tout le temps afficher, tout le temps au même endroit ? Ou doit-il dynamiquement apparaître uniquement à côté des contenus qui sont effectivement nouveaux ?

Merci,

donc je souhaite ajouter un gif animé "new" a côté par de "les élus" car c'est une page que je viens de modifié et puis je souhaite pouvoir l'enlever par la suite.

Si je pouvais avoir une réponse aujourd'hui ce serait super.

Merci beaucoup.

@izus : je ne crois pas que ta solution convienne. Il demande comment ajouter une image dans un menu, pas dans un bloc dont on saisit le contenu manuellement.

@arobaz : il faut le faire en CSS, comme t'as suggéré vincent59. Il faudrait mettre ton gif en image de fond sur la balise <li>...</li> qui encadre "Les élus". Le problème, c'est que cette balise n'a pas de classe ou d'id particulier dans le HTML, tu vas donc avoir du mal à la cibler.

Si j'étais toi, j'utiliserais le module menu_attributes, qui permet de modifier certains attributs des éléments de menus, et notamment de leur donner une classe ou un ID. Ensuite, tu pourrais écrire dans ta CSS quelque chose comme :

li#les-elus {
  background: url(new.gif) top left no-repeat;
  padding-left: 15px;
}

Ben je t'ai expliqué pourquoi je crois que ce module est nécessaire.

Si tu penses que tu peux y arriver sans ce module, alors ne l'installe pas. Mais en regardant le HTML de ton site, je ne vois pas comment tu peux faire porter un style CSS sur une balise <li> qui n'a ni classe ni ID... Si tu trouves, s'il te plait, indique-nous la solution.

donc j'ai installé le module par contre peut tu me dire exactement ce qu'il faut que j'écrive et ou ce serait super sympa.

voilà l'adresse de mon GIF : http://cesird.free.fr/download/photos/articles/new.gif

Merci

PS: moi j'ai écris :
li#les-elus {background: http://cesird.free.fr/download/photos/articles/new.gif top left no-repeat;padding-left: 15px;} sous la ligne "Class attribute" mais ca ne marche pas !!!

Dans le menu (via menu_attributes), il faut ajouter pour la ligne correspondant à l'item "Les élus", un ID (par exemple : "les-elus" pour coller à l'exemple donné par Vincent).

Ensuite, dans le fichier CSS, il faut insérer le code donné.
Le mieux est de mettre le gif dans le répertoire du thème.

Oui, c'est ça.
Pour l'ID du menu, au lieu de mettre "les élus", il vaut mieux éviter les accents et les espaces, et mettre qqc comme "les-elus", ce qui ferait dans le code :

<li class="leaf"><a href="http://cesird.free.fr/?q=node/14" id="les-elus" name="les élus">Les élus</a></li>

Et ensuite, rapatrier le fichier style.css sur ton pc, faire la modif et le renvoyer.

L'autre option est d'utiliser directement un style via Menu_attributes, et de mettre comme style :

background-url (http://cesird.free.fr/download/photos/articles/new.gif) top left no-repeat;padding-left: 15px;

Dans ce cas, pas besoin de récupérer le fichier css

Dis-moi arobaz, est-ce que tu ne t'achèterais pas un bon bouquin sur CSS ?

Ne te vexe pas, mais il a fallu 24 messages pour t'expliquer un réglage CSS plutôt simple (et pas vraiment spécifique à Drupal). Si tu as beaucoup de questions comme ça, tu risques de passer beaucoup de temps sur le forum (sans toujours avoir beaucoup de réponses).

construction du site > bloc > ajouter un nouveau bloc

tu crées donc un bloc

tu met l'image gif dans ce bloc (comme tu l'a déjà fait sur tes pages ...)
surtout n'oublies pas le format d'entrée Full HTML !!!

enregistres, puis vas dans construction du site > bloc et tu modifies la position du bloc en le mettant dans "right sidebar" par exemple