Voici un petit tutoriel vous permettant d'installer un "style switcher" (changement de feuille de style = changement de thème graphique) sur votre page d'accueil. Le choix de l'internaute sera stocké dans un cookie lui permettant de "retrouver" son thème graphique préféré lors de la prochaine connexion à votre site.
Les codes XHTML et PHP d'origine sont issus d'Alsacréations dans ce tutoriel PHP. Je me suis juste permis de l'adapter sur Plume cms et de donner quelques compléments d'information.
<div id="style-switcher"> <form method="post" action="<?php $_SERVER['PHP_SELF'] ?>"> <fieldset> <legend>Changez de thème graphique :</legend> <select name="style"> <option value="style1" selected="selected">style1 (thème par défaut)</option> <option value="style2">style2</option> <option value="style3"">style3</option> <option value="style4">style4</option> </select> <input type="submit" name="change_style" value="Changer" /> </fieldset> </form> </div>
Il s'agit d'une liste de choix que l'internaute valide. Notez que la liste est englobée dans une balise DIV que vous pouvez booster avec un peu de CSS...
Dans le cas d'une intégration dans le gabarit de page d'accueil de votre plume cms, je vous conseille de créer un fichier switcher.php avec le code ci-dessus à l'intérieur. Il faudra placer ce dernier avec les autres fichiers constituants les gabarits de Plume (dans .../manager/templates/default/).
Ensuite, il suffira de l'intégrer à l'endroit de votre choix par une include php :
<?php include dirname(__FILE__).'/switcher.php'; ?>
Les valeurs de l'attribut value doivent correspondre exactement aux noms de vos dossiers contenant vos thèmes graphiques (css + images). Dans le cas de Plume, ces dossiers se trouvent dans .../xmedia/theme/
On aura donc pour notre exemple les dossiers suivants dans .../xmedia/theme/ : style1 , style2 , style3 , style4
Dans chacun de ces dossiers se trouve une feuille de style principale (et éventuellement un dossier img contenant les images de votre thème en question).
Ce qui est très important, c'est de nommer identiquement ces feuilles de style principales, à savoir style.css dans notre exemple, vous allez comprendre pourquoi dans le code php suivant.
Vous pouvez constater que la cinquième ligne de code a été adaptée pour Plume : la vérification de l'existence du fichier pointe bien vers un "dossier" de thème pour Plume.
La variable envoyée en POST sera le nom d'un de vos thèmes (nom exact du dossier), la feuille de style principale dans chaque thème ne change pas de nom !!! = style.css.
A vous de vérifier ce lien en fonction de votre installation de Plume (attention à la racine de votre site).
Au final, c'est la variable $css qui récupère l'information.
Comme précédemment, je vous conseille de créer un fichier cookie.php avec le code ci-dessus. Il sera aussi placé avec les autres gabarits dans .../manager/templates/default/
On l'intégrera via une include en tout début de gabarit (avant le code xhtml ) dans tous les gabarits (search.php,resource_news.php,resource_article.php,category_homepage.php,category_category.php).
Voici ce qu'il faut faire :
Il va falloir modifier le lien vers la feuille de style dans tous vos gabarits (partie head) en prenant en compte la variable $css créée par cookie.php, voici la structure adéquat :
<link rel="stylesheet" type="text/css" href="<?php pxInfo('filesurl'); ?>theme/<?php echo "$css"; ?>/style.css" media="screen" />Le lien correspond à : .../xmedia/theme/nomdudossierdutheme/style.css
Pour que le style switcher fonctionne, il faut désactiver la mise en cahe de Plume : dans l'interface manager (administration) de votre Plume, aller dans Outils / Configuration de PLUME CMS et mettre OUI dans "Afficher les informations de deguggage".