Menu avec du texte sous forme d'image !

Bonjour,

Comment faire un top-menu comme ici (NEW IN, CLOTHING, DESIGNERS, etc.):
http://www.topshop.com/webapp/wcs/stores/servlet/TopCategoriesDisplay?storeId=12556&catalogId=33057
avec du texte, mais enregistré en tant qu'image ?

(Le texte est enregistré sous forme d'image principalement car cette police n'est pas présente en standard sur chaque machine)

Du coup, avec un CMS (style Wordpress), comment on fait ça ? Il faut associer à chaque menu item une image ? Comment ?

Merci!

Dans l'exemple que tu donnes c'est bien une image par élément principal du menu. Sinon tu peux utiliser @font-face en CSS pour charger une police spécifique.

Hello,

bejj a écrit :
Du coup, avec un CMS (style Wordpress), comment on fait ça ?

Il faut voir la documentation de WordPress, se renseigner et si nécessaire se former au templating avec WordPress, etc.* Même chose pour tout autre CMS.

Et comme dit par jb_gfx, aujourd'hui on peut aussi charger une fonte en CSS avec @font-face. Ça marche plutôt bien et c'est beaucoup plus souple à utiliser que des images. Du coup le texte en image ça ne se fait plus trop pour des menus ou du titrage, on va dire que c'est un peu has been.
Les deux difficultés de cette méthode sont:
1. Il faut avoir le droit légalement d'utiliser la fonte avec @font-face. C'est le cas pour des fontes open-source, mais rarement pour des fontes commerciales destinées initialement au design print.
2. Le rendu du texte sous Windows, notamment WinXP, peut être problématique avec certaines fontes, et ça demandera des tests (voire un traitement en dégradation gracieuse pour WinXP).

* Cette phrase pourrait aussi être résumée par l'abréviation classique «RTFM».
Modifié par fvsch (03 Jun 2012 - 13:48)

Merci pour vos réponses...

Je ne pourrai pas utiliser @font-face car les fontes qui m'intéressent ne sont pas libres de droit.


Oui RTFM Je sais bien, tu penses bien... Mais les dizaines de milliers d'heures passées devant un écran au cours de ma vie (quelle horreur quand on y pense ... meme si j'aime ça) m'ont appris que bien souvent, une discussion avec quelqu'un qui a déjà "pratiqué" vaut mille RTFM

En wordpress par exemple, j'ai eu beau chercher, je vois mal comment on peut faire ça...

bejj a écrit :
Je ne pourrai pas utiliser @font-face car les fontes qui m'intéressent ne sont pas libres de droit.

Ce n'est pas une obligation: Heureusement, il existe tout de même des fontes distribuées avec des licences sympathiques ( http://myfonts.us/td-AffZoB ) et d'autres avec des licences atroces (fonts.com, typekit).

a écrit :
Oui RTFM cligne Je sais bien, tu penses bien... Mais les dizaines de milliers d'heures passées devant un écran au cours de ma vie (quelle horreur quand on y pense ... cligne meme si j'aime ça) m'ont appris que bien souvent, une discussion avec quelqu'un qui a déjà "pratiqué" vaut mille RTFM cligne

C'est fou, moi j'ai appris que bien souvent, mille bricoles de forum ne valent pas un manuel bien compris…
Modifié par kustolovic (04 Jun 2012 - 14:23)

bejj a écrit :
En wordpress par exemple, j'ai eu beau chercher, je vois mal comment on peut faire ça...

En gros c'est simple:
1. Tu identifies (et pourquoi pas prototypes) le code HTML dont tu as besoin.
2. Tu utilises les possibilités de templating du CMS pour y arriver.

Si tu peux récupérer un tableau des entrées de ton menu avec plusieurs paramètres (ou un objet ou un tableau d'objets), tu peux boucler dessus en PHP dans ton code de template et sortir le code HTML que tu veux.

Ou bien, si c'est un menu qui n'est pas appelé à évoluer, tu peux le faire en dur en HTML.

En fait je vois pas comment remplacer des menus suceptibles de bouger (le code est généré automatiquement par une boucle wordpress) par des images statiques...

A part faire un menu fixe en HTML.... Mais du coup ça utilise plus du tout le système de Wordpress pour créer des menus...

bonjour,

http://codex.wordpress.org/Appearance_Menus_Screen#Custom_Post_Types_and_Taxonomies

tu ajoutes une classe CSS à chaque item, et tu style le tout dans ton css.