comment bien signaler une nouveauté? (besoin d'idées)

[Bege]

Bonjour à tous,

j'aurais besoin de vos conseils éclairés, voilà sur mon site dans la colonne de gauche j'ai un menu dans lequel
je voudrais pouvoir signaler une nouveauté de temps en temps, c'est le menu "Conseil Municipal"
Bien entendu les visiteurs peuvent cliquer dessus pour lire les comptes rendus, mais ils ne savent pas au moment
ou j'en mets un nouveau, alors pour l'instant j'ai mis une petite étoile verte à côté mais c'est pas top
voilà la page : http://www.rouhling.net/portail/

sur l'ancien site je mettais "new" en rouge à côté, mais là ça fait pas très joli.

Donc à votre avis, je pourrais faire comment?


merci de vos conseils

[SimonG]

Re : comment bien signaler une nouveauté? (besoin d'idées)

Bonjour,

sur l'ancien site je mettais "new" en rouge à côté, mais là ça fait pas très joli

tu peux te fabriquer une étiquette "new" en rouge puis l'afficher à la place de ton étoile. Non ?

[Bege]

Re : comment bien signaler une nouveauté? (besoin d'idées)

ben oui c'est ce que j'ai fais, mais c'est pas joli, l'idéal serait de pouvoir afficher quelque chose au bout du titre,
là au début ça décale tout, c'est pas top quoi?

[Bege]

Re : comment bien signaler une nouveauté? (besoin d'idées)

petit up pour voir si quelqu'un avait une idée?

merci

[ghazal]

Re : comment bien signaler une nouveauté? (besoin d'idées)

Salut,
connais-tu la propriété content:before/content:after ?
Elle s'écrit comme suit :
Mon exemple est placé sur ton lien de menu Conseil Municipal.

#item-143 a:after{
content:" ✫";
color: #2D4A61;
}

Avec content:" ✫";
tu peux mettre à peu près ce que tu veux, des caractères, de l'Unicode, des icon-fonts.
Tu peux styler à peu près comme tu veux (faut quand même tester à fond).

Réf UNICODE pour DingBats

http://www.alanwood.net/unicode/dingbats.html

Pour les iconfonts, un exemple très populaire:

http://somerandomdude.com/work/iconic/

puisque la propal des icones est en "font (police)" ou en image "png"
Avec les fonts et @font-face, tu peux coller des icones sous la forme de police (au lieu d'images).

Pour reférence, c'est une méthodologie à laquelle les adeptes de Joomla devront s'habituer car il est prévu que Joomla 3 utilisera BootStrap et donc les icon-fonts ou les icon-images.
cf --> http://fortawesome.github.com/Font-Awesome/

[Bege]

Re : comment bien signaler une nouveauté? (besoin d'idées)

merci pour ta réponse, c'est vraiment très intéressant tout ça!

quand tu dis :

Mon exemple est placé sur ton lien de menu Conseil Municipal.

je n'ai pas compris à quel endroit placer ce code?

[ghazal]

Re : comment bien signaler une nouveauté? (besoin d'idées)

OOPS, c'est pas une ID, c'est une class.

Je recommence.
J'ai vu que le lien de menu de Conseil Municipal avait une class : .item-143 sur le li.
Dans le "li", il y a un "a".
On crée un nouveau style sur le "a" (a:after) dans une des feuille CSS du template:

.item-143 a:after{}

auquel on attribue une propriété "content" (et une couleur dans mon ex):

.item-143 a:after{
content:" ✫";
color: #2D4A61;
}

Maintenant, il est évident que c'est une solution un peu rigide (pas plus que de mettre une image, comme tu l'avais fait au départ) puisque le signalement de la nouveauté ne se fera jamais qu'au niveau de Conseil municipal affublé de la class item-143.
On pourrait réfléchir à une solution plus dynamique ....

Plus clair ?

[Bege]

Re : comment bien signaler une nouveauté? (besoin d'idées)

ok, donc si je comprends bien il faudrait que chaque fois qu'il y a du nouveau je fasse appel à ce css dans les paramètres du menu?

[Dadsbouams]

Re : comment bien signaler une nouveauté? (besoin d'idées)

Regarde sur google et customise avec GIMP :

http://www.google.ch/search?q=New&hl=fr&prmd=imvnsl&source=lnms&tbm=isch&ei=nb_YT6ySAu714QSW46j3Ag&sa=X&oi=mode_link&ct=mode&cd=2&ved=0CFUQ_AUoAQ&biw=1366&bih=571

[Bege]

Re : comment bien signaler une nouveauté? (besoin d'idées)

merci mais ça j'en ai plus qu'il n'en faut, et pour customiser j'utilise Photoshop
c'est juste pour avoir comment et ou le placer, mais je pense que je vais voir pour mettre plutôt quelque chose comme le propose ghazal

merci quand même

[ghazal]

Re : comment bien signaler une nouveauté? (besoin d'idées)

ok, donc si je comprends bien il faudrait que chaque fois qu'il y a du nouveau je fasse appel à ce css dans les paramètres du menu?

Non pas vraiment, en réponse à ta question.
Dans les options avancées du menu, il y a donc :
ID de menu et Suffixe CSS de menu .
Quand tu remplis les champs avec "machin" et "truc", tu ajoutes simplement une ID et une class au tag<ul> du menu :
<ul id="machin" class="menutruc">
Tu n'atteins pas un li ou des li particuliers à l'intérieur du UL.
NB : La numérotation de la class de chaque li est obtenue dynamiquement.

Déjà, rajoute simplement mon code dans une des feuilles CSS de ton template pour vérifier si cela fonctionne correctement.
C'est une fonctionnalité qui devrait être acceptée par tous les navigateurs (j'ai cependant des doutes sur IE7).

[Bege]

Re : comment bien signaler une nouveauté? (besoin d'idées)

très bien, mais je le rajoute dans quelle feuille de style?
j'utilise le template Beez 20 avec le style "nature"

[Bege]

Re : comment bien signaler une nouveauté? (besoin d'idées)

ok, je l'ai donc testé dans nature.css
mais maintenant comment je fais pour afficher par exemple une de ces petites icônes

http://somerandomdude.com/work/iconic/#

car là quoi que je mette il y a un "?" bon là j'ai mis des petites étoiles *** mais c'est pas super

merci de ta patience

[ghazal]

Re : comment bien signaler une nouveauté? (besoin d'idées)

Là, c'est une question de choix.
Regarde par là, une belle sélection :

http://copypastecharacter.com/

Ca fait ce que ca dit, tu n'as qu'à copier /coller.

Pour les icones fonts de somerandomdude.com, il faut soit mettre en place la propriété @font-face, soit utiliser les images en.png placées dans le dossier "raster" de iconic.zip (comme tu avais fait pour ton image au tout début de ce fil).

[Bege]

Re : comment bien signaler une nouveauté? (besoin d'idées)

alors il y a quelque chose qui m'échappe, si je veux mettre par exemple un de ces signes de ton lien, je fais comment?
puisque dans le bloc note dès que je colle un caractère spécial il se transforme en point d'interrogation,
il doit y avoir un code qui le fait s'afficher non?