[résolu] changer un background-image en fonction des différentes pages ?

[firfelin]

Bonjour,

Après passablement de temps, je me remets à un nouveau site avec CMSMS.

J'ai une question de technique/méthodologie que j'aimerais éclaircir au mieux avant de me lancer:

Ce nouveau site sera une espèce de portfolio;

Ma page d'accueil comporte X images/vignettes qui sont des liens vers des projets. Chaque vignette renvoie à un projet différent. Il y a 3 catégories de projets. Je pensais utiliser le module basique de news/Articles (je ne suis plus très sûr du nom) qui me semble convenir très bien avec son principe de sommaire/contenu.

Chaque page de projet reprendrait ensuite comme "header" une déclinaison de la vignette correspondante en guise de background-image répété sur toute la largeur de l'écran. Exemple: je clique sur la vignette 3, la page projet 3 s'affiche avec comme header l'image 3 équivalente (je joins un petit schéma au cas ce que je raconte n'est pas très clair...)

Ma question concerne ce changement dynamique de css pour un même template: en admettant que mes pages projets soient toutes construites sur un même template, commet est-ce que je peux faire pour programmer "si je clique sur l'image 3 de la page d'accueil, alors le background-image du header de la page projet 3 est l'image 3bis; si je clique sur l'image 4 etc..."

Merci d'avance pour votre temps et vos conseils

[Pierre M.]

Je réfléchis à voix haute :
-un template pour chaque projet => une CSS (attachée) pour chaque.
-un hack sur la balise {stylesheet} ou faire une balise {feuilledestyle}, qui appelle nomprojet.css à partir de l'alias de page nomprojet. ça doit pas être grand chose. Inconvénient : vous devez gérer vos N CSS statiques en dehors de CMSms.
-autrement...

Pierre M.

[firfelin]

Merci de vous pencher sur mon problème.

- un template pour chaque projet, je préfère pas... à ce niveau-là, cmsmsimple ne me servirait plus à rien et je ferais chaque page html "à la main"

- hack de la balise stylesheet? je ne vois pas trop ce que vous entendez par-là. Et effectivement, l'inconvénient d'avoir autant de css que de projets me rebute un peu

Je m'imaginais plus une bidouille en php (chose à laquelle je ne connais quasiment rien... ) qui changerait dynamiquement la propriété background-image du header.

un truc dans le genre inséré dans le template des projets:

Code: Select all

{php}
$numero = alias de page;
{/php}

<div id="header" style="background: url(uploads/images//{php}echo $numero;{/php}.jpg)  repeat-x">

Mais comment est-ce que je peux obtenir ce fameux "alias de page"? en mettant juste {alias}?

Je n'ai pas encore eu l'occasion de tester, mais même si ça peut marcher, ça ne ma pas l'air très "propre" comme façon de faire

[Pierre M.]

Mais comment est-ce que je peux obtenir ce fameux "alias de page"? en mettant juste {alias}?

Je pense que vous y êtes presque. Cherchez page_alias ou pagealias ou choses du genre dans tout le forum avec Google.

Pierre M.

[firfelin]

Merci, je vais voir de ce coté

Le design est fair, j'attaque la partie cmsms aujourd'hui... Je ne suis pas encore sûr à 100% que le module News va convenir pour mon projet. Peut-être que je devrais tester avec Cataloger.

J'aurai sûrement plein d'autres questions, donc à bientôt

[athena_pallas]

Syntaxe : {$page_alias} cfr : http://forum.cmsmadesimple.org/index.ph ... 994.0.html

Le code devrait être alors :



(J'ai pas testé mais ça a l'air OK comme idée non ?)

[firfelin]

alors...

page_alias ne fonctionne pas. Logique dans le fond, si je comprends bien, vu qu'il s'agit de News/Articles, et qu'ils n'ont pas d'alias de page propre mais sont chargé dans la page spécifiée en argument du tag news {news detailpage='details'}

J'ai essayé d'utiliser l'ID de chaque article, mais je ne trouve pas ça forcément très pratique (en plus, mon premier article avait un id = 2 (??) )

J'ai ensuite bricolé un truc comme ça:

J'ai rajouté une définition de champ dans le gabarit des articles, intitulé 'identification', qui me permet d'allouer un mot-clef à chaque projet.

J'ai fait un gabarit de sommaire qui charge automatiquement une image depuis un dossier ayant le même nom que le champ identification:

Code: Select all

<!-- Start News Display Template -->

{foreach from=$items item=entry}
{assign var="dossier" value=$entry->identification}

<div class="projet_sommaire">
	<a href='{$entry->link}' title='{$entry->title}'><img src='uploads/images/projets/{$dossier}/vignette.jpg' alt='{$entry->title}' /></a>
</div>

{/foreach}
<!-- End News Display Template -->

Jusque là... tout marche impeccablement:

Ensuite dans le gabarit du détail de l'article:

Code: Select all

{assign var='dossier'  value=$entry->identification}

Et dans le gabarit de la page:

Code: Select all

<div id="header" style="background: url(uploads/images/projets/{$dossier}/header.jpg)  repeat-x">

ça devrait marcher, non...?

Ben non... ça coince et quand je regarde le code source de la page, le chemin d'accès de l'image est (uploads/images/projets/ /header.png). Comme si la variable ne passait pas ou je ne sais quoi
A s'arracher les cheveux...

Merci d'avance pour votre temps et votre cerveau et vos yeux plus frais, moi je ne vois plus rien

[Pierre M.]

Bonsoir,

avec "en admettant que mes pages projets soient toutes construites sur un même template" je n'avais pas envisagé qu'il s'agissait d'utiliser le module News, mais de "vraies" pages.
D'ailleurs, pourquoi pas ? Puisque vous comprenez Smarty etc, vous serez sans doute capable d'adapter {lastmodified} ou d'autres choses de ce genre ? ça devrait être plus facile que de tordre le module News, non ?

Pierre M.

[firfelin]

ahah comprendre Smarty c'est un bien grand mot...

J'ai besoin des possibilités de catégories/sommaire etc qu'apporte le module News et à priori tout fonctionne à merveille, si ce n'est cette foutu variable qui ne pase pas

[firfelin]

Enfin...

Il semblerait que le problème qui m'a rendu chauve en un après-midi ne soit qu'une stupide question d'ordre d'éxécution...

J'appelle la variable $dossier dans le header, alors qu'elle n'est déclarée que dans le gabarit de détail de l'article, donc dans {content}, qui ne vient qu'après... aaargh

J'ai appliqué un truc trouvé ici:http://forum.cmsmadesimple.org/index.php/topic,16646.0.html

et donc:

a) Add this code into the section of your page template:

Code: Select all

{capture assign='captured_content'}{content}{/capture}

b) Replace the {content} tag lower in your template with {$captured_content}

... je comprends rien à cette histoire de "capture", mais ça marche

[Pierre M.]

... je comprends rien à cette histoire de "capture", mais ça marche

Quand je disais que vous êtes doué en Smarty, bravo !-)

D'ailleurs, sous toutes réserves :
il y a peut être un raccourci avec la possibilité de mettre assign en paramètre du capturé, sans écrire capture : {content assign='captured'} et ensuite {$captured}
Pas validé, pas garanti.

Pierre