www/plugins/beespip/formulaires/configurer_beespip_couleur.html

   1 <div class="formulaire_spip formulaire_cfg formulaire_#FORM">
   2
   3 <h3 class='titrem'>[(#CHEMIN{images/config/beespip_config-24.png}|image_reduire{24}|inserer_attribut{class,cadre-icone}|inserer_attribut{alt,''})] Configuration de Beespip</h3>
   4
   5 [<p class="reponse_formulaire reponse_formulaire_ok">(#ENV*{message_ok})</p>]
   6 [<p class="reponse_formulaire reponse_formulaire_erreur">(#ENV*{message_erreur})</p>]
   7
   8 <form method="post" action="#ENV{action}">
   9 <div>
  10 #ACTION_FORMULAIRE{#ENV{action}}
  11
  12 Vous pouvez sélectionner un thème parmi ceux proposés ci-dessous puis valider ensuite.<ul>
  13 <li><a href="[(#SELF|parametre_url{couleur_principale,#b83233}|parametre_url{couleur_secondaire_foncee,#8b0b00}|parametre_url{couleur_secondaire_claire,#ff645b}|parametre_url{couleur_fond_page,#ffffff}|parametre_url{couleur_liens,#0070a7}|parametre_url{couleur_liens_survol,#b83233}|parametre_url{couleur_menu_fond,#f5f4f3}|parametre_url{couleur_menu_liens,#666666}|parametre_url{couleur_menu_liens_survol,#000000}|parametre_url{couleur_filets_titres,#ebebeb}|parametre_url{couleur_filets_colonnes,#e8e8e8}|parametre_url{couleur_cadres,#ebebeb}|parametre_url{couleur_fond_formulaires,#f8f8f8})]">Thème bordeaux</a></li>
  14 <li><a href="[(#SELF|parametre_url{couleur_principale,#a8d5a8}|parametre_url{couleur_secondaire_foncee,#3c5e3c}|parametre_url{couleur_secondaire_claire,#6a9746}|parametre_url{couleur_fond_page,#ffffff}|parametre_url{couleur_liens,#d92141}|parametre_url{couleur_liens_survol,#3c5e3c}|parametre_url{couleur_menu_fond,#f5f4f3}|parametre_url{couleur_menu_liens,#666666}|parametre_url{couleur_menu_liens_survol,#000000}|parametre_url{couleur_filets_titres,#ebebeb}|parametre_url{couleur_filets_colonnes,#e8e8e8}|parametre_url{couleur_cadres,#ebebeb}|parametre_url{couleur_fond_formulaires,#f8f8f8})]">Thème vert</a></li>
  15 <li><a href="[(#SELF|parametre_url{couleur_principale,#0078a0}|parametre_url{couleur_secondaire_foncee,#005873}|parametre_url{couleur_secondaire_claire,#4da7c5}|parametre_url{couleur_fond_page,#ffffff}|parametre_url{couleur_liens,#ff9410}|parametre_url{couleur_liens_survol,#df3c00}|parametre_url{couleur_menu_fond,#f5f4f3}|parametre_url{couleur_menu_liens,#666666}|parametre_url{couleur_menu_liens_survol,#000000}|parametre_url{couleur_filets_titres,#ebebeb}|parametre_url{couleur_filets_colonnes,#e8e8e8}|parametre_url{couleur_cadres,#ebebeb}|parametre_url{couleur_fond_formulaires,#f8f8f8})]">Thème bleu</a></li>
  16 <li><a href="[(#SELF|parametre_url{couleur_principale,#e76e06}|parametre_url{couleur_secondaire_foncee,#9f5d00}|parametre_url{couleur_secondaire_claire,#eb7b1b}|parametre_url{couleur_fond_page,#ffffff}|parametre_url{couleur_liens,#6b2b01}|parametre_url{couleur_liens_survol,#0094d3}|parametre_url{couleur_menu_fond,#f5f4f3}|parametre_url{couleur_menu_liens,#666666}|parametre_url{couleur_menu_liens_survol,#000000}|parametre_url{couleur_filets_titres,#ebebeb}|parametre_url{couleur_filets_colonnes,#e8e8e8}|parametre_url{couleur_cadres,#ebebeb}|parametre_url{couleur_fond_formulaires,#f8f8f8})]">Thème orange</a></li></ul>
  17 #SET{couleur_principale,#EVAL{$_GET['couleur_principale']}|sinon{#ENV{couleur_principale}}}
  18 #SET{couleur_secondaire_foncee,#EVAL{$_GET['couleur_secondaire_foncee']}|sinon{#ENV{couleur_secondaire_foncee}}}
  19 #SET{couleur_secondaire_claire,#EVAL{$_GET['couleur_secondaire_claire']}|sinon{#ENV{couleur_secondaire_claire}}}
  20 #SET{couleur_fond_page,#EVAL{$_GET['couleur_fond_page']}|sinon{#ENV{couleur_fond_page}}}
  21 #SET{couleur_principale_texte,#EVAL{$_GET['couleur_principale_texte']}|sinon{#ENV{couleur_principale_texte}}}
  22 #SET{couleur_titres,#EVAL{$_GET['couleur_titres']}|sinon{#ENV{couleur_titres}}}
  23 #SET{couleur_liens,#EVAL{$_GET['couleur_liens']}|sinon{#ENV{couleur_liens}}}
  24 #SET{couleur_liens_survol,#EVAL{$_GET['couleur_liens_survol']}|sinon{#ENV{couleur_liens_survol}}}
  25 #SET{couleur_menu_fond,#EVAL{$_GET['couleur_menu_fond']}|sinon{#ENV{couleur_menu_fond}}}
  26 #SET{couleur_menu_liens,#EVAL{$_GET['couleur_menu_liens']}|sinon{#ENV{couleur_menu_liens}}}
  27 #SET{couleur_menu_liens_survol,#EVAL{$_GET['couleur_menu_liens_survol']}|sinon{#ENV{couleur_menu_liens_survol}}}
  28 #SET{couleur_filets_titres,#EVAL{$_GET['couleur_filets_titres']}|sinon{#ENV{couleur_filets_titres}}}
  29 #SET{couleur_filets_colonnes,#EVAL{$_GET['couleur_filets_colonnes']}|sinon{#ENV{couleur_filets_colonnes}}}
  30 #SET{couleur_cadres,#EVAL{$_GET['couleur_cadres']}|sinon{#ENV{couleur_cadres}}}
  31 #SET{couleur_fond_formulaires,#EVAL{$_GET['couleur_fond_formulaires']}|sinon{#ENV{couleur_fond_formulaires}}}
  32 Vous pouvez aussi sélectionner vos propres couleurs.<p />
  33 <fieldset><legend><img src="[(#CHEMIN{prive/themes/spip/images/couleur.png})]" style="margin-bottom:-8px;" /> <strong>Choix des couleurs principales des aplats et certains textes</strong></legend>
  34         <label for="beespip_couleur_principale">Couleur principale du site</label>
  35         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_principale}}
  36         <input type="text" name="couleur_principale" id="beespip_couleur_principale" value="#GET{couleur_principale,#b83233}" data-hex="true" size="7" class="beestyle" />
  37         <p />
  38         <label for="beespip_couleur_secondaire_foncee">Couleur secondaire (plus foncée)</label>
  39         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_secondaire_foncee}}
  40         <input type="text" name="couleur_secondaire_foncee" id="beespip_couleur_secondaire_foncee" value="#GET{couleur_secondaire_foncee,#8b0b00}" data-hex="true" size="7" class="beestyle" />
  41         <p />
  42         <label for="beespip_couleur_secondaire_claire">Couleur secondaire (plus claire)</label>
  43         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_secondaire_claire}}
  44         <input type="text" name="couleur_secondaire_claire" id="beespip_couleur_secondaire_claire" value="#GET{couleur_secondaire_claire,#ff645b}" data-hex="true" size="7" class="beestyle" />
  45         <p />
  46         <label for="beespip_couleur_fond_page">Couleur de fond de page</label>
  47         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_fond_page}}
  48         <input type="text" name="couleur_fond_page" id="beespip_couleur_fond_page" value="#GET{couleur_fond_page,#ffffff}" data-hex="true" size="7" class="beestyle" />
  49 </fieldset>
  50
  51 <fieldset><legend><strong>Choix des couleurs des textes et liens</strong></legend>
  52         <label for="beespip_couleur_principale_texte">Couleur principale du texte</label>
  53         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_principale_texte}}
  54         <input type="text" name="couleur_principale_texte" id="beespip_couleur_principale_texte" value="#GET{couleur_principale_texte,#666666}" data-hex="true" size="7" class="beestyle" />
  55         <p />
  56         <label for="beespip_couleur_titres">Couleur des titres (balises h1, h2, ...)</label>
  57         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_titres}}
  58         <input type="text" name="couleur_titres" id="beespip_couleur_titres" value="#GET{couleur_titres,#444444}" data-hex="true" size="7" class="beestyle" />
  59         <p />
  60         <label for="beespip_typo_titre_lien"><strong>Typographie des titres (balises h1, h2, ...)</strong></label><br />Vous pouvez définir une police spécifique pour vos titres. Pour cela accéder au répertoire <a href="http://www.google.com/webfonts" title="Google WebFonts" onclick="window.open(this.href); return false;">Google WebFonts</a> et identifier une police qui vous convient, et cliquez sur "Quick-use".<br />
  61         Copier dans le champ ci-dessous le contenu du bloc : "3. Add this code to your website:" qui doit ressembler à<br />
  62         <code>&lt;link href='http://fonts.googleapis.com/css?family=Electrolize' rel='stylesheet' type='text/css'&gt;</code><br />
  63         <input type="text" name="typo_titre_lien" id="beespip_typo_titre_lien" value="#ENV{typo_titre_lien}" data-hex="true" size="44" class="fondl" /><br />
  64         Ensuite copier ci-dessous la partie 4, qui doit ressembler à<br />
  65         <code>font-family: 'Electrolize', sans-serif;</code><br />
  66         <input type="text" name="typo_titre" id="beespip_typo_titre" value="#ENV{typo_titre}" data-hex="true" size="44" class="fondl" />
  67         <p />
  68         <label for="beespip_couleur_liens">Couleur des liens</label>
  69         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_liens}}
  70         <input type="text" name="couleur_liens" id="beespip_couleur_liens" value="#GET{couleur_liens,#0070a7}" data-hex="true" size="7" class="beestyle" />
  71         <p />
  72         <label for="beespip_couleur_liens_survol">Couleur des liens survolés</label>
  73         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_liens_survol}}
  74         <input type="text" name="couleur_liens_survol" id="beespip_couleur_liens_survol" value="#GET{couleur_liens_survol,#0070a7}" data-hex="true" size="7" class="beestyle" />
  75 </fieldset>
  76
  77 <fieldset><legend><strong>Choix des couleurs du menu</strong></legend>
  78         <label for="beespip_couleur_menu_fond">Couleur de fond du menu</label>
  79         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_menu_fond}}
  80         <input type="text" name="couleur_menu_fond" id="beespip_couleur_menu_fond" value="#GET{couleur_menu_fond,#f5f4f3}" data-hex="true" size="7" class="beestyle" />
  81         <p />
  82         <label for="beespip_couleur_menu__liens">Couleur des liens du menu</label>
  83         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_menu_liens}}
  84         <input type="text" name="couleur_menu_liens" id="beespip_couleur_menu__liens" value="#GET{couleur_menu_liens,#666666}" data-hex="true" size="7" class="beestyle" />
  85         <p />
  86         <label for="beespip_couleur_menu__liens_survol">Couleur des liens survolés du menu</label>
  87         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_menu_liens_survol}}
  88         <input type="text" name="couleur_menu_liens_survol" id="beespip_couleur_menu__liens_survol" value="#GET{couleur_menu_liens_survol,#000000}" data-hex="true" size="7" class="beestyle" />
  89
  90 </fieldset>
  91
  92 <fieldset><legend><strong>Autres couleurs</strong></legend>
  93         <label for="beespip_couleur_fond_formulaires">Couleur de fond des formulaires</label>
  94         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_fond_formulaires}}
  95         <input type="text" name="couleur_fond_formulaires" id="beespip_couleur_fond_formulaires" value="#GET{couleur_fond_formulaires,#f8f8f8}" data-hex="true" size="7" class="beestyle" />
  96         <p />
  97         <label for="beespip_couleur_filets_titres">Couleur des filets de titre</label>
  98         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_filets_titres}}
  99         <input type="text" name="couleur_filets_titres" id="beespip_couleur_filets_titres" value="#GET{couleur_filets_titres,#ebebeb}" data-hex="true" size="7" class="beestyle" />
 100         <p />
 101         <label for="beespip_couleur_filets_colonnes">Couleur des filets de séparation de colonne</label>
 102         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_filets_colonnes}}
 103         <input type="text" name="couleur_filets_colonnes" id="beespip_couleur_filets_colonnes" value="#GET{couleur_filets_colonnes,#e8e8e8}" data-hex="true" size="7" class="beestyle" />
 104         <p />
 105         <label for="beespip_couleur_cadres">Couleur des cadres</label>
 106         #SET{erreurs,#ENV**{erreurs}|table_valeur{couleur_cadres}}
 107         <input type="text" name="couleur_cadres" id="beespip_couleur_cadres" value="#GET{couleur_cadres,#ebebeb}" data-hex="true" size="7" class="beestyle" />
 108 </fieldset>
 109 <p />
 110
 111         <input type="hidden" name="_meta_casier" value="BeeSpip/couleur" />
 112         <p class="boutons">
 113                 <input type="submit" name="_cfg_ok" value="<:bouton_enregistrer:>" class="submit" />
 114         </p>
 115 </div>
 116 </form>
 117 </div>