Forum CMS Made Simple Francophone

Aide francophone sur CMS Made Simple

Vous n'êtes pas identifié(e).

Annonce

ATTENTION

  • Prenez le temps de rechercher si quelqu'un n'a pas déjà proposé une solution à votre problème. Sur le forum français et sur le wiki
  • Pensez à mettre à jour votre version de CMS Made Simple. Nous ne faisons de support que sur LA dernière version de CMS Made Simple.
  • Renseignez impérativement le formulaire de nouveau message de manière la plus complète que possible. Dans votre CMS utiliser le menu Administration du site/Informations du système en haut Vue au format texte. Ces informations demandées nous permettent de mieux vous aider
  • Ajoutez [Résolu] au début du titre de votre 1er message lorsqu'une solution a été trouvée.

#1 14/12/2011 21:02:06

airelibre
Administrateur
Lieu : Alsace
Inscription : 01/12/2009
Messages : 1 184
Site Web

Gérer facilement ses couleurs de site avec les CSS et Smarty

Bonjour à tous,

Voici la copie d'une astuce que je viens de poster sur le forum anglais - Ça pourra peut-être servir wink

Je vais vous expliquer une technique très simple pour gérer les couleurs sur son site facilement via les CSS et les variables Smarty. Au final, vous disposerez d'une feuille de styles dédiée aux couleurs, et depuis laquelle les couleurs seront reprises pour l'ensemble de vos feuilles de styles. Comme généralement on utilise une palette assez précise pour un site, cela peut faire gagner du temps en cas de changement de couleurs, ou pour éviter d'avoir à aller rechercher le code HTML de LA bonne couleur au sein d'une autre feuille de styles (qui n'a jamais eu ce problème ? wink )

Tout d'abord, créez une nouvelle feuille de styles en allant dans Disposition / Feuilles de styles / Ajouter une feuille de styles. Appelez-la "Couleurs" par exemple.

Dans cette feuille, notez vos couleurs en utilisant cette syntaxe :
[[assign var='Bleu' value='#07addc']]
[[assign var='Rose' value='#e40087']]
[[assign var='Noir' value='#282425']]

Il s'agit d'une syntaxe Smarty classique, excepté que les accolades {} sont remplacées par des crochets [[ ]] - Ceci est nécessaire car les accolades sont réservées à CSS dans les Feuilles de styles.

Enregistrez la feuille et assignez-là à votre / vos gabarits.
Placez ensuite cette feuille de styles en premier dans la liste de vos feuilles de styles associées à chaque gabarit. Comme le gestionnaire de CSS récupère les feuilles de haut en bas, cela vous permettra d'avoir vos futures variables de couleurs disponibles sur toutes les feuilles de styles.

A présent, dans votre autres feuilles de styles, vous pouvez accéder à vos couleurs de cette manière - Par exemple pour la couleur des liens et titres :
a {color: [[$Bleu]]}
h1 {color: [[$Rose]]}

Et voilà ! Et nous n'avons qu'effleuré toutes les possibilités qu'offre smarty au sein des feuilles de styles smile

N'hésitez pas à partager vos astuces sur ce même thème

Hors ligne

#2 23/12/2011 13:02:11

bess
Administrateur
Lieu : Rennes
Inscription : 16/12/2008
Messages : 6 094
Site Web

Re : Gérer facilement ses couleurs de site avec les CSS et Smarty

je rebondis sur le sujet pour dire que [[root_url]] est également disponible par nature dans les feuilles de styles. pratique pour définir des liens complet vers les images

et autre astuce : j'ai dupliqué le plugin /plugins/function.root_url.php que j'ai renommé pour l'occasion function.cdn_url.php

son code :

[== PHP ==]
function smarty_function_cdn_url($params, &$smarty)
{
	global $gCms;
	$config = $gCms->GetConfig();
	return $config['cdn_url'];
}

function smarty_cms_help_function_cdn_url() {
       echo " :) ";
}

function smarty_cms_about_function_cdn_url() {
	echo " :) ";
}
?>

vous ajoutez dans votre config.php :


$config['cdn_url'] = 'http://static.exemple.fr';

ce qui vous permet maintenant d'utiliser [[cdn_url]] dans votre css et {cdn_url} dans vos gabarits et pages.


Alors question à quoi servira d'utiliser deux urls différentes ?

1- un navigateur ne lance que 10 requêtes http simultanées par domaine => vous passez à 20 en feintant
2- permet d'ajuster la politique du serveur pour les requêtes passant par le sous domaine static : pas de cookies, mise en cache plus longue, suppression des ETag ...
3- permet d'externaliser sur un vrai dns (amazon, cloudflare) les data et de ne conserver sur votre serveur que le code php
4- permet d'avoir dans les statistiques d'accès serveur une meilleur vue de la consommation de la BP et éventuellement mettre le doigt plus facilement sur les zones trop gourmandes (une image trop lourde, trop téléchargées, pas mise en cache, ...)

et bien évidement le tout avec zéro modification des fichiers sources hormis cette petite ligne dans config.php smile

Hors ligne

#3 16/02/2012 16:25:22

spamor
Membre
Lieu : Nord de France
Inscription : 16/02/2010
Messages : 79

Re : Gérer facilement ses couleurs de site avec les CSS et Smarty

2 astuces (assign var pour les couleurs et root_url) que j'utilise depuis quelques temps déjà, et qui exliquent pourquoi j'aime tant ce cms : la possibilité d'insérer du smarty, donc dynamique, dans les feuilles de style smile smile smile

bess a écrit :

ce qui vous permet maintenant d'utiliser [[cdn_url]] dans votre css et {cdn_url} dans vos gabarits et pages.

Par contre j'utilisais un sous-domaine jusqu'ici, en dur dans ma feuille css ; je vais gagner du temps avec cette astuce merci !

Hors ligne

#4 16/02/2012 17:39:26

heriquet
Administrateur
Lieu : Stavelot
Inscription : 20/01/2009
Messages : 1 018
Site Web

Re : Gérer facilement ses couleurs de site avec les CSS et Smarty

+1 ! Bess et Airelibre présidents !


www.web-ep.be - Développeur Web Freelance - Développeur/Intégrateur CMS Made Simple (création de sites, développement de modules/plugins/templates sur mesure), spécialisé dans les sites pour l'immobilier.

Hors ligne

#5 16/02/2012 19:22:50

jissey
Administrateur
Lieu : Peyruis
Inscription : 30/10/2009
Messages : 2 541
Site Web

Re : Gérer facilement ses couleurs de site avec les CSS et Smarty

Faillot!


Inscrivez-vous à notre Newsletter sur le site (colonne de droite, en bas).
Vous appréciez CMSMS et l'aide qui vous est fournie ici, aidez-nous en participant au projet.
Formation CMS Made Simple | Création de site CMS Made Simple.

C'est en se plantant qu'on devient cultivé.
J'ai un string dans l'Array (Paris Hilton)

Hors ligne

#6 16/02/2012 20:25:51

heriquet
Administrateur
Lieu : Stavelot
Inscription : 20/01/2009
Messages : 1 018
Site Web

Re : Gérer facilement ses couleurs de site avec les CSS et Smarty

Bon allez pour préserver les susceptibilités : Bess et Airelibre présidents et jissey premier ministre...  big_smile

Dernière modification par heriquet (16/02/2012 20:31:25)


www.web-ep.be - Développeur Web Freelance - Développeur/Intégrateur CMS Made Simple (création de sites, développement de modules/plugins/templates sur mesure), spécialisé dans les sites pour l'immobilier.

Hors ligne

#7 17/02/2012 12:44:16

bess
Administrateur
Lieu : Rennes
Inscription : 16/12/2008
Messages : 6 094
Site Web

Hors ligne

#8 17/02/2012 16:42:29

airelibre
Administrateur
Lieu : Alsace
Inscription : 01/12/2009
Messages : 1 184
Site Web

Re : Gérer facilement ses couleurs de site avec les CSS et Smarty

Merci merci smile

Hors ligne

#9 17/02/2012 16:53:01

heriquet
Administrateur
Lieu : Stavelot
Inscription : 20/01/2009
Messages : 1 018
Site Web

Re : Gérer facilement ses couleurs de site avec les CSS et Smarty

Ils ne nient pas leurs intentions... 'serais pas étonné de les voir demain soir au JT de TF1 pour "s'adresser aux francais"...  big_smile


www.web-ep.be - Développeur Web Freelance - Développeur/Intégrateur CMS Made Simple (création de sites, développement de modules/plugins/templates sur mesure), spécialisé dans les sites pour l'immobilier.

Hors ligne

#10 26/03/2012 17:46:32

spamor
Membre
Lieu : Nord de France
Inscription : 16/02/2010
Messages : 79

Re : Gérer facilement ses couleurs de site avec les CSS et Smarty

Un petit "up" pour préciser ceci concernant les variables de couleurs des feuilles css : si vous associez 2 css ou plus à votre gabarit, les variables ne doivent être déclarées que dans la première des deux. Puisque cmsms va ensuite créer une feuille de style "combined" smile

Hors ligne

#11 26/03/2012 20:08:33

airelibre
Administrateur
Lieu : Alsace
Inscription : 01/12/2009
Messages : 1 184
Site Web

Re : Gérer facilement ses couleurs de site avec les CSS et Smarty

Merci pour l'ajout

Pour ma part, après quelques modifications, j'en suis arrivé à une configuration un peu différente. J'ai à présent mes déclarations de couleurs dans un bloc de contenu globaux, mais en langage smarty classique.

J'appelle alors mon bloc de contenus non pas dans la feuille de styles, mais dans le gabarit de la page, avant le <body>. Cela me permet d'avoir accès à mes couleurs n'importe où (css, templates, etc..). Même si généralement elles ne sont utilisées que pour les feuilles de styles, il arrive parfois qu'on puisse en avoir besoin directement dans le code

Hors ligne

Pied de page des forums