- Statut : non résolu
- Ce sujet contient 13 réponses, 5 participants et a été mis à jour pour la dernière fois par
, le il y a 13 années et 2 mois.
-
Messages
-
Bonjour,
Ma configuration WP actuelle
– 3.1.3 :
– Version de PHP/MySQL :
– graphène :
– flagallery, cformII, swfObj, image widget… :
– local pour l’instant :
– ben, pas encore :Bonjour à tou(te)s,
connaissant la réactivité et l’efficacité du forum, je soumets mon problème (après avoir bien sûr explorer le forum et d’autres sites, bidouiller dans mon code css (style.css) et html (page), m’être arrachée les cheveux etc).Voili: je souhaite utiliser WordPress comme base de site et non de blog, ma page d’accueil est une page statique créée spécialement pour ce rôle (ce qui n’apporte que peu d’info).
Je voudrais (dans la mesure du possible) intégrer à cette page: une image de fond pleine page (png) + 5 images (png) PAR DESSUS qui serviront de boutons/liens vers les autres pages (classiquement avec texte, galeries, images etc).
Mon soucis est le suivant: comment et où (dans le style.css, code html de la page ou ailleurs) utiliser/mettre le/les bouts de code (concernant position, z-index…) qui serviront à faire passer mes boutons devant sans f***** en l’air tout le reste genre le footer au milieu de l’écran, et les images des autres pages empilées joyeusement les unes sur les autres.Je soupçonne que le html de la page en question reste le seul à transformer.
(Dans le cas où la réponse a été abordée explicitement dans un autre sujet: milles excuses!)
Merci d’avance.
Pas de succès ma question…? Ou bien…?
moi aussi j’avais cette souci avant, tu peu mettre ton image de fond dans le Style.css, par contre pour l’image de devant, tu insère un tableau avec tes images directement dans ta page.🙂🙂
jai un site en test que tu peux voir par contre. http://www.ecovolts.eu/ortana/
Merci Njaka41, je vais le tenter; avec le tableau ça devrait effectivement marcher…
A Chouf1, merci pour les infos, créer une nouvelle feuille de style est ce que je voulais éviter: ‘coze je n’y pêche pas grand chose! Maintenant, je crois que si je veux réussir à faire qq chose de sympa je dois bien m’y plonger dans ce foutu code…
Donc je vais passer par ta méthode (lentement mais sûrement) avec l’aide des liens cités, d’autant qu’en utilisant le tableau (j’ai pu découvrir un plugin sympa WP Table Reloaded) mais dont le résultat ne correspond pas à ce que je veux: c’est à dire les boutons-images placés de manière plus « graphique » et surtout pas en ligne et en colonne. Bref, je cherche différente solutions (anim’ Flash avec liens, image .png Toshop avec tranches et liens…) bref bref, j’arriverai bien à qq chose!
Allez zou je me lance dans les templates!Si ton design est fixe (toujours la même largeur quelle que soit la résolution) et que les 5 images sont toujours les mêmes (encore que c’est surtout leur emplacement qui doit être toujours le même). il y a aussi la possibilité de faire une image-map.
Il s’agit de faire un montage photo, ton image de fond et les 5 images par-dessus, le reste se passe dans le code html en déclarant des rectangles ou des cercles cliquables à l’emplacement des 5 images du dessus.Ici le lien vers un outil gratuit on-line (je ne sais pas ce qu’il vaut mais tu pourras ainsi tester le truc ?)
En cas de design fluide, cette solution est inadaptée, dans ce cas c’est la solution Chouf1 sans liste mais avec des div positionnés par css.
(ps si tu veux les positionner en leur donnant une rotation et sans utiliser une image de plus grande taille avec fond transparent, jette un œil direction css3 (transform: rotate(Xdeg)😉)
chouf1:
Apprend d’abord à maîtriser avant d’imiter le maître.
Arf…, tant que ce sont les « maîtres » que j’essaie d’imiter… et c’est SURTOUT en cherchant à les suivre que l’on progresse (petit scarabée)!
« je souhaite utiliser WordPress comme base de site et non de blog »
« les deux utilisent du HTML et des feuilles de style: y’a pas de différences ».Je sais! J’avais préciser:
Voili: je souhaite utiliser WordPress comme base de site et non de blog, ma page d’accueil est une page statique créée spécialement pour ce rôle (ce qui n’apporte que peu d’info)
En fait je ne cherche pas à faire des menus déroulants: je me suis sans doute mal expliqué au départ.
Je voudrais (dans la mesure du possible) intégrer à cette page: une image de fond pleine page (png) + 5 images (png) PAR DESSUS qui serviront de boutons/liens vers les autres pages (classiquement avec texte, galeries, images etc).
Sur le web, cours CSS http://www.w3schools.com/css/default.asp (en anglais)
background-image et comment déclarer cela.
T’es mignon toi… t’as tendance à enfoncer un peu non?
Bref, polémiquer c’est pas ce qui m’intéresse réellement ici.
A Wasicu: merci pour les infos. J’ai tenté « images-map »: pas terrible, mes boutons ne sont pas des formes géométriques régulières, ce sont des dessins tradi puis vectorisés sous illustrator et qui se chevauchent pour certain: trop galère à maper.
Pour vous donner une idée de ce que je cherche à réaliser et comme un dessin vaut mieux que…, j’ai fait un lien vers une page de mon blog: page essai accueil. Avec l’image (fond+boutons) et une capture d’écran de la page d’accueil du site.
Pour l’instant tout est évidemment « aplati » sur le fond.
J’aimerai faire de chaque élément: les 2 bouquins+le ballon+la règle+le vase +le carnet, un lien direct vers leur page respective du site. Voilà.
Ou sinon j’essaie avec Flash. Mais j’aimerai pouvoir le « comprendre » et le faire sur WordPress.
Merci d’avance si y’a moyen.Une image map me parait le plus simple à gérer. Il suffit de créer des zones contenues dans chacun des éléments du dessin, les gens n’auront pas de problème à cliquer au centre de l’image.
Merci Li-An, je me sens moins seul
Une image map, désolé d’insister, est pourtant la meilleure solution du fait même des images qui se chevauchent. Les zones cliquables pouvant ne prendre qu’une partie de l’image, contrairement à une image lien. Surtout que l’image que tu nous donnes à voir est déjà en l’état prête à devenir une image map, suffit juste de définir les zones. Mais bon…
Dans tous les cas, renseigne l’attribut title pour tes liens. Ça pourra aider.
Sinon pour mettre en place le truc c’est plutôt simple :
Appliquer en background l’image de fond au div du contenu de la page. Insérer à l’intérieur 6 div ayant chacun son ID (Je connais le débat actuel concernant le pas d’ID dans le css, but I don’t care.), son image et son lien.
Positionner chaque div là où tu veux l’avoir en css, à voir ton image un float:right devrait suffire pour les 2 premiers div suivi d’un clear:float pour le troisième, rajouter du z-index pour les images qui se chevauchent et jouer sur les marges et padding pour positionner les div du bas.Si je devais mettre ca en page, sans image map, je ne mettrai en lien que le texte et alignerai les images au texte en utilisant vertical-align. Dans le genre :
Tout le reste en css.
Une image map, désolé d’insister, est pourtant la meilleure solution du fait même des images qui se chevauchent. Les zones cliquables pouvant ne prendre qu’une partie de l’image, contrairement à une image lien. Surtout que l’image que tu nous donnes à voir est déjà en l’état prête à devenir une image map, suffit juste de définir les zones. Mais bon…
Yess Wasicu, je suis partie sur çà et j’ai fabriqué (sous Gimp) mon imagemap. Je tâtonne pour intégrer mon code html pondu dans ma page…
Sinon pour le reste des infos: je prends et j’essaie de comprendre et je FINIRAI bien par y arriver!!!
Encore merci.
Ok, fais nous voir le résultat, ça m’intéresse. Bonne fin de semaine.
(Ce serait sans problème: mais je suis encore en local, du coup je ne peux pas partager de lien…)
Bref, pour info: l’imagemap et le code fonctionne parfaitement, yeaaah, les liens suivent, c’est nickel: bien contente!
Je voterais dorénavant pour cette option.
Merci Wasicu d’avoir insisté!!! Et bon week-end également.
A Chouf1: Boaah, j’ai pas réellement pris la mouche, j’ai pris un petit droit de réponse sur qqs remarques, c’est tout (c’est comme dans la « vraie vie », personne n’est lisse)! Quant à tes conseils, figures-toi que je les ai suivi (thème enfant, pas de tableau, les liens…) mais il se trouve qu’au vue de mon niveau et de ce que je cherche à obtenir, le système imagemap me convient mieux au final.
Aussi, quand je lis « je veux utiliser mon WP comme base de site et non de blog », j’me dis qu’il y a un truc
c’est vrai qu’il n’y aucune différence! J’ai pensé retirer cette info qui n’apporte rien mais j’ai zappé sur autre chose ensuite.
Désolée pour toi s’il y a eu malentendu, d’ailleurs toi aussi tu l’as pris…la mouche!
Allez zou!✅
- Le forum ‘Utilisation spécifique de WordPress’ est fermé à de nouveaux sujets et réponses.