28173 sujets

CSS et mise en forme, CSS3

[RESOLU] Changer l'image de fond dans une ID CSS (PHP, SPIP)

Bonjour,

Ayant déterminé un 
#header
avec un 
background-image
je souhaite modifier ce background-image en fonction de la page appelée (pour info c'est pour un site sous SPIP 1.8.2). N'étant pas codeur Javascript etc. je suis sec Smiley bawling

J'ai parcourus les forums, mais rien de précis sur ce point Smiley decu

Alors je m'interroge... Peut-être que je me trompe totalement sur la méthode, que je fais fausse route...Peut-être qu'il est plus pertinent d'utiliser javascript uniquement...

Un p'tit coup de main, voir plus même serait super sympa !
A votre bon coeur et d'avance merci de vos réponse Smiley smile
Modifié par tg_worldwide (13 Mar 2006 - 14:13)
Une solution serait d'inclure dans ta page une seconde feuille de style qui serait différente pour chaque page et dans laquelle se trouverait la propriété background-image.
Peux-tu développer ?
Car je ne vois pas comment faire ... Je n'ai qu'un squelette de page pour toutes mes pages et je ne tiens pas à perdre cet avantage...
dans chaque page des ton site, tu auras entre <head> et </head>

<title>nom de la page</title>
<link type="text/css" rel="stylesheet" href="global.css" /> <!--feuille de style  identique pour toutes les pages -->
<link type="text/css" rel="stylesheet" href="nom_de_la_page.css" /> <!--feuille de style spécifique pour chaque page qui définie le background-image -->
La solution que tu me proposes ne me semble pas possible à mettre en oeuvre car chaque page HTML du site possède une URL du type : //monsite/article.php?id_article=xx, ou xx=un numéro d'article ( texte+image) et donc de page HTML créée dynamiquement à partir du gabarit de page article.

Ta solution implique de créer autant de gabarit de page que de page...

Je pensais donc faire appel à un Javascript qui doit permettre de récupérer l'URL et de modifier le background-image du #header en fonction du contexte...
Modifié par tg_worldwide (03 Mar 2006 - 19:58)
Et bien le sujet reste le même... A savoir je ne sais pas coder en Javascript ou en PHP... donc une techno (langage) ou une autre cela ne change rien !

J'ai trouver une solution en utilisant des fonctionnalités de SPIP (les logos des rubriques ou des articles). Mais elle n'est pas optimale car elle me supprime d'autres possibiltés. disons que c'est un "pi aller".

Donc le sujet reste toujours d'actualité et je pense que sa solution intéresserait beaucoup de personnes.
Administrateur
Bonjour,

l'id est évidemment unique pour la page, mais le même id est-il utilisé pour 2 articles différents sur 2 pages différentes? Si non, tu peux avoir un CSS global avec une longue liste de sélecteurs d'id ayant chacun une image de fond différente. Pour une page donnée, la plupart des id seront inexistants et donc le CSS correspondant "pas pris en compte", les id existants seront eux stylés.

Si oui, es-tu sûr qu'une fonction de SPIP n'existe pas? Une pas fréquemment rencontrée ni utilisée, mais là le plus simple serait de demander sur le site de SPIP ou sur webmaster-hub. Ou bien il va effectivement falloir de la programmation côté serveur ou côté client ou bien des CSS personnalisées: vouloir personnaliser chaque article différemment n'est pas trop compatible avec un gabarit de (toutes les) page(s) Smiley lol
a écrit :
vouloir personnaliser chaque article différemment n'est pas trop compatible avec un gabarit de (toutes les) page(s)

Je suis entièrement d'accord... Mais il y a malheureusement toujours la fameuse exception qui confirme la règle Smiley cligne Smiley smile

Je vais suivre tes conseils et voir avec les forums SPIP & Co si le cas de figure c'est déjà présenté et je reviendrais donner des nouvelles.

Avec de l'espoir, de la convition et de la patience Smiley lol
Je viens donc de faire le tour de la question sur les forums SPIP et obtenu une solution faisant appel aux fonctions de SPIP.

Mais cela ne répond par entièrement à la question de base... Mais ne soyons pas plus royaliste que la Roi Smiley lol 
<link type="text/css" rel="stylesheet" href='<?php echo $nom_de_ta_page; ?>.css' />


Et dans $nom_de_ta_page.css tu fera un 
@import "ta_css_standard.css";

(A mettre a la permiere ligne de ta CSS)

En gros dans $nom_de_ta_page.css tu aura les modifs spécidiques à ta page pour les background-images

Et comme ça ton entête reste générique
Modifié par Nagaroth (08 Mar 2006 - 15:38)
OK OK c'est tout bon cette proposition par l'import CSS en variable Smiley biggrin
Merci à tous de votre aide et de vos propositions constructives.

Pour les utilisateurs SPIP voici une solution :

Le fichier (x)html doit ressembler à quelque chose comme ça :
<div class="rub#ID_RUBRIQUE">
...le reste du code ...
</div>

et dans le css (par exemple):
rub1 {
description: parametre;
}

etc.

Solution donnée par Maître Dedoy (désolé je ne connais pas son mail).

Pour ma part ce post est résolu !
Encore merci à tous.
Sujet clos
Aller à